Cypress vs Selenium vs Playwright comparison - Interactive Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to visit a webpage using Cypress.

Cypress

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

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

Aopen

Bvisit

Cgo

Dnavigate

Attempts:

3 left

💡 Hint

Common Mistakes

Using commands like 'open' or 'go' which are not Cypress commands.

The correct Cypress command to open a webpage is visit.

2fill in blank

medium

Complete the code to assert that an element contains specific text in Cypress.

Cypress

cy.get('.message').should('[1]', 'Hello World')

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

Acontain

Bhave.text

Cinclude.text

Dhas.text

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'have.text' which requires exact match, not partial.

The contain assertion checks if the element includes the given text.

3fill in blank

hard

Fix the error in the Cypress test to wait for an element to be visible.

Cypress

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

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

Ashould

Bexpect

Cwait

Dassert

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'wait' which pauses but does not assert visibility.

The should command is used to assert conditions like visibility in Cypress.

4fill in blank

hard

Fill both blanks to create a test that clicks a button and verifies URL change in Cypress.

Cypress

cy.get('[1]').click()
cy.url().should('[2]', '/dashboard')

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

A#login-button

Binclude

Cequal

D.submit-btn

Attempts:

3 left

💡 Hint

Common Mistakes

Using class selector instead of ID for the button.

Using 'equal' which requires exact URL match.

The selector for the button is #login-button. The URL assertion uses include to check partial match.

5fill in blank

hard

Fill all three blanks to write a Cypress test that types into an input, submits a form, and checks success message.

Cypress

cy.get('[1]').type('[e-mail]')
cy.get('[2]').click()
cy.get('[3]').should('contain', 'Success')

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

A#email-input

B#submit-btn

C.success-message

D.error-message

Attempts:

3 left

💡 Hint

Common Mistakes

Using '.error-message' instead of '.success-message' for the success check.

The input field has ID #email-input, the submit button has ID #submit-btn, and the success message uses class .success-message.