Check enabled checkboxes

Watch this example in the video Check The Enabled Checkboxes.

<ul>
  <li>
    <input type="checkbox" name="c1" disabled="disabled" />
    <label for="c1">I have a bike</label>
  </li>
  <li>
    <input type="checkbox" name="c2" />
    <label for="c2">I have a car</label>
  </li>
  <li>
    <input type="checkbox" name="c3" />
    <label for="c3">I have a boat</label>
  </li>
</ul>

li {
  list-style-type: none;
}

We can get all the checkboxes, filter out the disabled ones using the attribute selector, then click on each one via cy.click

// check all enabled checkboxes using multiple clicks
cy.get(':checkbox').not('[disabled]').click({ multiple: true })

Better: use the cy.check command

cy.get(':checkbox').not('[disabled]').check()

Best: use the jQuery :enabled selector plus the cy.check command

// use the jQuery :checkbox + :enabled selectors
// and the cy.check command
cy.get(':checkbox:enabled').check()

// confirm the number of checked inputs
// using the jQuery :checked selector
cy.get(':checked').should('have.length', 2)

See also

• Enabled elements