4

I am trying to develop CSS selectors to use with Selenium. In particular I want to use the pseudo-class :contains(). Although the W3 has a draft of CSS3 with :contains() it appears that the final version didn't include it.

I am using Chrome's tools to help me check my CSS selectors and make sure I am doing it right. Chrome doesn't appear to implement :contains(), which is understandable.

Is there a tool that I can use that will allow me to try out selectors that use :contains() on our webpages?

I am using a Mac with Lion. I am also potentially limited to using Firefox 3.5.7 (I was told to hold off on updating for now).

BoltClock
  • 630,065
  • 150
  • 1,295
  • 1,284
Huliax
  • 1,341
  • 1
  • 13
  • 25

2 Answers2

8

jQuery's selector engine also implements the :contains() pseudo-class. It is to my knowledge that jQuery and Selenium implement it the same way.

I'm not sure how you would be able to test it on sites that don't make use of jQuery, but on sites that do, it's just a matter of firing up your browser's JavaScript console, and running jQuery selectors in the console.

Here's an example with viewing this very Stack Overflow question on Chrome's JavaScript console (you may get different results depending on whether you're logged in or not):

> $("#mainbar div[id]:contains('selector')").get() /* DOM objects with .get() */

[<div class=​"question" id=​"question">​…​</div>​, <div id=​"answers">​…​</div>​, <div id=​"answer-9007154" class=​"answer">​…​</div>, <div id=​"answer-9008184" class=​"answer">​…​</div>​]
Community
  • 1
  • 1
BoltClock
  • 630,065
  • 150
  • 1,295
  • 1,284
  • 1
    Many selector engines, like Sizzle (jquery) or Slick (mootools) - implement `:contains` selector. – c69 Jan 25 '12 at 19:04
1

I'm not seeing the :contains() selector anywhere and have never encountered it myself.

No pseudo-class comes up: http://caniuse.com/#search=contain

Ross Smith
  • 702
  • 4
  • 5
  • well, it definitely exists in Selenium. i have working code in front of me that uses it. see here [Sauce Labs Blog](http://saucelabs.com/blog/index.php/2010/01/selenium-totw-css-selectors-in-selenium-demystified/) – Huliax Jan 25 '12 at 18:03
  • 1
    Huliax is correct; `:contains()` was an old CSS3 pseudo-class that was proposed sometime in 2001 but dropped in 2005. It is still implemented in Selenium anyway. See my answer. – BoltClock Jan 25 '12 at 18:08
  • Thanks for the clarification @BoltClock! I'm older and wiser :) – Ross Smith Jan 25 '12 at 18:37
  • 2
    Even in Selnium (actually, the WebDriver API), it's deprecated. You really shouldn't be using it. – Ross Patterson Jan 28 '12 at 00:04
  • @Ross Patterson: Good to know. Thanks for the heads-up. – BoltClock Jan 30 '12 at 13:27