Conditional testing on checkbox in Cypress

Question

I have a checkbox which I want to check if it is not checked and want to uncheck it if it is checked in Cypress. How can I do that?

Answer 1

Conditional testing is not recommended by Cypress, but it's possible to deal with this situation like this:

html:

<div>
  <input type="checkbox" id="mytestcheckbox" />
  <label for="mytestcheckbox">Toggle me!</label>
</div>

and in Cypress:

cy
  .get('#mytestcheckbox')
  .as('checkbox')
  .invoke('is', ':checked')
  .then(checked => {
    if (checked) {
      cy
        .get('@checkbox')
        .uncheck();
    } else {
      cy
        .get('@checkbox')
        .check();
    }
  });