cy.check() and cy.uncheck() in Cypress - Test Execution Trace

Test Overview

This test verifies that a checkbox can be checked and unchecked using Cypress commands cy.check() and cy.uncheck(). It confirms the checkbox state changes correctly.

Test Code - Cypress

Cypress

describe('Checkbox check and uncheck test', () => {
  it('should check and uncheck the checkbox', () => {
    cy.visit('https://example.com/form')
    cy.get('#subscribe-newsletter').check().should('be.checked')
    cy.get('#subscribe-newsletter').uncheck().should('not.be.checked')
  })
})

Execution Trace - 6 Steps

Step	Action	System State	Assertion	Result
1	Test starts	Test runner initialized, no browser opened yet	-	PASS
2	Browser opens and navigates to 'https://example.com/form'	Browser shows the form page with a checkbox having id 'subscribe-newsletter'	-	PASS
3	Find checkbox element with id 'subscribe-newsletter' using cy.get('#subscribe-newsletter')	Checkbox element is located on the page	-	PASS
4	Check the checkbox using cy.check()	Checkbox is now checked (ticked)	Verify checkbox is checked with .should('be.checked')	PASS
5	Find the same checkbox element again	Checkbox element is located and currently checked	-	PASS
6	Uncheck the checkbox using cy.uncheck()	Checkbox is now unchecked (unticked)	Verify checkbox is not checked with .should('not.be.checked')	PASS

Failure Scenario

Failing Condition: Checkbox element with id 'subscribe-newsletter' is not found on the page

Execution Trace Quiz - 3 Questions

What does cy.check() do in this test?

A It ticks the checkbox to mark it as checked

B It unticks the checkbox to mark it as unchecked

C It clicks a button on the page

D It reloads the page

Key Result

Always verify that the element selector matches an existing element on the page before using commands like cy.check() or cy.uncheck() to avoid test failures.