Why custom commands reduce duplication in Cypress - Challenge Your Understanding

Challenge - 5 Problems

🧠 Conceptual

intermediate

Why use custom commands in Cypress?

Which of the following best explains why custom commands help reduce duplication in Cypress tests?

A They allow you to write reusable test steps that can be called multiple times, avoiding repeated code.

B They automatically generate test data for each test case, reducing manual input.

C They replace the need for assertions by validating all elements automatically.

D They enable running tests in parallel without changing the test code.

💡 Hint

Think about how repeating the same steps in many tests can be simplified.

Custom commands let you write a piece of code once and reuse it in many tests. This avoids copying the same code multiple times, making tests easier to maintain.

❓ Predict Output

intermediate

Output of using a custom command

Given this Cypress custom command and test, what will be the output in the test runner console?

Cypress

Cypress.Commands.add('login', (user) => {
  cy.get('#username').type(user.name)
  cy.get('#password').type(user.password)
  cy.get('#login-button').click()
})

describe('Login Test', () => {
  it('logs in user', () => {
    cy.login({name: 'alice', password: '1234'})
    cy.url().should('include', '/dashboard')
  })
})

A Test passes but URL check is ignored due to missing assertion.

B Test fails because custom commands cannot accept arguments.

C Test fails because cy.get selectors are invalid without quotes.

D Test passes because the custom command logs in and URL includes '/dashboard'.

💡 Hint

Check if the custom command is used correctly and if the assertion matches the expected URL.

The custom command 'login' types username and password, then clicks login. The test then checks if the URL contains '/dashboard'. This is a valid test and should pass if the app behaves correctly.

❓ assertion

advanced

Correct assertion to verify custom command effect

Which assertion correctly verifies that a custom command successfully logged in a user by checking the presence of a logout button?

Cypress

Cypress.Commands.add('login', () => {
  cy.get('#username').type('user')
  cy.get('#password').type('pass')
  cy.get('#login-btn').click()
})

cy.login()
// Which assertion below is correct?

A cy.get('#login-btn').should('be.visible')

B cy.get('#logout-btn').should('not.exist')

C cy.get('#logout-btn').should('be.visible')

D cy.get('#username').should('contain.text', 'user')

💡 Hint

After login, the logout button should appear on the page.

After a successful login, the logout button should be visible. Checking for its visibility confirms the login worked.

🔧 Debug

advanced

Debugging duplicated code without custom commands

What is the main problem with this test code repeated in multiple tests?

Cypress

cy.get('#username').type('user')
cy.get('#password').type('pass')
cy.get('#login-btn').click()
cy.get('#logout-btn').should('be.visible')

A Custom commands are not allowed in Cypress tests.

B Duplicated code makes tests harder to maintain and update if login steps change.

C Assertions are missing to verify login success.

D The selectors are invalid and cause syntax errors.

💡 Hint

Think about what happens if the login process changes and you have to update many tests.

Repeating the same login steps in many tests means if the login changes, you must update all tests. This wastes time and risks errors. Custom commands solve this by centralizing the code.

❓ framework

expert

Best practice for creating custom commands to reduce duplication

Which of the following is the best practice when creating custom commands in Cypress to reduce duplication and improve test clarity?

A Create small, focused commands that perform one clear action and can be combined in tests.

B Create one large command that performs all test steps to avoid writing multiple commands.

C Avoid using custom commands and write all steps directly in tests for clarity.

D Use custom commands only for assertions, not for actions like clicking or typing.

💡 Hint

Think about how modular code helps reuse and clarity.

Small, focused custom commands are easier to reuse and combine. They keep tests clear and maintainable. Large commands can hide details and reduce flexibility.