Value and attribute assertions in Cypress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to check if the input field has the value 'hello'.

Cypress

cy.get('input#name').should('have.value', [1]);

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

A"input"

B"world"

C"test"

D"hello"

Attempts:

3 left

💡 Hint

Common Mistakes

Forgetting quotes around the string value.

Using 'have.text' instead of 'have.value'.

The assertion 'have.value' checks the value attribute of the input. We want to check if it equals "hello".

2fill in blank

medium

Complete the code to assert that the button has the attribute 'disabled'.

Cypress

cy.get('button.submit').should('have.attr', [1]);

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

A"disabled"

B"enabled"

C"readonly"

D"checked"

Attempts:

3 left

💡 Hint

Common Mistakes

Using attribute values instead of attribute names.

Confusing 'disabled' with 'readonly'.

The 'have.attr' assertion checks if the element has the specified attribute. We want to check for 'disabled'.

3fill in blank

hard

Fix the error in the code to check if the link has the href attribute equal to '/home'.

Cypress

cy.get('a.home-link').should('have.attr', 'href', [1]);

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

A"home"

B"#home"

C"/home"

D"home.html"

Attempts:

3 left

💡 Hint

Common Mistakes

Missing the leading slash in the href value.

Using a fragment identifier (#) instead of the path.

The href attribute should exactly match '/home' to pass the assertion.

4fill in blank

hard

Fill both blanks to assert the input has attribute 'placeholder' with value 'Enter name'.

Cypress

cy.get('input#user').should('have.attr', [1], [2]);

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

A"placeholder"

B"Enter name"

C"username"

D"Enter your name"

Attempts:

3 left

💡 Hint

Common Mistakes

Swapping attribute name and value.

Using a different placeholder text than expected.

The first blank is the attribute name 'placeholder', the second blank is the expected value 'Enter name'.

5fill in blank

hard

Fill all three blanks to assert the checkbox is checked and has attribute 'type' equal to 'checkbox'.

Cypress

cy.get('input#agree').should('be.[1]').and('have.attr', [2], [3]);

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

Achecked

B"type"

C"checkbox"

Ddisabled

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'be.disabled' instead of 'be.checked'.

Forgetting quotes around attribute name and value.

The first blank is the state 'checked', the second is the attribute name 'type', and the third is the attribute value 'checkbox'.