Why patterns scale test suites in Cypress - Test Your Understanding

Practice - 5 Tasks

1fill in blank

easy

Complete the code to visit the homepage in Cypress.

Cypress

cy.[1]('https://example.com')

Drag options to blanks, or click blank then click option'

Avisit

Bclick

Ctype

Dget

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'click' or 'get' instead of 'visit' to load a page.

The visit command loads a page in Cypress. Other commands like click or type interact with elements but do not load pages.

2fill in blank

medium

Complete the code to assert that a button with id 'submit' is visible.

Cypress

cy.get('#submit').[1]('be.visible')

Drag options to blanks, or click blank then click option'

Acontains

Bclick

Ctype

Dshould

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'click' or 'type' instead of 'should' for assertions.

The should command is used to make assertions in Cypress. Here, it checks if the button is visible.

3fill in blank

hard

Fix the error in the code to correctly select all list items inside a <ul> with class 'menu'.

Cypress

cy.get('ul.menu [1] li')

Drag options to blanks, or click blank then click option'

A#

B>

C.

D*

Attempts:

3 left

💡 Hint

Common Mistakes

Using '#' or '.' which select by id or class, not child elements.

The > selector selects direct children. To get all li inside ul.menu, use ul.menu > li.

4fill in blank

hard

Fill both blanks to create a reusable function that checks if an element with given selector contains expected text.

Cypress

function checkText(selector, text) {
  cy.get([1]).should([2], text)
}

Drag options to blanks, or click blank then click option'

Aselector

B'contain'

C'contain.text'

D'contains'

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong assertion like 'contains' which is a command, not an assertion here.

The function uses the selector parameter to get the element. The assertion uses should('contain', text) to check if the element contains the text.

5fill in blank

hard

Fill all three blanks to create a test that visits a page, types in an input, and asserts the input value.

Cypress

describe('Input test', () => {
  it('types and checks input', () => {
    cy.[1]('https://example.com/form')
    cy.get('#name').[2]('Alice')
    cy.get('#name').should([3], 'Alice')
  })
})

Drag options to blanks, or click blank then click option'

Avisit

Btype

C'have.value'

Dclick

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'click' instead of 'type' to enter text.

Using wrong assertion like 'contain' instead of 'have.value'.

The test visits the page with visit, types 'Alice' into the input with type, and asserts the input's value with should('have.value', 'Alice').