Subscribe to RSS Feed

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);
?>


Rss Commenti

16 Comments

  1. Great idea, i was going to try something similar with the PageSpeed plugin but this just as good. Well done.

    #1 Matt Fellows
  2. @Matt Fellows: Yeah, good idea. AFAIK PageSpeed exists as an extension for Firebug so, some more performance related information could be exported.

    #2 Honza
  3. Cool. But is it possible to enable Persit mode on net panel in order to get one HAR file?

    #3 Igor Skomorokh
  4. [...] на 12 июля, так что регистрация продляется. А пока что читаем, как с помощью Selenium 2 и Firefox можно провести [...]

    #4 Перенос вебинара по Continuous Integration | Open Space
  5. Hi

    I am longing to know how to auto export yslow result to a local folder? Can you advise? I havent found any preference that allows me to do it.

    Don

    #5 Don
  6. I've tried the program in windows and it works great, however in the following line:
    profile.setPreference(domain + "netexport.defaultLogDir", "C:\\Downloads\\_har\\");

    I tried to change it so that it would work in either windows or Linux by changing it to:
    profile.setPreference(domain + "netexport.defaultLogDir", "/Downloads/_har/");

    I'm not having any luck so far as the directories and .har file are not created.

    #6 Pierre
  7. Pierre, did you have any luck yet exporting the files in the Linux environment?

    #7 Izabela
  8. awesome -

    #8 krish
  9. Failed to connect to binary FirefoxBinary(C:\Program Files\Mozilla Firefox\firefox.exe) on port 7055; process output follows:

    I am getting this error when i am running the script.. can any1 help me out to come out of this error

    #9 vinay
  10. Thanks for post. I am facing one issue with respect to data which is exported from net panel. For one operation on page only 26 requests are exported to har file and not all the requests. I gave more than 1 minute wait period but yet see only 26 requests in the exported har file. While in the net export panel of browser I can see all the request during test run. Did I miss any thing?

    #10 Tarun
  11. thanks admin

    #11 Moncler Outlet
  12. I tried to execute this on windows but its giving issues like
    NetExport 0.9b2.xpi (The system cannot find the file specified)

    where do i find netexport and firebug xpi files in my system.

    FF version: 15.0.1
    OS:XP

    Looking solutions for this issue..

    #12 Hemanth
  13. Great help to me,
    thank you.

    Best regards: Joyfax Server

    #13 Nicole Lee
  14. I already have Selenium with Firebug running successfully. I tried adding NetExport, but it is not working.

    First, when FF launches, I get the 'Firefox is not your default browser' dialog, with he option to make FF my default, and to check every time.

    This only occurs when I have the four additional lines specified for NetExport in the code above (AddExtension and SetPreference for the 3 preferences). Also, once I click on something, I get a socket exception and WebDriver cannot find the browser.

    Windows 7 Enterprise
    FF 16
    Selenium 2.25.1 (Windows/.NET)
    Firebug 1.10.5
    NetExport 0.9b2

    #14 Erich
  15. Hi Jan,

    Is there any chance selenium-java-2.25.0.zip can also be supported?

    Thanks
    Laura

    #15 Laura
  16. I just tried this with selenium-java-2.25 standalone jar file and it worked.

    #16 Usha

Sorry, the comment form is closed at this time.