Update: John Firebaugh figured out a better way to do this and made a gem out of it! So ignore this post, and use the capybara-firebug gem instead.

Today I was debugging a failing test in a Selenium / Capybara suite, and I really needed Firebug. In fact, I decided everyone on the team should have Firebug available in tests, ideally without any manual setup.

Of course, I searched to see if someone had already accomplished this, but I found only a few useful hints, none of which gave complete instructions. So here’s what I did.

Step 1: Configure Capybara to include Firebug

By default, Capybara launches Firefox with an empty profile. It turns out to be pretty easy to make it include Firebug in the profile. Put this code in an initializer (we’re using Cucumber, so this goes in features/support/firebug.rb or thereabouts):

require 'selenium/webdriver'

Capybara.register_driver :selenium do |app|
  profile = Selenium::WebDriver::Firefox::Profile.new
  profile.add_extension File.join(Rails.root, "features/support/firebug.xpi")
  Capybara::Driver::Selenium.new app, :profile => profile
end

Note the path features/support/firebug.xpi, which is where you’ll put a copy of firebug.xpi. You can retrieve that from the Firebug downloads page.

Unfortunately, the first thing Firebug does when it starts up is to look at the version of the previously-installed Firebug. If it thinks you’ve just upgraded, it launches a tab for the changelog page to show you the great new features. Depending on how your tests are written, that might be fine. My tests broke, so I needed to get rid of the welcome page.

Step 2: Rejigger Firebug to eliminate the welcome page

Reading the Firebug code, I saw that the welcome page logic pretty much insists on showing the page on a new install. It compares its version number with the value stored in the extensions.firebug.currentVersion preference (initialized to ""), and if it’s greater, up comes the page.

I didn’t want to change the code, so I decided to set the initial value of the preference to a very high number, thus ensuring that Firebug will never think it’s been upgraded. However, it wasn’t apparent how to jam a bit of JavaScript into the browser launch process to do that. Instead, I decided to just patch firebug.xpi to change it.

The code uses Unix utilities, so if you’re on Windows without Cygwin you’ll have to figure out an equivalent for the embedded script. Please send it to me if you do.

Step 3: Profit!!!

Or at least profit a little faster, because now you can find those tricky DOM problems in your tests with the help of the fabulous Firebug.