You don't know the firefox toolbar

I had no idea that firefox had this little command line toolbar but damn does it pack a punch. Docs can be found here. A small selection of things you can do through the command line is take a screenshot of the whole page, highlight all nodes that match a selector, emulate media types, inject libraries directly into the page, and log all function calls to the console.You can even create your own commands which I’ll get into at the end. I don’t know about you but all this makes me giddy just thinking about some of these things..

Get Started

1. Press Shift+F2
2. Profit

The Skinny

• It seems to persist across tabs once opened (just press Shift+F2 to focus on the toolbar)
• Yes, there’s auto-complete.
• Cycle through the suggestions by pressing Up or Down.
• Press F1 to see all suggestions in a list.
• If you want to see all the commands just type help
• Get information about one command by typing help <command>

My Favorite Commands

• eyedropper - select color from the page
• folder open <path> - Opens a folder on your system
• highlight <selector> [--hideguides] [--showinfobar] [--showall] [--keep]
  • --hideguides - Hide the guidelines on the page
  • --showinfobar - Show info above each selector (tagname, attributes, dimension)
  • --showall - This command automatically shows the first 100 only to improve speed. Use this if you want all to be shown at once.
  • --keep - Keep this selector highlighted (by default the highlights disappear after another highlight command is called)
• media <emulate / reset> <media value> - Allows for css media emulation (media emulate print for print version)
• resize <off / on / to / toggle> - Toggle responsive mode (you can specify dimensions with: resize to <width> <height>)
• screenshot <filename> [--clipboard] [--delay ...] [--dpi ...] [--fullpage] [--selector ...]
  • <filename> - Desired filename (make sure you add .png to the end)
  • --clipboard - Copy screenshot to clipboard
  • --delay # - Delay taking the screenshot by # seconds
  • --dpi # - Set the dpi
  • --fullpage - If you want to take a screenshot of the full page
  • --selector ... - If you only want to take a screenshot of a certain css selector

Note: inspect <selector> works in theory but I keep getting an error when I try to use it. It would be great though..

Other Useful Commands

• cookie <list / remove / set> - List and change active cookies
• jsb <url> - Beautifies JavaScript file (useful for looking into minified resources)
• inject <library> - Injects the requested library into the current page (use a valid script URI)
• restart - Restarts firefox (can enable safemode with --safemode)
• paintflashing <on / off> - Enables or disables paintflashing (highlights areas that are repainted based on events and so on)

There you have it. If you want to see the full docs just go here.