cy.within() for scoped queries in Cypress - Test Execution Trace

Test Overview

This test checks that a button inside a specific section can be clicked using cy.within() to scope the query. It verifies the button's text changes after the click.

Test Code - Cypress

Cypress

describe('Scoped queries with cy.within()', () => {
  it('Clicks button inside a specific section and verifies text change', () => {
    cy.visit('https://example.cypress.io/commands/actions')
    cy.get('#action-section').within(() => {
      cy.get('button#action-btn').should('have.text', 'Click Me').click()
      cy.get('button#action-btn').should('have.text', 'Clicked')
    })
  })
})

Execution Trace - 8 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.cypress.io/commands/actions'	Page loaded with #action-section containing button#action-btn with text 'Click Me'	-	PASS
3	Find element with id 'action-section' using cy.get	Section element found	-	PASS
4	Scope queries inside #action-section using cy.within()	Scoped context set to #action-section	-	PASS
5	Find button with id 'action-btn' inside scoped section and check its text is 'Click Me'	Button found with text 'Click Me'	Button text equals 'Click Me'	PASS
6	Click the button inside scoped section	Button clicked, UI updates button text to 'Clicked'	-	PASS
7	Verify button text changed to 'Clicked' inside scoped section	Button text is now 'Clicked'	Button text equals 'Clicked'	PASS
8	Test ends	Test completed successfully	-	PASS

Failure Scenario

Failing Condition: Button with id 'action-btn' is not found inside #action-section or text does not match expected

Execution Trace Quiz - 3 Questions

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

A Clicks all buttons on the page

B Limits all queries to inside the #action-section element

C Navigates to a new page

D Waits for the button to appear

Key Result

Using cy.within() scopes queries to a specific part of the page, making tests more reliable and easier to read by avoiding searching the whole page.