I want to test for checkbox checked or unchecked condition.
This is the html code for checkbox checked
<div classs="input-control checkbox">
<span class="check">
::before
</span>
</div>
::before
is css selector.
when i hoverover to checkbox, it shows webelement as span.check::before
but
driver.FindElement(By.CssSelector("span.check::before"));
throws element not found exception.
Any help will be highly appreciated.
::before is a pseudo element which allows you to insert content onto a page from CSS (without it needing to be in the HTML). While the end result is not actually in the DOM, it appears on the page as if it is.
The CSS ::before selector can be used to insert content before the content of the selected element or elements. It is used by attaching ::before to the element it is to be used on. In the example above we are prepending an asterisk and a space before every paragraph element on the page.
Type “css=input[type='submit']” (locator value) in Selenium IDE. Click on the Find Button. The “Sign in” button will be highlighted, verifying the locator value. Attribute: Used to create the CSS Selector.
What is the use of a CSS Selector (location element) in Selenium WebDriver? CSS Selector is used to recognizing the web element available in a web page of the website and it creates by combining element sector and sector values. The combination of element selector and selector value is recognized as Selector Pattern.
Other than starting and ending, the CSS Selector in Selenium is also available with contains text(). It can locate the element by using any sequential characters from the attribute value. The Symbol for representing the contains the text : ‘*’
CSS Selectors are used to identifying a user desired HTML web element. This fits into an element locator strategy of automated test development where the primary aim is to interact with page elements through different types of locators.
Selecting by pseudo-classes isn't really supported by Selenium. As far as I know, your best best is to use the JavaScriptExecutor to inject something that will return the element you want and get it that way (for example if the page has JQuery injecting a JQuery selector and returning the element that way).
In my case, I have removed the pseudo-element ::before
from the CSS selector as seen below and it works
Actions action = new Actions(driver);
action.moveToElement(driver.findElement(By.cssSelector("span.check::before"))).build().perform();
Actions action = new Actions(driver);
action.moveToElement(driver.findElement(By.cssSelector("span.check"))).build().perform();
Using pseudo-elements in the selector is actually not supposed to work as mentioned here and here.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With