cancel
Showing results for 
Search instead for 
Did you mean: 

CSS :contains selector

Highlighted
Contributor

CSS :contains selector




Hi


 


Are there any plans on implementing CSS :contains selector?


It's one the simplest and my most favorite selector. In many cases I don't have any id, class, value, name etcto work with so I have to use text.


For example:  a:contains("Log Out").


 


I can achieve the same thing with XPath text() secector but I would prefer to use CSS as it's usually faster and more elegant.


 


Thank you.

5 REPLIES 5
Highlighted
Community Manager

RE: CSS :contains selector


Hi Andrey,


 


There are special methods in TestComplete that allow searching for the target object based on CSS selectors. Refer to the "Finding Web Objects Using CSS Selectors" article for more information.


 

---------
Tanya Gorbunova
SmartBear Community Manager

Learn SmartBear products in a fun and easy way and prove your knowledge!
>>Participate in the TechCorner Challenge today
Highlighted
Contributor

RE: CSS :contains selector

Thank you Tanya. It's a great article but it seems that ":contains" CSS pseudo class is not supported currently. Is there any chance it might be included with the next release? Thanks!
Highlighted
Community Manager

RE: CSS :contains selector


Hi Andrey,


 


It looks like the W3C Selectors Level 3 specification recommends using the following selector instead of the :contains pseudo-class:


[att*=val]


Represents an element with the att attribute whose value contains at least one instance of the substring "val". If "val" is the empty string then the selector does not represent anything.


 


It works in TestComplete.

---------
Tanya Gorbunova
SmartBear Community Manager

Learn SmartBear products in a fun and easy way and prove your knowledge!
>>Participate in the TechCorner Challenge today
Highlighted
Contributor

RE: CSS :contains selector

Thanks Tanya! This aproach works almost everytime except for situations when there is no reliable attribute and value to work with.



For example here's css path to find cell in a table:

html body table.frame_table tbody tr td.frame_body div#divDashBody table.dataGrid tbody tr#row.datacell2 td

The problem is this table is dynamic i.e. what you locate by this css path now might not be the same next minute.



The only reliable way to find cell is to use it's text content. In other words what this cell :contains. Currently I use xPath text()='some text' locator for this situations but I like locating elements by CSS locators way more 🙂
Highlighted
New Contributor

Re: CSS :contains selector

:contains() selector selects elements containing the specified string.

The string can be contained directly in the element as text, or in a child element.

This is mostly used together with another selector to select the elements containing the text in a group.

 

Note: The text is case sensitive.

MVC Developer at iFour Technolab Pvt Ltd
http://www.ifourtechnolab.com/
New Here?
Join us and watch the welcome video:
Announcements
Join TechCorner Challenge!
Want a fun and easy way to learn TestComplete? Try solving weekly TechCorner challenges and get into the Leaderboard!

Challenge Status

Changing options from outside of TestComplete

Participate!

How to execute remote test and obtain results via Test Runner REST API

Participate!

Comparing content of HTML table with Excel file data

Participate!

Compare HTML table with Excel file and correct data in the file

Participate!
Top Kudoed Authors