First Cypress test - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the test result of this Cypress code?

Consider this Cypress test code. What will be the test execution result?

Cypress

describe('My First Test', () => {
  it('Visits the Kitchen Sink', () => {
    cy.visit('https://example.cypress.io')
    cy.contains('type').click()
    cy.url().should('include', '/commands/actions')
  })
})

A Test fails because cy.visit URL is incorrect

B Test passes because the page contains 'type' and URL changes correctly

C Test fails due to syntax error in cy.contains line

D Test fails because cy.url assertion is wrong

💡 Hint

Check if the URL visited is valid and if the element with text 'type' exists on the page.

The test visits a valid Cypress example page, clicks on the link containing 'type', and asserts the URL includes '/commands/actions'. This matches the page behavior, so the test passes.

❓ assertion

intermediate

Which assertion correctly verifies the page title in Cypress?

You want to check that the page title is exactly 'Cypress.io: Kitchen Sink'. Which assertion is correct?

A cy.title().should('eq', 'Cypress.io: Kitchen Sink')

B cy.title().should('equal', 'Cypress.io: Kitchen Sink')

C cy.title().should('contain', 'cypress.io')

D cy.title().should('include', 'Kitchen Sink')

💡 Hint

Check the exact match assertion syntax in Cypress.

The correct assertion for exact equality is 'eq'. 'equal' is not a valid alias in Cypress assertions. 'include' and 'contain' check partial matches.

❓ locator

advanced

Which locator is best practice to select a button with text 'Submit' in Cypress?

Choose the best locator to select a button with visible text 'Submit' for a Cypress test.

A cy.contains('button', 'Submit')

B cy.get('button').contains('Submit')

C cy.get('button:contains("Submit")')

D cy.get('button').filter(':text("Submit")')

💡 Hint

Consider the Cypress recommended way to find elements by text and tag.

cy.contains('button', 'Submit') finds a button element containing the text 'Submit' directly and is the recommended approach. Option A is invalid because cy.get returns elements and contains is not chained that way. Options C and D use invalid selectors.

🔧 Debug

advanced

Why does this Cypress test fail with 'Timed out retrying' error?

Given this test code, why does it fail with a timeout error?

Cypress

describe('Timeout Test', () => {
  it('Waits for element', () => {
    cy.visit('https://example.cypress.io')
    cy.get('#nonexistent-element').should('be.visible')
  })
})

A The assertion 'should be visible' is invalid syntax

B cy.get selector syntax is incorrect causing failure

C cy.visit URL is unreachable causing timeout

D The element with id 'nonexistent-element' does not exist on the page, causing timeout

💡 Hint

Check if the element selector matches any element on the page.

The test waits for an element with id 'nonexistent-element' which does not exist, so Cypress retries until timeout. The selector syntax and assertion are valid, and the URL is reachable.

❓ framework

expert

What is the correct way to run setup code before all tests in a Cypress test suite?

You want to run some code once before all tests in a describe block. Which is the correct Cypress hook to use?

A beforeEach(() => { /* setup code */ })

B init(() => { /* setup code */ })

C before(() => { /* setup code */ })

D setup(() => { /* setup code */ })

💡 Hint

Recall the difference between hooks that run once and those that run before each test.

before() runs once before all tests in the block. beforeEach() runs before each test. setup() and init() are not valid Cypress hooks.