how to write css selector based on span text

[shelly garg]

Hi Tarun,

I have few buttons on my webPage. And I want to identify the buttons based on the visible text of the button

I am able to write the xpath which is ($x("//button/span[text()='Cancel']")) but can u please help me in writing the css for this.


<button id="b111321" class="x-btn-center" autocomplete="off" role="button" hidefocus="true" type="button" style="width: 69px; height: 24px;">
Cancel

</button>

[shelly garg]

<button id="b111321" class="x-btn-center" autocomplete="off" role="button" hidefocus="true" type="button" style="width: 69px; height: 24px;">
Cancel

</button>

[shelly garg]

not sure why span tag is not visible in the post. so I am adding comment //

//<button id="button-1132-btnEl" class="x-btn-center" autocomplete="off" role="button" hidefocus="true" type="button" style="width: 69px; height: 24px;">
//Cancel
//
//</button>


My question is Can u please help me in writing the CSS  to identify the button , based on visible button text

[softwaretestingforum]

Hi Shelly,

There is no text based selector in CSS. At least not in pure css.
There are java script libraries likde jquery which have text based css selector. But I would not recommend using it.
Hence I am going to suggest you to use xPath when it comes to using text based selector.

Hope this helps

[shelly garg]

Thanks a lot Tarun!