Length assertions in Cypress - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ assertion

intermediate

Verify element count with correct length assertion

You want to check that a list on the page has exactly 5 items using Cypress. Which assertion correctly verifies this?

Cypress

cy.get('.item-list > li').should('have.length', 5);

A cy.get('.item-list > li').should('have.length', 5);

B cy.get('.item-list > li').should('have.length.greaterThan', 5);

C cy.get('.item-list > li').should('length', 5);

D cy.get('.item-list > li').should('have.lengthOf', 5);

💡 Hint

Use the correct Cypress assertion syntax for exact length checks.

Option A uses the correct Cypress assertion have.length to check the exact number of elements. Option A checks for greater than 5, which is not exact. Option A uses an invalid assertion name. Option A uses a non-existent assertion.

❓ Predict Output

intermediate

Output of length assertion failure message

What will Cypress output if the following code runs but the page has only 3 items instead of 5?

Cypress

cy.get('.todo-item').should('have.length', 5);

A Test passes silently with no errors

B AssertionError: expected 3 to equal 5

C SyntaxError: unexpected token 'length'

D TypeError: cannot read property 'length' of undefined

💡 Hint

Think about what happens when the actual count does not match the expected count.

Cypress throws an AssertionError when the actual number of elements does not match the expected length. It reports the actual and expected values.

❓ locator

advanced

Best locator for length assertion on dynamic list

You want to assert the length of a dynamic list where items have a class that changes but all share a data attribute data-test='list-item'. Which locator is best for stable length assertions?

A cy.get('[data-test="list-item"]').should('have.length', 4);

B cy.get('.dynamic-class').should('have.length', 4);

C cy.get('li').should('have.length', 4);

D cy.get('#list > div').should('have.length', 4);

💡 Hint

Use stable attributes that do not change dynamically.

Option A uses a stable data attribute selector which is less likely to break if classes change. Other options rely on classes or tags that may be unstable or too broad.

🔧 Debug

advanced

Debug failing length assertion in Cypress test

A test fails with this code:
cy.get('.menu-item').should('have.length', 3);
The error says actual length is 2. What is the most likely cause?

A Cypress cannot find elements because the page is not loaded.

B The assertion syntax is incorrect and causes a silent failure.

C The page has only 2 elements with class 'menu-item' at test time.

D The selector '.menu-item' is invalid and matches no elements.

💡 Hint

Check the actual number of elements on the page when the test runs.

The error indicates the selector found 2 elements, but the test expects 3. This usually means the page content does not have the expected number of elements at test time.

❓ framework

expert

Using length assertion with chained commands in Cypress

Consider this Cypress code:
cy.get('.container').find('.card').should('have.length', 4);
What does this assertion verify?

A It checks that there are 4 '.container' elements and 4 '.card' elements separately.

B It checks that inside each '.container' element there are 4 '.card' elements.

C It checks that there are 4 '.container' elements, each containing at least one '.card'.

D It checks that the total number of '.card' elements inside all '.container' elements combined is 4.

💡 Hint

Remember how Cypress chains commands and aggregates matched elements.

The find() command searches within all matched '.container' elements and returns all '.card' elements found. The assertion checks the total count of these '.card' elements combined.