Cannot consume ES module based cypress config when using Yarn 3

[lmiller1990]

Current behavior

Does not work correctly with cypress.config.ts containing ES module syntax when using Yarn 3 (does not create node_modules). I get an error and cannot proceed.

I think the problem is we try to resolve your TS install from projectRoot but new versions of yarn install modules in some other place that isn't in <project>/node_modules.

There's a lot of information in this issue, and related ones - before working on this, spend a bit of time reading and understanding the issue. It looks like it is primarily related to Plug n Play feature.

Note: many users are excited for this fix - if you are working it, please build a pre-release binary and share it here, so users can test it out.

Test code to reproduce

https://github.com/lmiller1990/yarn-3-issue-ts

• clone
• make sure you get 3.x when you do yarn --version
• install
• open cypress CT

Cypress Version

10.3.0+

Other

Created from #22071 (comment)

[gajus]

Any chance that you've figured out a solution?

[lmiller1990]

I didn't try yet, but it should be as simple as pointing Cypress at where ever Yarn PNP puts node_modules.

Happy to assist with this if you'd like to either take a stab, or even just point me in the direction - I know Cypress well, but not Yarn 3.

[jefbarn]

@lmiller1990 Thanks for looking into this, I'm trying to switch a project over to Yarn PNP and cypress is my last hold up.

Yarn PNP uses a custom loader and virtual filesystem, so there is not a 'node_modules' to point to. The trick should be to make sure ts-node is using the yarn loader, which is usually accomplished when loading a node script using yarn command eg 'yarn cypress run'.

But not working in this case because I suspect the cypress command is spinning off another process to run ts-node?

I'm happy to help play around with this if you have some suggestions. Also, I tried renaming my cypress.config.ts file to cypress.config.mts, which should be supported by the latest ts-node, but cypress doesn't like the mts extension yet.

[lmiller1990]

Not sure where to start with this, I'll need to do some research.

I do not think we support cypress.config.mts yet - we may need to bump our ts-node version. So many extensions and module formats now 🤯

[lmiller1990]

• Where we grab the ts-node loaders https://github.com/cypress-io/cypress/blob/develop/packages/data-context/src/data/ProjectConfigIpc.ts#L19-L20
• Where we attempt to execute the child_process using the right loader: https://github.com/cypress-io/cypress/blob/develop/packages/data-context/src/data/ProjectConfigIpc.ts#L273-L309

Probably need to do something around here, not sure what. I think what might be happening is this line is erroneously false, since it is attempting to resolve the user's TypeScript version using the usual node module algorithm, which doesn't work with Yarn 3.

What would be interesting is to see what happens in a Yarn 3 project without TypeScript - just using regular CJS. If that works, my suspicion is probably correct? cc @rockindahizzy

[josephzidell]

Running into a similar issue. Using yarn 3.2.3, cypress 10.7.0.

[lmiller1990]

I think I was misleading slightly - the title should not be ES module based but TS based cypress config. I will update it.

Basically, yarn 3 + TS isn't working? I think it's because we try to load your local TS from node_modules, which is not a thing in Yarn 3... digging into the various module problems now (eg #22795) so hopefully can look into this, too.