cypress-file-upload icon indicating copy to clipboard operation
cypress-file-upload copied to clipboard

[Bug] Typing support clash with user's custom typings

Open david-fong opened this issue 4 years ago • 1 comments

Current behavior:

The recommended way of adding typings support (import 'cypress-file-upload';) clashes with the user's typings for their custom commands.

// in support/commands.ts
/// <reference types="cypress" />
import 'cypress-file-upload'; // adding this causes the spec files to no longer detect the below custom command typings.

declare namespace Cypress { // In VS Code, "Cypress" gets greyed out as "unused".
  interface Chainable {
    ...
  }
}

I think this happens because the addition of the "import" keyword turns the file into a module. I tried adding the export keywords like so:

// in support/commands.ts
/// <reference types="cypress" />
import 'cypress-file-upload'; // adding this causes the spec files to no longer detect the below custom command typings.

export declare namespace Cypress { // In VS Code, "Cypress" gets greyed out as "unused".
  export interface Chainable {
    ...
  }
}

but that didn't work immediately. I think such a setup would require importing "Cypress" from the commands file in every spec file.

I am using Typescript 4.3

Suggested Fix:

This solution worked for me: use /// <reference types="cypress-file-upload" /> like so:

// in support/commands.ts
/// <reference types="cypress" />
/// <reference types="cypress-file-upload" />

declare namespace Cypress {
  interface Chainable {
    ...
  }
}

It doesn't require adding imports to all the spec files, which is nice.

david-fong avatar Jun 21 '21 17:06 david-fong

What happened with this bug? 🤔

JoanSernaLeiton avatar Apr 13 '22 04:04 JoanSernaLeiton