Is there an addon which you can test css selectors in firefox?

Solution 1:

Edit 2019-12-04:

The firefinder addon no longer exists, but you can use the developer console (press F12), and the $$ function to get elements matching a selector, eg. to select all divs: $$('div')

Old answer:

FireFinder does exactly what you are looking for. You can evaluate either CSS, or XPath expressions, it will list the matching elements, and also draw a red border around them.

Solution 2:

Yes you can go for FireBug, a versatile Firefox web development add-on.

_{(source: getfirebug.com)}

To test a CSS selector, go to the "Console" tab and enter a command in the bottom form (more info on how to find the command line).

Inside the command line use the $$("your CSS selector") syntax to test CSS selectors, explained in more detail here. For example use this command to select everything:

$$("body")

Solution 3:

Here's how to use the built in CSS query selector in Firefox:

Go to Tools > Web Developer > Web Console

Also, you could press ctrl shift i in Windows/Linux, or cmd opt i in Mac.

Type in your CSS selector (using traditional $$() syntax) at the very bottom left corner.

The object node list will appear on the right hand panel of the console.

$$('div')
[object NodeList]
$$('div').length
42

This is handy for Selenium Webdriver instances of Firefox, where having an extension isn't feasible.