Automate Page Load Performance Testing with Firebug and Selenium

from http://www.softwareishard.com/blog/firebug/automate-page-load-performance-testing-with-firebug-and-selenium/

Firebug's Net panel is well known and indispensable tool for debugging and testing page load performance. Its purpose is to provide detailed timing information about HTTP traffic initiated by a web page.

Also, all data collected by the Net panel can be exported into a HAR file and processed by other tools (e.g. you can use online viewer for preview).

Finally, it's also possible to automate the entire page-load-test-and-export process using Selenium. So, if it sounds interesting to you read more about how to setup Firebug, NetExport and Selenium to automatically measure performance of your site!

 

Setup

In order to create a simple page load test-bot we need following components:

• Firebug Download from Mozilla add-on site.
• NetExport Firebug extension for exporting data collected by the Net panel. You can download from here.
• Selenium 2 Selenium is a suite of tools specifically for automating web browsers. Latest releases of Selenium components are available here. You need to download the latest version of selenium-server-standalone-X.XX.X.jar.

Selenium supports several languages for developing client drivers (tests). I am using Java in this post.

Here is my configuration:

• firebug-1.9.2.xpi
• netExport-0.8.xpi
• selenium-server-standalone-2.23.1.jar

(all located in the same directory)

Test Driver

The next step is writing the client driver. If you are new to Selenium you can read The 5 Minute Getting Started Guide.

Let's see the first example of a client driver:

import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.firefox.FirefoxProfile;

 

public class Example {
    public static void main(String[] args) {
        FirefoxProfile profile = new FirefoxProfile();
        WebDriver driver = new FirefoxDriver(profile);
        driver.quit();
    }
}

The test is using Firefox driver (coming from selenium-server-standalone.jar) to automate Firefox browser. The driver itself is an xpi that is added to the Firefox profile when you start a new instance of FirefoxDriver class.

Store the code into Example.java file and compile as follows (assuming selenium-server-standalone-2.23.1.jar is in the same directory):

javac -cp selenium-server-standalone-2.23.1.jar Example.java

As soon as Example.class is ready, run it:

java -cp .;selenium-server-standalone-2.23.1.jar Example

You should see that Firefox browser is opened and immediately closed.

* Use ":" instead of ";" to separate paths on Linux
* Of course, you can use your favorite Java IDE and also properly set CLASSPATH so you don't need the -cp argument

Next step is to auto-install Firebug and NetExport into your test Firefox profile.

File firebug = new File("firebug-1.9.2.xpi");
File netExport = new File("netExport-0.8.xpi");

 

profile.addExtension(firebug);
profile.addExtension(netExport);

The code assumes that firebug-1.9.2.xpi and netExport-0.8.xpi are available in the same directory.

We also need to configure some preferences in our test profile.

// Set default Firefox preferences
profile.setPreference("app.update.enabled", false);

 

String domain = "extensions.firebug.";

// Set default Firebug preferences
profile.setPreference(domain + "currentVersion", "1.9.2");
profile.setPreference(domain + "allPagesActivation", "on");
profile.setPreference(domain + "defaultPanelName", "net");
profile.setPreference(domain + "net.enableSites", true);

// Set default NetExport preferences
profile.setPreference(domain + "netexport.alwaysEnableAutoExport", true);
profile.setPreference(domain + "netexport.showPreview", false);
profile.setPreference(domain + "netexport.defaultLogDir", "C:\\har\\");
 

• app.update.enabled Disable Firefox auto update
• currentVersion Avoid Firebug start page
• allPagesActivation Firebug is activated for all pages by default
• defaultPanelName The Net panel is selected by default
• net.enableSites Firebug Net panel is enabled by default
• netexport.defaultLogDir Store HAR files here
• netexport.showPreview Do not show a preview for exported data

You can check out list of all Firebug preferences on wiki.

The last step is opening a web-page and let Firebug to collect data and NetExport to export it.

// Wait till Firebug is loaded
Thread.sleep(5000);

 

// Load a test page
driver.get("http://www.softwareishard.com");

// Wait till HAR is exported
Thread.sleep(5000);

• Firebug is loaded asynchronously so, we need to give it a time to load.
• Exporting is done after the page is loaded. Again, give it some time to export before closing the test.

Here is the complete code:

import java.io.*;
import java.util.concurrent.TimeUnit;
import java.util.concurrent.*;
import java.lang.InterruptedException;
 

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.firefox.FirefoxProfile;

import org.openqa.selenium.support.ui.Wait;
import org.openqa.selenium.support.ui.WebDriverWait;

public class Example  {
    public static void main(String[] args) {
        FirefoxProfile profile = new FirefoxProfile();

        File firebug = new File("firebug-1.10.0a11.xpi");
        File netExport = new File("netExport-0.8b22.xpi");

        try
        {
            profile.addExtension(firebug);
            profile.addExtension(netExport);
        }
        catch (IOException err)
        {
            System.out.println(err);
        }

        // Set default Firefox preferences
        profile.setPreference("app.update.enabled", false);

        String domain = "extensions.firebug.";

        // Set default Firebug preferences
        profile.setPreference(domain + "currentVersion", "2.0");
        profile.setPreference(domain + "allPagesActivation", "on");
        profile.setPreference(domain + "defaultPanelName", "net");
        profile.setPreference(domain + "net.enableSites", true);

        // Set default NetExport preferences
        profile.setPreference(domain + "netexport.alwaysEnableAutoExport", true);
        profile.setPreference(domain + "netexport.showPreview", false);
        profile.setPreference(domain + "netexport.defaultLogDir", "C:\\Downloads\\_har\\");

        WebDriver driver = new FirefoxDriver(profile);

        try
        {
            // Wait till Firebug is loaded
            Thread.sleep(5000);

            // Load test page
            driver.get("http://www.janodvarko.cz");

            // Wait till HAR is exported
            Thread.sleep(10000);
        }
        catch (InterruptedException err)
        {
            System.out.println(err);
        }

        driver.quit();
    }
}

That's it. Compile, run and checkout the c:/har directory!

Send HAR files to Server

Let's yet modify the scenario so, exported HAR files are not stored locally, but sent to a server (could be a HAR database). All we need to do is just setting several more preferences.

profile.setPreference(domain + "netexport.beaconServerURL", "http://localhost/har-db");
profile.setPreference(domain + "netexport.autoExportToFile", false);
profile.setPreference(domain + "netexport.autoExportToServer", true);
profile.setPreference(domain + "netexport.sendToConfirmation", false);
 

• netexport.beaconServerURL Exported HAR files will be sent to this URL
• netexport.autoExportToFile Do not save HARs into files in this scenario
• netexport.autoExportToServer Send files to the server
• netexport.sendToConfirmation Do not open a confirmation dialog when sending a HAR file

Here is a simple PHP script that get's the posted HAR file and stores it in the current directory.

<?php
    $url = $_REQUEST["url"];
    $host = parse_url($url, PHP_URL_HOST);
    $filename = $host.'-'.date('h.i.s').'-log.har';

 

    if (!$handle = fopen($filename, 'a'))
    {
        echo 'File "'.$filename.'" could not be opened';
        exit;
    }

    ob_start();
    $content = file_get_contents('php://input');
    $content .= "\n";
    ob_clean();

    if (!fwrite($handle, $content))
    {
        echo 'Can\'t write into file "'.$filename.'"';
        exit;
    }

    echo "Done!";
    fclose($handle);
?>