How do you write custom Cypress commands?

Custom commands remove repeated setup from specs. A login flow, a data seeding step or a repeated assertion belongs in a command when several tests need it. The command lives in cypress/support and is loaded through the support file.

Cypress.Commands.add("login", (email: string, password: string) => {
  cy.session([email, password], () => {
    cy.visit("/login");
    cy.get("[data-cy=email]").type(email);
    cy.get("[data-cy=password]").type(password);
    cy.get("[data-cy=submit]").click();
    cy.location("pathname").should("eq", "/dashboard");
  });
});

Typing the command

declare global {
  namespace Cypress {
    interface Chainable {
      login(email: string, password: string): Chainable<void>;
    }
  }
}

export {};

• Add the command in cypress/support/commands.ts and import it from the support file
• Return a chain when callers need to continue chaining
• Use cy.session inside a login command to avoid repeated UI setup
• Prefer a command for repeated user intent, not for every small click
• Keep commands deterministic; a command that hides a sleep will spread flakiness