web-dev-qa-db-ja.com

Jest SecurityError：localStorageは不透明な起源には使用できません

自分のプロジェクトを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>)
javascriptnode.jsnpmjestjs
130
amirdehghan

http://localhost接頭辞を付けてアプリケーションにアクセスしている場合は、（jest.config.js内の）jest設定を次のように更新する必要があります。

  "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/",

    // ...
  }]
}
119
David R

私はこれを大規模なモノレポにまとめました（それ以外の場合はjsdomを必要としなかった単体テストで）。 jest.config.js（またはpackage.jsonと同等のもの）に次の項目を明示的に設定することで、この問題も軽減されました。

module.exports = {
  testEnvironment: 'node'
}

更新：Nicolasが以下に述べるように（ありがとう！）、設定ファイルを使っていないのであれば、以下のフラグを追加することができます。

jest --testEnvironment node    
# or 
jest --env=node
73
Burgi

どの環境（--env）を使用するのかを指定する必要があります。

package.jsonでjestコマンドを実行するときは、環境（jsdomまたはnode）を指定する必要があります。例えば：

  "scripts": {
    "jest": "jest --env=node --colors --coverage test",
    "test": "npm run jest"
  },

これはあなたのために働くはずです！

16
Manuel Morejón

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/" });
5
p8ul

私のJestの設定にtestURL: "http://localhost"を追加するという一流の答えの中での提案は私にはうまくいきませんでした。しかし、 jsdomオブジェクトの作成時にURLを渡すというjsdom GitHubのディスカッションからのこの提案 は行った。

const url = 'http://localhost';

const dom = new JSDOM('<!DOCTYPE html><html><body></body></html>', { url });
1
Scott Martin

これは愚かに聞こえるかもしれませんが、私にとっては、npm updateを付けてランダムパッケージを誤ってインストールしたために問題が発生しました。私はnpm installを実行してからnpm updateを実行していましたが、npm installのみ実行したはずです。 node_modulesディレクトリを削除し、npm installを再度実行することで問題を解決しました。

0
Rock Lee

enzymeをjestと統合するとき、これは私にポップアップしました。 Github Issue Discussion は上記と同じ、つまり追加することを示唆しています

"testURL": "http://localhost/"

jestの設定へ。しかし、これは酵素によっても引き起こされることを知っておくのは良いことです。私にとってそれはReact v15とv15アダプターでした。

0
pascalwhoop

React JSを使っている間は何もする必要はありません。 JESTを配置してテスト環境をセットアップするのは、create-react-appのデフォルトの動作です。以下の実行で、テストの成功または失敗を示し始めます、

nPMテスト

テストカバレッジが必要な場合は、単にpackage.jsonファイルに以下を追加する必要があります。

"test"： "react-scripts test --coverage" package.jsonの "script"は次のようになります。

"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --coverage",
"eject": "react-scripts eject"

}

0
Amjad Khan