How to Execute JavaScript With Firebug

Firebug is Firefox add-on that allows you to experiment, test and troubleshoot HTML, CSS or JavaScript code on any website. Firebug is extremely useful when developing web pages and it displays an error message log to help you troubleshoot websites. You can also use it to set breakpoints or test the performance of the site's JavaScript functions.

Difficulty: Moderate

Instructions

1. Sign into your Firebug account on the website on which you want to execute the JavaScript. Navigate to the Document Object Model (DOM) pane of Firebug.

2. Click on the "JavaScript Executor" button on the console page. It is located next to the red arrow on the left side.

3. Press the yellow arrow at the bottom of the JavaScript executor window to see a multi-line executor.

4. Enter one or two command lines to execute and press "Enter."

5. Test the website's JavaScript functions and set benchmarks. Add "console.profile([title])" to the start of the JavaScript function and "console.profileEnd()" to the end of the functions you want to benchmark.

6. Switch to the "Script" tab and select a breakpoint from the drop-down list of functions. Click on the number in the left side to set the breakpoint. JavaScript pauses at a particular piece to view the value of the variable.

Tips & Warnings

• Use Firebug's benchmark function to test where your website's performance is failing.
• Use the breakpoint function to test the different values of variables within your web page.