• Skip to main content
  • Select language
  • Skip to search
MDN Web Docs
  • Technologies
    • HTML
    • CSS
    • JavaScript
    • Graphics
    • HTTP
    • APIs / DOM
    • WebExtensions
    • MathML
  • References & Guides
    • Learn web development
    • Tutorials
    • References
    • Developer Guides
    • Accessibility
    • Game development
    • ...more docs
Firefox Developer Tools
  1. MDN
  2. Firefox Developer Tools
  3. Developer Toolbar
  4. Scratchpad

Scratchpad

These instructions are out of date and no longer work. The work to fix them is happening in bug 1160851.

Creating commands using the Scratchpad requires chrome privileges. See the scratchpad documentation for details on how to enable this feature.

Basic Command Template

The simplest command looks like this:

Components.utils.import("resource:///modules/devtools/gcli.jsm");
gcli.addCommand({
  name: 'hello',
  description: 'Show a message',
  params: [
    {
      name: 'name',
      type: 'string',
      description: 'Who to say hello to',
    }
  ],
  exec: function(args, context) {
    return 'Good morning, ' + args.name;
  }
});
Paste that into a new chrome scratchpad, set the environment to "browser" (in the scratchpad's menu) and execute it (CTRL+R) to add a 'hello' command to the command line.

 

More Information

  • Documentation about writing commands

Add-on Compatibility

It's possible to make commands so they can be trivially converted into add-ons. Just use the following template:

Components.utils.import("resource://gre/modules/devtools/gcli.jsm");
var helloCommandSpec = {
  name: 'hello',
  description: 'Show a message',
  params: [
    {
      name: 'name',
      type: 'string',
      description: 'Who to say hello to',
    }
  ],
  exec: function(args, context) {
    return 'Good morning, ' + args.name;
  }
}
// The boiler plate below allows this module to be exported as a Firefox add-on
// If you don't need add-on compatibility, you just need to call
//   gcli.addCommand(helloCommandSpec);
function startup(data, reason) {
  gcli.addCommand(helloCommandSpec);
}
function shutdown(data, reason) {
  // addCommand automatically removes any old commands, but to be tidy ...
  gcli.removeCommand(helloCommandSpec);
}
var __SCRATCHPAD__ = !(typeof(window) == "undefined");
if (__SCRATCHPAD__ && (typeof(window.gBrowser) == "undefined")) {
  throw new Error("Must be run in a browser scratchpad.");
}
if (__SCRATCHPAD__) {
  shutdown();
  startup();
}
function install(data, reason) { }
function uninstall(data, reason) { }

 

Document Tags and Contributors

 Contributors to this page: jwalker, yfdyh000, Mncwango.celimpilo, StephenKelly, maximelore, joewalker, pimmhogeling
 Last updated by: jwalker, Apr 25, 2016, 12:47:07 AM
  1. Core Tools
    1. Page Inspector
    2. Web Console
    3. JavaScript Debugger
    4. Network Monitor
    5. Performance
    6. Responsive Design Mode
    7. Tips
  2. More Tools
    1. Memory
    2. Storage Inspector
    3. DOM Property Viewer
    4. Developer Toolbar
    5. Eyedropper
    6. Screenshot
    7. Scratchpad
    8. Style Editor
    9. Shader Editor
    10. Web Audio Editor
  3. Connecting the devtools
    1. about:debugging
    2. Connecting to Firefox for Android
    3. Connecting to iframes
    4. Connecting to other browsers
  4. Debugging the browser
    1. Browser Console
    2. Browser Toolbox
  5. Extending the devtools
    1. Adding a panel to the toolbox
    2. Example devtools add-ons
    3. Remote Debugging Protocol
    4. Stream Transport
    5. Source Editor
    6. The Debugger Interface
    7. Web Console custom output
  6. Settings
  7. Release notes