Jest SecurityError：localStorage 不适用于不透明的来源
Posted
技术标签:
【中文标题】Jest SecurityError：localStorage 不适用于不透明的来源【英文标题】：Jest SecurityError: localStorage is not available for opaque origins 【发布时间】：2019-01-04 08:47:54 【问题描述】：当我想使用命令 npm run test 运行我的项目时，我收到以下错误。这是什么原因造成的？
FAIL
● Test suite failed to run
SecurityError: localStorage is not available for opaque origins at Window.get localStorage [as localStorage] (node_modules/jsdom/lib/jsdom/browser/Window.js:257:15)
at Array.forEach (<anonymous>)
【问题讨论】：
您如何访问您的应用程序？.. 我的意思是，您是否像http://localhost:port... 一样访问它？
这是测试运行器的问题，@DavidR，他有问题 >>>npm run test
@MartinChaov 是的，我知道。我想看看他的回复，以检查他的jest 配置是否有问题:-)
我自己刚开始遇到这个......我在代码中根本没有使用本地存储。你的代码也使用 ts-jest 吗？
@k2snowman69 请检查我的回答并发表您的评论。
【参考方案1】：
如果您使用 http://localhost 前缀访问您的应用程序，则需要将您的 jest 配置（在您的 jest.config.js 中）更新为，
"jest":
"verbose": true,
"testURL": "http://localhost/"
如果您还没有任何 jest 配置，只需将配置包含在您的 package.json 中即可。例如：
"name": "...",
"description": "...",
...
"jest":
"verbose": true,
"testURL": "http://localhost/"
或jest.config.js：
module.exports =
verbose: true,
testURL: "http://localhost/",
...
或者如果您配置了projects：
module.exports =
verbose: true,
projects: [
runner: 'jest-runner',
testURL: "http://localhost/",
// ...
]
【讨论】：
是的，这对我有用......虽然我不太明白为什么我需要这个，也不明白为什么它在最新升级之前工作 这在jest github页面中讨论：github.com/facebook/jest/issues/6766
你也可以在你的 npm 脚本中使用 cli 选项：jest --testURL=\"http://localhost\"。如果您因为其他环境（对我来说是反应脚本）而无法设置全局笑话配置，则很有用。
我正在研究原生反应。即使对我来说testUrl 也有效。【参考方案2】：
我刚刚在一个大型 monorepo 中出现了这个问题（在单元测试中，否则就不需要 jsdom）。在我们的jest.config.js（或package.json 等效项）中显式设置以下内容也缓解了这个问题：
module.exports =
testEnvironment: 'node'
更新：正如 Nicolas 在下面提到的（谢谢！），如果您不使用任何配置文件，您还可以添加以下标志：
jest --testEnvironment node
# or
jest --env=node
【讨论】：
这对我有用！这就是你需要的答案！谢谢！ 作者好像没有node环境，应该设置testEnvironment: "jsdom"。这适用于我的最新更新。谢谢你的建议！ 正如下面其他一些答案中提到的，您可以通过运行jest --testEnvironment node 或其简写形式jest --env=node 跳过配置文件（或package.json 属性）的生成。
这应该是公认的答案。它似乎更适合错误。此外，如果您只是测试脚本，那么定义 testURL 是没有意义的。【参考方案3】：
您必须指定要使用的环境 (--env)。
当您在package.json 中运行jest 命令时，您应该指定环境（jsdom 或node）。例如：
"scripts":
"jest": "jest --env=node --colors --coverage test",
"test": "npm run jest"
,
这应该适合你！
【讨论】：
如果您使用的是 jsdom，无论您是否通过配置或命令行指定env，都会发生同样的事情。这只是从今天 jest 的最新更新开始发生的。如果您遇到这种情况，请参阅@David R 的答案以获得解决方案。
有道理，环境决定了测试应该如何运行，而jsdom似乎是默认的。【参考方案4】：
如果您使用的是 jsdom，请确保包含 url。
签出 jsdom 存储库的简单选项。 https://github.com/jsdom/jsdom#simple-options
const jsdom = require("jsdom");
const JSDOM = jsdom;
const dom = new JSDOM(`...`, url: "https://example.org/" );
【讨论】：
就我而言，我在我的 jsdom 配置文件中添加了该代码。var jsdom = require('jsdom'); var exposedProperties = ['window', 'navigator', 'document']; const JSDOM = jsdom; const document = (new JSDOM('', url: "https://localhost/",)).window; global.document = document;
+1 虽然不是专门针对 Jest，但这是一种替代解决方案，可用于其他设置（因为这是错误代码的顶部 SO，其他人，比如我，会找到这个页面谁不使用 Jest）根据@dspacejs 好问题，这将是一个单独的文件，通过package.json 中的测试命令调用。例如，此代码可以保存在 testHelper.ts 文件中并使用 mocha 调用：scripts: test-setup: 'mocha --compilers ts:ts-node/register,tsx:ts-nocde/register --require testHelper.ts --reporter progress' 。【参考方案5】：
在我的 Jest 配置中添加 testURL: "http://localhost" 的***答案中的建议对我不起作用。但是，this suggestion from the jsdom GitHub discussion 在创建 jsdom 对象时传入了 URL。
const url = 'http://localhost';
const dom = new JSDOM('<!DOCTYPE html><html><body></body></html>', url );
【讨论】：
【参考方案6】：要解决 Jest SecurityError: localStorage 错误，您需要将 jest: ... 部分添加到您的 package.json 文件中
"name": "...",
"version": "..",
"main": "..",
"description": "...",
...
"jest": "verbose": true, "testURL": "http://localhost/" ,
【讨论】：
【参考方案7】：对我来说，这是通过升级到 "jest": "^24.9.0",
【讨论】：
【参考方案8】：这听起来可能很傻，但对我来说，问题是因为我错误地安装了带有npm update 的随机包。我运行npm install，然后运行npm update，但我应该只运行npm install。我通过删除node_modules 目录并再次运行npm install 解决了这个问题。
【讨论】：
这与我有关，实际上由于企业代理，我无法正确完成npm install。因此，该模式将未完成npm installation【参考方案9】：
在使用 React JS 时，您不需要做任何事情。放置 JEST 并设置测试环境是 create-react-app 的默认行为。 在下面运行时，它开始显示测试成功或失败，
npm 测试
如果您想要测试覆盖率，您只需将以下内容添加到 package.json 文件中
"test": "react-scripts 测试 --coverage" 现在你的 package.json 的“脚本”看起来像，
"scripts":
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --coverage",
"eject": "react-scripts eject"
【讨论】：
【参考方案10】：当我将enzyme 与jest 集成时，我弹出了这个。 Github Issue Discussion 建议与上述相同，即添加
"testURL": "http://localhost/"
到开玩笑的配置。然而，很高兴知道这也是由酶触发的。对我来说，它是 React v15 和 v15 适配器。
【讨论】：
【参考方案11】：我有同样的问题，把它放在我的 package.json 文件中对我有用：
"jest":
"verbose": true,
"testURL": "http://localhost/"
【讨论】：
【参考方案12】：如果您使用的是 jsdom，则必须更改设置以进行如下测试：
const JSDOM = require('jsdom');
const jsdom = new JSDOM('<!doctype html><html><body></body></html>',
url: 'http://localhost/',
);```
【讨论】：
以上是关于Jest SecurityError：localStorage 不适用于不透明的来源的主要内容，如果未能解决你的问题，请参考以下文章