CYPRESS混合错误: Webpack编译错误./node_modules/@testing-library/dom/dist/@testing-library/dom.esm.js模块解析失败:意外

Question

我目前正在使用来自Remix的独立堆栈，但是试图用柏树运行测试会给我发送在柏树浏览器中的错误，有人有类似的问题吗？我从零开始使用独立堆栈

https://github.com/remix-run/indie-stack

这是完全的错误。

Error: Webpack Compilation Error
./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 ?? [];
|   }
| 
 @ ./node_modules/@testing-library/cypress/dist/index.js 9:11-42
 @ ./node_modules/@testing-library/cypress/dist/add-commands.js
 @ ./node_modules/@testing-library/cypress/add-commands.js
 @ ./cypress/support/e2e.ts
    at handle (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/packages/server/node_modules/@cypress/webpack-preprocessor/dist/index.js:180:23)
    at finalCallback (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/webpack/lib/Compiler.js:257:39)
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/webpack/lib/Compiler.js:306:14
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncSeriesHook.lazyCompileHook (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/tapable/lib/Hook.js:154:20)
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/webpack/lib/Compiler.js:304:22
    at Compiler.emitRecords (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/webpack/lib/Compiler.js:499:39)
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/webpack/lib/Compiler.js:298:10
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/webpack/lib/Compiler.js:485:14
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncSeriesHook.lazyCompileHook (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/tapable/lib/Hook.js:154:20)
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/webpack/lib/Compiler.js:482:27
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/neo-async/async.js:2818:7
    at done (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/neo-async/async.js:3522:9)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncSeriesHook.lazyCompileHook (/Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/tapable/lib/Hook.js:154:20)
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/node_modules/webpack/lib/Compiler.js:464:33
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/packages/server/node_modules/graceful-fs/graceful-fs.js:143:16
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/packages/server/node_modules/graceful-fs/graceful-fs.js:143:16
    at /Users/poolortega/Library/Caches/Cypress/10.8.0/Cypress.app/Contents/Resources/app/packages/server/node_modules/graceful-fs/graceful-fs.js:61:14
    at FSReqCallback.oncomplete (node:fs:188:23)

This occurred while Cypress was compiling and bundling your test code. This is usually caused by:

- A missing file or dependency
- A syntax error in the file or one of its dependencies

Fix the error in your code and re-run your tests.

Answer 1

在更新模块时，我也遇到了同样的问题。

看来来自@testing/dom的最新更新(8.18.0)正在使用柏树和混合创建错误。您应该回到8.17.1版本。

可能与此问题有关：https://github.com/testing-library/dom-testing-library/issues/1169

Answer 2

@Fody -谢谢你的评论。我已经面对这个问题三天了。你的脚步消除了我的疑虑。

在我的案子里，我只试过

npm安装--保存-dev@testing库/dom@8.17.1

对我来说很管用。