Search code examples
typescriptcypresstsconfig

Absolute paths lead to "Error: Cannot find module" since introduction of native TypeScript support in Cypress@4.4.0

Project

I have a web-app with about 100 ui tests and want to get rid of the cypress-webpack-preprocessor, as typescript support was added natively in Cypress@4.4.0. I updated to the newest version of Cypress, but it is not possible to use absolute paths in my tests anymore - I guess this should be possible.

Problem

While this works

import { DateFormatter } from "./../../../../src/util/formatter/date-formatter";

this doesn't

import { DateFormatter } from "src/util/formatter/date-formatter";

no matter what I change in the tsconfig.json it always shows this error message

Error: Cannot find module '<file in my project>' from '<path to my test file>'

Error message in cypress test runner

Reproducible example

To test this out I followed the instructions of a minimal Cypress - TypeScript example until the section Tip: Sharing code between UI and test and it works just fine but if I replace relative with absolute paths it doesn't work anymore.

Here is a github non-working example

EDIT: Additional research

I've found this cypress issue typescript compilerOptions not reflected and this comment that shows that cypress is ignoring tsconfig.json complierOptions and therefore it's not possible to add baseUrl and paths options.

Solution

  • Edit

    Fixed in Cypress@5.0.0

    Old

    This is actually a bug in Cypress and will be fixed soonish according to this comment

    A user's tsconfig.json is not loaded by Cypress. This is covered by this issue and is being addressed by this PR, which will be released in v5.0 in the near future. [...] it will fix any issues with baseUrl/paths config.