cy.clear() for input fields in Cypress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to clear the input field with id 'username'.

Cypress

cy.get('#username').[1]()

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

Aclear

Btype

Cclick

Dsubmit

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'type' instead of 'clear' will add text instead of removing it.

Using 'click' does not clear the input field.

Using 'submit' is for forms, not clearing inputs.

The cy.clear() command clears the value of an input field. Here, it clears the input with id 'username'.

2fill in blank

medium

Complete the code to clear the input field with class 'email-input'.

Cypress

cy.get('.email-input').[1]()

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

Atype

Bclear

Cfocus

Dcheck

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'type' adds text instead of clearing.

Using 'check' is for checkboxes, not inputs.

cy.clear() empties the input field. Here, it clears the input with class 'email-input'.

3fill in blank

hard

Fix the error in the code to clear the input field with name 'password'.

Cypress

cy.get('input[name="password"]').[1]()

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

Aclick

Btype

Csubmit

Dclear

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'type' instead of 'clear' does not remove existing text.

Using 'submit' is for forms, not clearing inputs.

The correct command to clear an input field is clear(). Using 'type' or others will not clear the field.

4fill in blank

hard

Fill both blanks to clear the input field with id 'search' and then type 'Cypress'.

Cypress

cy.get('#search').[1]().[2]('Cypress')

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

Aclear

Btype

Cclick

Dsubmit

Attempts:

3 left

💡 Hint

Common Mistakes

Typing before clearing causes text to append instead of replace.

Using 'click' or 'submit' does not enter text.

First, clear() empties the input. Then, type('Cypress') enters the text.

5fill in blank

hard

Fill all three blanks to clear the input with class 'input-field', type 'Hello', and then assert it has the correct value.

Cypress

cy.get('.input-field').[1]().[2]('Hello').should('[3]', 'Hello')

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

Aclear

Btype

Chave.value

Dclick

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'click' instead of 'clear' or 'type' breaks the flow.

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

We clear the input, type 'Hello', then check it has the value 'Hello' using have.value.