Pathwise

Manuals / Cypress / Chapter 4

B · Core · intermediate · Week 2–3 · Chapter 4 of 12

Custom commands & reusable flows

DRY with intent. Custom commands wrap repeated flows without hiding too much. Keep parameters visible in specs.

Path progress
27%

Step 1 of 4

login custom command

Wrap auth in cy.login(user, pass). Specs stay readable; implementation lives in cypress/support/commands.js.

login custom commandDrag stickies · tap for tips
Study mapDrag stickies · tap for tipsKeep it shortdrag · tap →Name the waitdrag · tap →Scope locatorsdrag · tap →Trace when stuckdrag · tap →One browser firstdrag · tap →Isolate statedrag · tap →Assert the UIdrag · tap →Retry wiselydrag · tap →Seed datadrag · tap →Close the loopdrag · tap →Keep it shortdrag · tap →Name the waitdrag · tap →Scope locatorsdrag · tap →Trace when stuckdrag · tap →One browser firstdrag · tap →Isolate statedrag · tap →Pathwise hackdrag · tap →login custom commadrag · tap →Try thisdrag · tap →Follow the dashed drag · tap →

Example

Cypress.Commands.add("login", (username, password) => {
  cy.visit("/");
  cy.get("[data-test=username]").type(username);
  cy.get("[data-test=password]").type(password);
  cy.get("[data-test=login-button]").click();
});

Do this now

Create cy.login and use it in two specs.

Was this step clear?
Chapter learning outcomes
  • cy.commands.add
  • Support file
  • Type definitions for IDE

Clear these before you leave

Side quest

Add to cart command

cy.addItem("Sauce Labs Backpack") — reusable across cart and checkout specs.