描述错误
如果你在运行带有Angular的Storybook时,有一个导入RouterTestingModule
的故事,那么这个故事会抛出以下JavaScript错误:
beforeEach is not defined
ReferenceError: beforeEach is not defined
at ./node_modules/@angular/core/fesm2022/testing.mjs (http://localhost:4401/vendors-node_modules_angular_router_fesm2022_testing_mjs-node_modules_storybook_angular_dist_-03a309.iframe.bundle.js:27083:1)
at __webpack_require__ (http://localhost:4401/runtime~main.iframe.bundle.js:28:33)
at fn (http://localhost:4401/runtime~main.iframe.bundle.js:338:21)
at ./node_modules/@angular/router/fesm2022/testing.mjs (http://localhost:4401/vendors-node_modules_angular_router_fesm2022_testing_mjs-node_modules_storybook_angular_dist_-03a309.iframe.bundle.js:34514:79)
at __webpack_require__ (http://localhost:4401/runtime~main.iframe.bundle.js:28:33)
at fn (http://localhost:4401/runtime~main.iframe.bundle.js:338:21)
at ./libs/abetest/src/lib/use-router/use-router.component.stories.ts (http://localhost:4401/src-lib-use-router-use-router-component-stories.iframe.bundle.js:46:81)
at __webpack_require__ (http://localhost:4401/runtime~main.iframe.bundle.js:28:33)
at fn (http://localhost:4401/runtime~main.iframe.bundle.js:338:21)
at http://localhost:4401/main.iframe.bundle.js:32:10
重现问题
我已经上传了一个包含单个故事的小项目,以展示这个问题。
https://github.com/SuneRadich/beforeEachError
系统信息
Environment Info:
System:
OS: macOS 13.4.1
CPU: (8) arm64 Apple M1 Pro
Binaries:
Node: 18.16.0 - ~/.nvm/versions/node/v18.16.0/bin/node
npm: 9.5.1 - ~/.nvm/versions/node/v18.16.0/bin/npm
Browsers:
Chrome: 116.0.5845.96
Safari: 16.5.1
npmPackages:
@storybook/addon-essentials: 7.3.1 => 7.3.1
@storybook/addon-interactions: ^7.2.1 => 7.3.1
@storybook/angular: 7.3.1 => 7.3.1
@storybook/core-server: 7.3.1 => 7.3.1
@storybook/jest: ~0.1.0 => 0.1.0
@storybook/test-runner: ^0.13.0 => 0.13.0
@storybook/testing-library: ~0.2.0 => 0.2.0
额外的上下文信息
我在nx( nx.dev )单仓库中使用Storybook和Angular,所以这可能与那里有关。但似乎与Angular和Storybook的一些更改有关。
5条答案
按热度按时间uinbv5nw1#
解决方法:
在您的
preview_head.html
文件中,在文件顶部添加以下脚本块:这将有效地对暴露的测试内部的 beforeEach 和 afterEach 进行猴子补丁。
似乎这个 bug 是由 Angular 16.2.0 发布的 angular/angular@0b14e4e 提交引起的。
因此,另一个解决方法是降级到 Angular 16.1.9。
nnsrf1az2#
我刚刚将我们的NX-workspace v16.3.2更新到了v16.7.2。并将Angular v16.0.6升级到了v16.2.1。同时,我也在使用测试运行器时遇到了这个问题。
@yngvebn 谢谢你的解决方法。
1cosmwyk3#
在使用添加了
RouterTestingModule
的storybook-addon-angular-router
插件时,也看到了相同的问题。如果能够在不要求使用替代方案的情况下修复它,那就太好了。alen0pnh4#
我逐个重做了迁移,这次我最终在Angular
16.2.2
上,但突然间我无法重现错误?有人能确认吗?9gm1akwq5#
在16.2.2版本中,有一个针对这个问题的修复,详见angular/angular#51382。