Search code examples
material-uiselenide

Selenide test fails to interact with Material`s checkbox

Dear stackoverflowers.

We are using Selenide framework in our project to write automation tests for UI. We switched to Material-UI recently and faced with technical problems when it comes to simple checkbox. I am trying to select checkbox.

SelenideElement rememberMeCheckBox = $(By.cssSelector("input[type=\"checkbox\"]"));

rememberMeCheckBox.setSelected(isSelected);

But while doing that I get an exception:

Element should be visible {input[type="checkbox"]}
Element: '<input type="checkbox" value="on" displayed:false></input>'

And indeed when I check the real DOM it contains opacity: 0:

enter image description here

When I set the opacity by force my automation tests works well. How to deal with that ?

enter image description here

Solution

  • It's not a Selenide problem, but a common Selenium problem. Selenium defines elements with "opacity: 0" as invisible. See How to force Selenium WebDriver to click on element which is not currently visible?

    One simple way to enable this checkbox is to click its parent element:

    $("input[type=\"checkbox\"]").parent().click();

    At least it works for me.