Cypress 10: Custom command is not a function

Question

I have this error, cy. is not a function:

But I already updated the e2e.ts with this:

import './commands';

Here is my commands.ts:

    declare namespace Cypress {
  interface Chainable<Subject = any> {
    login(email: string, password: string): typeof login;
  }
}
//
function login(email: string, password: string): void {
  cy.visit('/login');
  cy.url().should('includes', 'login');
  cy.contains('Please sign in');
  cy.get('[name=email]').type(email);
  cy.get('[name=password]').type(password);
  cy.get('button').click();
}
//
// NOTE: You can use it like so:
Cypress.Commands.add('login', login);

What Am I missing here?

Thank you

Answer 1

I think you need to add declare global { around the type definition.

declare global {
  declare namespace Cypress {
    interface Chainable<Subject = any> {
      login(email: string, password: string): typeof login;
    }
  }
}

See Set Up TypeScript on Cypress in 4 Steps Easily for a reasonably straight-forward discussion.

---

See also How to declare types for Cypress custom commands for an alternative.