Search code examples
typescriptvue.jsjestjstestcafets-jest

How do I resolve a type conflict between Testcafe and Jest? ("Cannot redeclare block-scoped variable 'test'")


I have a Vue 2 project, created with the Vue CLI, that has had Testcafe tests for a while. Now I'm trying to add Jest tests as well.

When I run my app (npm run serve = vue-cli-service serve), I get the following Typescript errors, due to both Jest and Testcafe declaring global test() functions:

ERROR in /Users/.../app/node_modules/@types/jest/index.d.ts(44,13):
44:13 Cannot redeclare block-scoped variable 'test'.
    42 | declare var fit: jest.It;
    43 | declare var xit: jest.It;
  > 44 | declare var test: jest.It;
       |             ^
    45 | declare var xtest: jest.It;
    46 |
    47 | declare const expect: jest.Expect;
ERROR in /Users/.../app/node_modules/testcafe/ts-defs/index.d.ts(2397,15):
2397:15 Cannot redeclare block-scoped variable 'test'.
    2395 |
    2396 | declare const fixture: FixtureFn;
  > 2397 | declare const test: TestFn;
         |               ^
    2398 |
Version: typescript 3.7.5

There is an old Testcafe issue that says this was fixed in 2019, and that:

Only definitions from the node_modules/@types directory are loaded automatically by default when compiling any TypeScript source file.

But, as you can see above, my config is still loading the Testcafe types from node_modules/testcafe/ts-defs/index.d.ts, even when I'm not running Testcafe but just running the app.

I've created a skeleton Vue 2 app that has the same problem and uploaded it to Github here. The type problem didn't occur until I added the test at tests/testcafe/Testcafe.spec.ts.

What can I do to get rid of this type conflict? Is there something easy I can do to stop the Testcafe types being loaded when running the app?


Solution

  • In my project, adding "tests/testcafe" to the exclude property in tsconfig.json stops the error appearing when running the dev server, and the TestCafe tests will still run (which was a surprise). So I guess telling Typescript (run by Vue CLI / Webpack?) not to compile the Testcafe tests is one answer.

    I feel there is probably another answer where TestCafe's types are ignored, but I don't know how to achieve that. (I've tried to do it a couple of different ways.)