cy.first(), cy.last(), cy.eq() in Cypress - Test Execution Trace

Test Overview

This test checks that the cy.first(), cy.last(), and cy.eq() commands correctly select the first, last, and a specific element from a list on a webpage. It verifies the text content of these selected elements.

Test Code - Cypress

Cypress

describe('Test cy.first(), cy.last(), and cy.eq()', () => {
  beforeEach(() => {
    cy.visit('https://example.cypress.io/commands/actions')
  })

  it('selects first, last, and eq elements correctly', () => {
    // Select all buttons in the .action-buttons container
    cy.get('.action-buttons > button').as('buttons')

    // Check the first button text
    cy.get('@buttons').first().should('have.text', 'Action')

    // Check the last button text
    cy.get('@buttons').last().should('have.text', 'Disabled')

    // Check the third button text (index 2)
    cy.get('@buttons').eq(2).should('have.text', 'Right')
  })
})

Execution Trace - 7 Steps

Step	Action	System State	Assertion	Result
1	Test starts	Test runner initialized, Cypress ready	-	PASS
2	Browser opens and navigates to 'https://example.cypress.io/commands/actions'	Page with action buttons loaded	Page URL is correct	PASS
3	Find all buttons inside '.action-buttons' container and alias as 'buttons'	Multiple button elements found	Number of buttons > 0	PASS
4	Select first button using cy.first() and check its text is 'Action'	First button element selected	Button text equals 'Action'	PASS
5	Select last button using cy.last() and check its text is 'Disabled'	Last button element selected	Button text equals 'Disabled'	PASS
6	Select third button using cy.eq(2) and check its text is 'Right'	Third button element selected	Button text equals 'Right'	PASS
7	Test ends	All assertions passed	-	PASS

Failure Scenario

Failing Condition: If the selector '.action-buttons > button' does not find the expected buttons or the text assertions fail

Execution Trace Quiz - 3 Questions

Which command selects the very first button element in the list?

A cy.first()

B cy.last()

C cy.eq(0)

D cy.get()

Key Result

Use cy.first(), cy.last(), and cy.eq() to select specific elements from a group. Always verify the selected element's content to ensure correct selection.