CSS Locator with contains() InvalidSelectorException using Selenium WebDriver

Question

I am learning Selenium Webdriver and trying to write a simple test script.

The intent is to get the About Google link on

Answer 1

Well as the Exception is clearly stating the problem here is that your Css Selector is not valid. 'You are trying to get the About Google anchor tag based on it's text which is not a valid css selector'. It's more of a jQuery selector.

You could use the selector based on the value of href attribute as shown below and it will work fine.

 #footer-list a[href*='about']

and use it like

WebElement aboutGoogle = driver.findElement(By.cssSelector("#footer-list a[href*='about']"));

Answer 2

CssSelector does not work in scripting but it works in selenium IDE.

It's also not good to work on sites like gmail.

Answer 3

The main problem is at this line:

driver.findElement(By.cssSelector("a:contains('About Google')"));

css doesn't maintain contains() for Selenium WD - See here.

For using contains() you have to use Xpath.

With Xpath your locator will be:

//a[contains(text(), 'About Google')]

and for driver it will be as:

driver.findElement(By.xpath("//a[contains(text(), 'About Google')]"));

For finding links with Selenium you can use:

driver.findElement(By.linkText("your link name here"));

It is limitation of CSS selectors compare to Xpath:

• you can't take parent element with css selectors (Xpath has xpath axes)
• you can't use contains (it is only xpath privilege).

BTW
For processing Xpath locators from page you able to use extension for Firefox browser:

• FirePath

• Xpath Checker