时间戳

首页 > 解决方案 > Okta 登录小部件打破了 Jest 测试 - TypeError：无法读取 null 的属性“backingStorePixelRatio”

angular - Okta 登录小部件打破了 Jest 测试 - TypeError：无法读取 null 的属性“backingStorePixelRatio”

问题描述

如标题所示。

在 Okta 开发论坛https://devforum.okta.com/t/okta-sign-in-widget-breaks-neutrino-jest-tests/2874上发现了这个问题，作者提到将canvas-prebuiltnpm 包添加到 devDependencies 为他解决了这个问题.

可悲的是它对我不起作用。

有人在使用 Okta 登录小部件时遇到此错误吗？

我正在使用 Jest 23.x 和这两个 npm 包，它们帮助我将 Okta 登录小部件集成到我的 Angular 应用程序中。

一切正常 - 我可以成功登录和退出 - 除了运行 Jest 测试时出现错误。

编辑：我还发现了这个 Github 问题https://github.com/cssivision/qrcode-react/issues/15这似乎与我的问题有些相关，但解决方案仍然无法解决。

第二次编辑：

这是完整的错误堆栈

 console.error node_modules/jsdom/lib/jsdom/virtual-console.js:29
Error: Not implemented: HTMLCanvasElement.prototype.getContext (without installing the canvas npm package)
    at module.exports (C:\Users\18790\source\Workspaces\ionComplianceUI\node_modules\jsdom\lib\jsdom\browser\not-implemented.js:9:17)
    at HTMLCanvasElementImpl.getContext (C:\Users\18790\source\Workspaces\ionComplianceUI\node_modules\jsdom\lib\jsdom\living\nodes\HTMLCanvasElement-impl.js:42:5)
    at HTMLCanvasElement.getContext (C:\Users\18790\source\Workspaces\ionComplianceUI\node_modules\jsdom\lib\jsdom\living\generated\HTMLCanvasElement.js:50:45)
    at getContext (C:\Users\18790\source\Workspaces\ionComplianceUI\node_modules\@okta\okta-signin-widget\dist\js\webpack:\packages\@okta\qtip2\dist\jquery.qtip.js:2078:50)
    at Object.<anonymous> (C:\Users\18790\source\Workspaces\ionComplianceUI\node_modules\@okta\okta-signin-widget\dist\js\webpack:\packages\@okta\qtip2\dist\jquery.qtip.js:2077:24)
FAIL  src/app/ion-okta-auth/login/__tests__/login.component.spec.tsules\@okta\okta-signin-widget\dist\js\webpack:\packages\@okta\qtip2\dist\jquery.qtip.js:22:3

这个Github 问题和进一步的调查使我找到了jest-canvas-mock npm 包，该包需要添加为 devDependency 并使用 package.json 中的 jest setupFiles 数组进行设置——但我再次看到相同的错误消息。

标签： angularjestjsokta

解决方案

我所要做的就是安装 jest canvas mock

npm i jest-canvas-mock

将此添加到 package.json

"jest": {
   "setupFiles": ["jest-canvas-mock"]
}

使用创建反应应用程序。

推荐阅读