cypress-io / cypress

Fast, easy and reliable testing for anything that runs in a browser.
https://cypress.io
MIT License
46.66k stars 3.16k forks source link

Property 'mount' does not exist on type 'cy & CyEventEmitter'. #28420

Closed Gennady77 closed 1 month ago

Gennady77 commented 9 months ago

Current behavior

I wrote test accordingly instruction and got TS error - Property 'mount' does not exist on type 'cy & CyEventEmitter'. my tsconfig file

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "useDefineForClassFields": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "webpack-env",
      "jest",
      "cypress",
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx",
    "node_modules/cypress/types/cypress-global-vars.d.ts"
  ],
  "exclude": [
    "node_modules"
  ]
}

Desired behavior

there should be no error

Test code to reproduce

import Button from '@/components/Button/Button.vue';

describe('<Button />', () => {
  it('mount', () => {
    cy.mount(Button);
  });
});

Cypress Version

10.3.1

Node version

16.18.0

Operating System

macOS 14.1.1

Debug Logs

No response

Other

No response

thevladisss commented 4 months ago

Yes, Cypress ships Vue test utils out of the box, however, it is not types as property of "cy" global constant. You have to make a module augmentation. You can read more about augmentation here: https://docs.cypress.io/guides/tooling/typescript-support

However for your issue you can use following code placed somewhere in "src" or "tests" folder as they are resolved by tsconfig, hence included into the compilation

https://docs.cypress.io/guides/tooling/typescript-support

src/cypress-augmentation.d.ts

import { mount } from "cypress/vue"
declare global {
  namespace Cypress {
    interface Chainable {
      mount: typeof mount;
    }
  }
}
jennifer-shehane commented 4 months ago

@Gennady77 Does this help resolve your issue?

cbrgpl commented 1 month ago

@Gennady77 Does this help resolve your issue?

I had the same problem and your answer helped me to resolve the problem. Thx