HttpWatch added Chrome support earlier this year and with version 11.1 it now also supports the use of Chrome through the automation API.

In a previous blog post we covered how to measure page load times with HttpWatch for new and existing users by clearing the cache to simulate a new user. Adapting this code for Chrome is as simple as changing one line of code to use the Chrome property.

Here’s the C# code for measuring the page load time for a new user:

// Set a reference to the HttpWatch COM library
// to start using the HttpWatch namespace
//
// This code requires HttpWatch version 11.1
//
 
using HttpWatch;                
 
namespace EmptyCacheTest
{
    class Program
    {
        static void Main(string[] args)
        {
            string url = "https://www.httpwatch.com/download/";
            Controller controller = new Controller();
 
            // Create an instance of Chrome
            Plugin plugin = controller.Chrome.New();                
 
            // Clear out all existing cache entries
            plugin.ClearCache();                
 
            plugin.Record();
            plugin.GotoURL(url);                
 
            // Wait for the page to download
            controller.Wait(plugin, -1);                
 
            plugin.Stop();                
 
            // Find the load time for the first page recorded
            double pageLoadTimeSecs =
                plugin.Log.Pages[0].Entries.Summary.Time;                
 
            System.Console.WriteLine( "The empty cache load time for '" +
                url + "' was " + pageLoadTimeSecs.ToString() + " secs");                
 
            // Uncomment the next line to save the results
            // plugin.Log.Save(@"c:\temp\emptytestcache.hwl");                
 
            plugin.CloseBrowser();
        }
    }
}

And here’s the code to measure the page load time after priming the cache:

// Set a reference to the HttpWatch COM library
// to start using the HttpWatch namespace
//
// This code requires HttpWatch version 11.1
//
using HttpWatch;               
 
namespace PrimedCacheTest
{
    class Program
    {
        static void Main(string[] args)
        {
            string url = "https://www.httpwatch.com/download/";
            Controller controller = new Controller();               
 
            // Create an instance of Chrome
            Plugin plugin = controller.Chrome.New();               
 
            // Visit the page to prime the cache
            plugin.GotoURL(url);
            plugin.Record();
            controller.Wait(plugin, -1);               
 
            // Shutdown Chrome and create a new instance
            plugin.CloseBrowser();
            plugin = controller.Chrome.New();               
 
            plugin.Record();               
 
            // Visit the page a second time with the cache primed
            plugin.GotoURL(url);
            controller.Wait(plugin, -1);               
 
            plugin.Stop();               
 
            // Find the load time for the first page recorded
            double pageLoadTimeSecs =
                plugin.Log.Pages[0].Entries.Summary.Time;               
 
            System.Console.WriteLine( "The primed cache load time for '" +
                url + "' was " + pageLoadTimeSecs.ToString() + " secs");               
 
            // Uncomment the next line to save the results
            // plugin.Log.Save(@"c:\temp\emptytestcache.hwl");               
 
            plugin.CloseBrowser();
        }
    }
}

By default the Chrome.New() method creates a new tab in the official release of Chrome installed on your PC but by passing a Chrome channel name you can also use other installed versions:

// Create an instance of Chrome (Beta channel)
Plugin plugin = controller.Chrome.New("Beta");

There’s more information available in the documentation for the New method.

Occasionally, our customers run into a problem when installing HttpWatch on a PC or server that has no internet access, e.g. to test web servers in a locked down production environment. The HttpWatch add-on for Internet Explorer installs and works correctly but the HttpWatch Chrome extension is not added because access to the Google Web Store is required for automatic installation.

Without an internet connection the HttpWatch Chrome extension has to be manually added using the steps shown in this blog post. Although the details below relate to HttpWatch, the same technique can be used to install any Chrome extension to an offline PC.

Step #1 – Download the Chrome Extension’s CRX file

Chrome extensions are packaged in CRX files and they can be manually downloaded from the Google Web Store. You’ll need to do that on another PC that is connected to the internet by either using a Google Chrome extension such as the Get CRX extension or by using the following download URL:

https://clients2.google.com/service/update2/crx?response=redirect&prodversion=78&acceptformat=crx2,crx3&x=id%3Ddajhhgiioackgdldomhppobgjbinhimh%26uc

(Download using a different browser as Chrome will block an attempt to access a CRX file.)

The general form of this download URL is:

https://clients2.google.com/service/update2/crx?response=redirect&prodversion=[PRODVERSION]&acceptformat=crx2,crx3&x=id%3D[EXTENSIONID]%26uc

Where [PRODVERSION] is the version of Chrome you’re using and [EXTENSIONID] is the extension ID. You can find the ID by looking at the extension in the Web Store and noting the last part of the URL. The acceptformat=crx2,crx3 argument is required for recent versions of Chrome that use the CRX3 header format.

For example, the ID of the HttpWatch extension is ‘dajhhgiioackgdldomhppobgjbinhimh’:

UPDATE: The CRX file is now available in the HttpWatch install directory (version 11.0.25+).

Step #2 – Add the CRX file to Chrome

Copy the CRX file to the offline PC and then open the Chrome extensions page (chrome:://extensions). Make sure that Developer Mode is enabled. Drag and drop the CRX file onto the extensions page to manually add the extension to Chrome:

After clicking ‘Add Extension’ the HttpWatch extension will be available in Chrome:

The extension is now fully installed and available for use. Of course, you will not receive automatic updates to the extension unless you connect to the internet or repeat steps 1) and 2). You can turn off Developer Mode again after installing the extension.

UPDATE #1: If you get a “Package is invalid ‘CRX_HEADER_INVALID'” error check that you are using the acceptformat=crx2,crx3 argument in the download URL.

UPDATE #2: recent versions of Chrome reject the CRX with the error “Apps, extensions and user scripts cannot be added from this website”. A work-around for this error is to enable Developer Mode on the extensions page. You can switch Developer Mode off again after you have installed the extension.

Customers have been asking us to add Chrome support to HttpWatch for the last eight years or so. It’s taken much longer than we hoped, but we are excited to finally support the Chrome browser in HttpWatch 11.

Once you install HttpWatch 11 and approve the extension in Chrome you get an HttpWatch button in the toolbar:

and a context menu item:

Nearly all the features from HttpWatch for IE are available in the Chrome extension including advanced Find/Filter, customizable columns, info tips, password masking and more. Here’s a screenshot from the HttpWatch Chrome extension showing whether HTTP/2 is used and recording traffic across multiple pages:

There are few areas where we weren’t able to provide the same functionality:

• No Streams tab
• No Cache tab
• Automation API is not yet available but will be added in version 11.1
• No Render Start page event
• The HttpWatch window is always undocked from Chrome

Where possible we will address these limitations in future updates. As with previous versions there’s a free Basic edition and a paid for Professional edition allowing the easy collection of detailed log files from customers or in-house users.

We have also improved the HAR compatibility in this release – it’s now possible to save (Cache) and failing requests in a HAR log file:

Customers who purchased HttpWatch Professional 10.x on or after February 22nd 2017, or had a maintenance agreement that was active on May 22nd 2017, can use their existing license key to install version 11.x. You can check whether a free or paid upgrade to HttpWatch Professional 11.x is available by going to Help->Check For Updates.