How to locate "::after" element in selenium locator?

Question

I have few checkboxes on my page, with few of them checked by default. Through my code, I need to handle unchecking of all text boxes on the page and then proceed.

The problem is the checkboxes (both checked and un-checked) have exactly the same HTML / DOM structure with same attributes / values except for the "::after" appearing when the checkbox is checked. How do I write a locator to find out if the element is checked or unchecked, and then proceed to uncheck it.

<!-- When checkbox is unchecked -->
<label class="someclasslabel" on-click="[[event]]">
    <span>Male</span>
    <input type="checkbox" data-bind="checked: $properties.value">
    <span class="checkbox"></span>
</label>


<!-- When checkbox is checked -->
<label class="someclasslabel" on-click="[[event]]">
    <span>Male</span>
    <input type="checkbox" data-bind="checked: $properties.value">
    <span class="checkbox">
::after
</span>
</label>

I want a locator, so that I can get attribute if its checked or unchecked, and then uncheck it if already checked.

I think this answer will helpful https://stackoverflow.com/a/37355292/6631280 — Ravi Makwana, Oct 05 '19 at 03:25
Possible duplicate of [WebDriver select element that has ::before](https://stackoverflow.com/questions/29772457/webdriver-select-element-that-has-before) — Thomas W, Oct 05 '19 at 05:22
Ravi and @Thomas are both linking to questions with no accepted answer and that's too bad. Let's try to do better, guys. — pguardiario, Oct 05 '19 at 13:20

score 0 · Answer 1 · answered Oct 05 '19 at 14:01

You could try executing some Javascript on your checkbox element to get the value.

after_value = driver.execute_script
    ("return window.getComputedStyle(document.querySelector('.someclasslabel'),':after')
    .getPropertyValue('content');")

This is a bit of a hack, but worth a try.

score 0 · Answer 2 · answered Oct 05 '19 at 15:46

After getting all the checkbox elements (with the same selector) no matter if they are checked or not, you can then iterate through them with a loop, and check if they are checked with the selected method. (C# reference here https://seleniumhq.github.io/selenium/docs/api/dotnet/ for RemoteWebElement.Selected Property). If .selected == true -》click; if not selected, do nothing;

How to locate "::after" element in selenium locator?

2 Answers2