sudden webpack compilation error due to file loader

Current behavior

i’m using:

• osx 12.0.1
• node 16
• create-react-app
• craco
• cypress 9.5.0
• typescript

writing e2e tests with cypress, it’s been fine for a few months, then at a certain point in the project, a compilation error is thrown - Error: Webpack Compilation Error - Unexpected Token. it’s suddenly dying on css files. i understand about file loaders, but everything was working until a certain point in the commit history.

the commit was trivial, a simple fix to a .tsx file. webpack compiles fine outside of cypress, so the loader config is correct.

it’s as if the project grew too large at this point and webpack compilation inside cypress is just failing for some reason. really confusing.

is there a place that i can find more detailed logging about the webpack build within cypress? this makes no sense to me.

Desired behavior

it should continue working, simple as that.

Test code to reproduce

reproduction steps aren’t really possible to provide in this case without access to the source.

Cypress Version

9.5.0

Other

No response

[szhang-brighte]

I had the same error message while updating cypress and testing-library

Error: Webpack Compilation Error
/root/project/node_modules/@testing-library/dom/dist/@testing-library/dom.esm.js 429:27
Module parse failed: Unexpected token (429:27)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|   // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- types are not aware of older browsers that don't implement `labels`
|   if (element.labels !== undefined) {
>     return element.labels ?? [];
|   }
| 
 @ /root/project/node_modules/@testing-library/cypress/dist/index.js 9:11-42
 @ /root/project/node_modules/@testing-library/cypress/dist/add-commands.js
 @ /root/project/node_modules/@testing-library/cypress/add-commands.js

The problem was when I updated "@testing-library/dom": "^8.17.1", -> "^8.18.0". When I reverted to 8.17.1, cypress ran OK.

[lmiller1990]

I am going to close this one since the OP hasn’t responded in while - I don’t see any obvious actionable info here, other than probably updating our deps like webpack etc to have more features out of the box. This will happen but the webpack 5 update is non-trivial, but something I’d like to see before the end of 2022.

In the meantime, if you see this problem, look at my above comment - you need to update your babel config or tsconfig to include the features you want, like ??.