赛普拉斯抱怨在开发中工作的 Pdfjs-dist 的 Webpack 构建 [英] Cypress complains on a Webpack build of Pdfjs-dist which works in development
问题描述
几个星期以来，我一直在 Webpack ES6 环境中使用安装了 pdfjs-dist 的 npm 版本(其工作细节在这个较旧的 SO 问题，今天更新)，其中 E2E 测试是与赛普拉斯合作.昨天赛普拉斯停止工作.
I have been using an npm installed version of pdfjs-dist for a few weeks now, in a Webpack ES6 environment (details of its workings in this older SO question, updated today), where E2E testing is performed with Cypress. Yesterday Cypress stopped working.
奇怪的是 Cy 错误:
The strange thing is the Cy error:
Error: Webpack Compilation Error
./node_modules/pdfjs-dist/build/pdf.worker.js (./node_modules/worker-loader/dist/cjs.js?esModule=false&filename=[name].js!./node_modules/pdfjs-dist/build/pdf.worker.js)
Module build failed (from ./node_modules/worker-loader/dist/cjs.js):
TypeError: Cannot read property 'tap' of undefined
@ ./node_modules/pdfjs-dist/webpack.js 19:20-100
@ ./src/js/select/views/pdfViews.js
@ ./src/js/select/views/navbarViews.js
@ ./src/js/select/utils/DOMutils.js
@ ./src/js/common/texts/navbars/selectTxt.js
@ ./cypress/support/KJIcommands/skipRep.js
@ ./cypress/integration/step1/301-show--lists.spec.js
at Watching.handle [as handler] (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/@cypress/webpack-preprocessor/dist/index.js:176:23)
at /home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/webpack/lib/Watching.js:99:9
at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/tapable/lib/Hook.js:154:20)
at Watching._done (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/webpack/lib/Watching.js:98:28)
at /home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/webpack/lib/Watching.js:73:19
at Compiler.emitRecords (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/webpack/lib/Compiler.js:499:39)
at /home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/webpack/lib/Watching.js:54:20
at /home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/webpack/lib/Compiler.js:485:14
at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/tapable/lib/Hook.js:154:20)
at /home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/webpack/lib/Compiler.js:482:27
at /home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/neo-async/async.js:2818:7
at done (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/neo-async/async.js:3522:9)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook (/home/giampaolo/.cache/Cypress/8.2.0/Cypress/resources/app/packages/server/node_modules/tapable/lib/Hook.js:154:20)
Cypress 似乎指出了 Webpack 中的一个错误，好像编译代码没有正常工作，但应用程序却没有任何痛苦的迹象，这是它的编译报告:
Cypress seems to point at an error in Webpack, as if compiling the code did not work fine, yet the applications shows no sign of suffering, and this is its compiling report:
> webpack-dev-server --mode development
ℹ ｢wds｣: Project is running at http://localhost:8080/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wds｣: Content not from webpack is served from ./dist
(node:55249) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
Do changes to assets earlier, e. g. in Compilation.hooks.processAssets.
Make sure to select an appropriate stage from Compilation.PROCESS_ASSETS_STAGE_*.
ℹ ｢wdm｣: assets by path *.js 4.07 MiB
asset pdf.worker.js 1.7 MiB [emitted]
asset select.js 1.19 MiB [emitted] (name: select)
asset show.js 1.18 MiB [emitted] (name: show)
assets by path ../../../templates/docs/*.html 29.4 KiB
asset ../../../templates/docs/dist-select.html 16.8 KiB [emitted]
asset ../../../templates/docs/dist-show.html 12.6 KiB [emitted]
runtime modules 4.2 KiB 14 modules
modules by path ./src/js/ 286 KiB
modules by path ./src/js/show/ 79.3 KiB 41 modules
modules by path ./src/js/select/ 194 KiB 31 modules
modules by path ./src/js/common/ 12.2 KiB 4 modules
modules by path ./node_modules/ 713 KiB
cacheable modules 713 KiB 30 modules
./node_modules/webpack/hot/ sync nonrecursive ^\.\/log$ 170 bytes [built] [code generated]
./node_modules/worker-loader/dist/cjs.js?esModule=false&filename=[name].js!./node_modules/pdfjs-dist/build/pdf.worker.js 106 bytes [not cacheable] [built] [code generated]
canvas (ignored) 15 bytes [built] [code generated]
fs (ignored) 15 bytes [built] [code generated]
zlib (ignored) 15 bytes [optional] [built] [code generated]
http (ignored) 15 bytes [built] [code generated]
https (ignored) 15 bytes [built] [code generated]
url (ignored) 15 bytes [built] [code generated]
webpack 5.49.0 compiled successfully in 3598 ms
ℹ ｢wdm｣: Compiled successfully.
我已经环顾了几个小时，但找不到任何提示.非常感谢您的指点.
I have been looking around for a few hours now, but could not find a hint. Would really appreciate some pointers.
我反复看到的唯一解决方案似乎是尝试恢复到旧的 pdfjs 版本，如果我没有其他解决方案，我可以尝试那个.不过我并不倾向于，因为它已经完美运行了一段时间，而且它似乎更像是 Cypress 的问题而不是 Webpack/pdfjs 的问题，并且代码一直在顺利运行.但我也需要我的测试:P
The only solution I saw repeatedly would seem to try and revert to older pdfjs versions, and in case I have no other one I may try that one. I am not inclined though, because it has been working flawlessly for some time and it seems more of a Cypress issue than a Webpack/pdfjs one, and the code keeps working smoothly. Yet I need my tests too :P
提前致谢.
编辑:我返回了几次提交，其中代码仍在正确测试，第一个显示错误的提交有一个不同的:
Edit: I went back a couple of commits, where code was still testing properly, and the first commit showing an error had a different one:
An uncaught error was detected outside of a testfailed
No commands were issued in this test.
TypeError
The following error originated from your test code, not from Cypress.
> Cannot read property 'dataset' of null
When Cypress detects uncaught errors originating from your test code it will automatically fail the current test.
Cypress could not associate this error to any specific test.
We dynamically generated a new test to display this failure.
src/js/show/utils/base-show.js:31:49
29 | export const showElements = {
30 |
> 31 | myPdfDoc: document.querySelector('#script-1').dataset.mypdfdoc,
| ^
32 |
33 | }
34 |
View stack trace
Print to console
at Object../src/js/show/utils/base-show.js (webpack:///./src/js/show/utils/base-show.js:31:49)
at __webpack_require__ (webpack:///webpack/bootstrap:19:1)
at Object../src/js/show/UI/selections.js (webpack:///./src/js/show/UI/selections.js:1:1)
at __webpack_require__ (webpack:///webpack/bootstrap:19:1)
at Object../src/js/common/texts/navbars/selectTxt.js (webpack:///./src/js/common/texts/navbars/selectTxt.js:3:1)
at __webpack_require__ (webpack:///webpack/bootstrap:19:1)
at Object../cypress/support/KJIcommands/skip.js (webpack:///./cypress/support/KJIcommands/skip.js:1:1)
at __webpack_require__ (webpack:///webpack/bootstrap:19:1)
at Object../cypress/support/commands.js (webpack:///./cypress/support/commands.js:32:1)
at __webpack_require__ (webpack:///webpack/bootstrap:19:1)
From previous event:
at runScriptsFromUrls (http://localhost:34631/__cypress/runner/cypress_runner.js:164932:98)
at Object.runScripts (http://localhost:34631/__cypress/runner/cypress_runner.js:164946:11)
at $Cypress.onSpecWindow (http://localhost:34631/__cypress/runner/cypress_runner.js:153894:19)
第二种错误与第一种错误的共同点是没有执行测试中的代码，它是在尝试之前生成的.它说它动态生成了一个测试".显示失败，但如果它没有访问应用程序，显然它找不到 DOM 元素，不是吗?
This second kind of error has in common with the first one that no code from the tests is executed, it is generated before even trying. It says it "dynamically generated a test" to show a failure, but if it didn't visit the app it seems obvious it could not find a DOM element, no?
这在控制台中出现，尽管它可能不相关.它应该连接到带有源映射的 Firefox 错误，我在开发过程中经常看到:
This came up in the console, although it might not be relevant. It should be connected to a Firefox error with source maps, which I see often during development:
DevTools failed to load source map: Could not load content for http://localhost:34631/__cypress/runner/popper.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
推荐答案
即将在 cypress 中修复，在 8.3.1 之后(我验证这在 WDS 4 上失败，但在 WDS 3 上工作，两者都使用 WP4).
To be fixed soon in cypress, after 8.3.1 (I verified this fails with WDS 4 but works with WDS 3, both using WP4).
现在，只需降级到 WDS 3.
For now, just downgrade to WDS 3.
参见 https://github.com/cypress-io/cypress/issues/17846 和 https://github.com/cypress-io/cypress/pull/17918
这篇关于赛普拉斯抱怨在开发中工作的 Pdfjs-dist 的 Webpack 构建的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
