Chaining selectors in Cypress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to select a button inside a form using chaining.

Cypress

cy.get('form').[1]('button')

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

Aclick

Bshould

Ccontains

Dfind

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'click' instead of 'find' will try to click the form, not select the button.

Using 'contains' searches for text, not a selector inside the form.

The find command is used to chain selectors and find a descendant element inside the previous selection.

2fill in blank

medium

Complete the code to get a list item with class 'active' inside a nav element.

Cypress

cy.get('nav').[1]('li.active')

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

Ashould

Bclick

Cfind

Dcontains

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'click' will try to click the nav element, not select the list item.

Using 'contains' looks for text, not a selector.

find is used to locate elements inside the previously selected element.

3fill in blank

hard

Fix the error in chaining to get a child input inside a div with id 'search'.

Cypress

cy.get('#search').[1]('input').type('hello')

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

Afind

Bget

Cclick

Dcontains

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'get' again breaks the chain and searches the whole document.

Using 'click' tries to click the div, not select the input.

find is the correct command to locate a child element inside the current selection. Using get again resets the search to the whole document.

4fill in blank

hard

Fill both blanks to chain commands that select a form, then a text input inside it.

Cypress

cy.get('form').[1]('input').[2]('have.attr', 'type', 'text')

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

Afind

Bshould

Cinvoke

Dclick

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'click' instead of 'should' will try to click the input.

Using 'invoke' is for calling functions, not assertions.

First, find locates the input inside the form. Then, should asserts the input's type attribute is 'text'.

5fill in blank

hard

Fill all three blanks to chain commands selecting a list, then active item, then click it.

Cypress

cy.get('ul').[1]('li.active').[2]().[3]()

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

Afind

Bfirst

Cclick

Dshould

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'should' instead of 'click' will not perform the click action.

Skipping 'first' may cause multiple elements to be clicked.

Use find to get active list items inside the ul, first to pick the first one, then click to click it.