Jest SecurityError：localStorageは不透明なオリジンには使用できません

144

コマンドを使用してプロジェクトを実行すると、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...？

— デビッドR

これは、彼は<<< >>> NPMの実行テストで問題があり、テストランナー、@DavidRに問題がある

— マーティンChaov

@MartinChaovうんうん。彼のjest設定に問題があるかどうかを確認するために、彼の返信を確認したい:-)

— David R

1

私はこれを自分で実行し始めました...コードでローカルストレージをまったく使用していません。あなたのコードはts-jestも使用していますか？

— k2snowman69 2018

@ k2snowman69私の回答を確認してコメントを投稿してください。

— デビッドR

139

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

    // ...
  }]
}

— デビッドR
ソース

17

うん、私はこれを必要とする理由私はかなり理解していないのに、これは...私の仕事でも、それは最新のアップグレードの前に働いていた理由

— k2snowman69

1

これはjestgithubのページで議論されています：github.com/facebook/jest/issues/6766

— Jordan Bonitatis

2

npmスクリプトでcliオプションを使用することもできますjest --testURL=\"http://localhost\"。別の環境（react-scripts for me）のためにグローバルjest設定を設定できない場合に役立ちます。

— Burrich

反応ネイティブに取り組んでいます。私でもtestUrl働いた。

— Jimit Patel、2018

78

私はこれを大規模なモノレポ（ユニットテストではjsdomを必要としなかったはず）で発生させました。以下を明示的にjest.config.js（またはpackage.json同等のものに）設定することで、この問題も緩和されました。

module.exports = {
  testEnvironment: 'node'
}

更新：ニコラスが以下で述べたように（ありがとう！）、構成ファイルを使用していない場合は、次のフラグを追加することもできます。

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

— ブルギ
ソース

3

これは私のために働いた！これがあなたが必要とする答えです！ありがとう！

— blueprintchris

著者はノード環境を持っていないようです-彼の場合、彼はtestEnvironment： "jsdom"を設定する必要があります。これは、最新のアップデートで動作します。アドバイスありがとうございます！

— PhilippMöhler18年

3

以下のいくつかの他の回答で述べたように、実行するjest --testEnvironment nodeか、省略形jest --env=nodeで実行することで、設定ファイル（またはpackage.jsonプロパティ）の生成をスキップできます。

— ニコラスFantone

2

これは受け入れられる答えになるはずです。エラーの方が適切と思われます。また、スクリプトをテストするだけの場合は、を定義しても意味がありませんtestURL。

— Dez、2007

16

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

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

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

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

— マヌエルモレホン
ソース

1

jsdomを使用している場合、envvia configまたはcommandline を指定するかどうかに関係なく、同じことが起こります。これは、今日のjestの最新アップデートでのみ発生し始めました。これが当てはまる場合の解決策については、@ David Rの回答を参照してください。

— fisch2 2018

7

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

— p8ul
ソース

私の場合、私のコードをjsdom構成ファイルに追加しました。

var jsdom = require('jsdom'); var exposedProperties = ['window', 'navigator', 'document'];  const { JSDOM } = jsdom;  const {document }  = (new JSDOM('',{ url: "https://localhost/",})).window;  global.document = document;

— p8ul 2018

+1特にJestについてではありませんが、これは代替ソリューションであり、他のセットアップに使用できます（これはエラーコードのトップSOであるため、私などの他の人はJestを使用していないこのページを見つけます）Per @ dspacejs良い質問です。これは、のテストコマンドを介して呼び出される個別のファイルですpackage.json。たとえば、このコードはtestHelper.tsファイルに保存して、mocha：を使用して呼び出すことができます

scripts: { test-setup: 'mocha --compilers ts:ts-node/register,tsx:ts-nocde/register --require testHelper.ts --reporter progress' }

。

— jmbertucci 2018

4

testURL: "http://localhost"私のJest設定に追加するという最高評価の回答の提案は、私にとってはうまくいきませんでした。ただし、jsdomオブジェクトの作成時にURLを渡すというjsdom GitHubディスカッションからのこの提案は、実際にはそうでした。

const url = 'http://localhost';

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

— スコット・マーティン
ソース

1

私にとって、これは「jest」にアップグレードすることで解決されました：「^ 24.9.0」、

— マイク・ロドフ
ソース

0

これはばかげているように聞こえるかもしれませんが、私にとっては、でランダムパッケージを誤ってインストールしたために問題が発生しましたnpm update。私は走っていたnpm installし、その後npm update、私は唯一の走っているはずですnpm install。node_modulesディレクトリを削除してnpm install再度実行することで問題を修正しました。

— ロック・リー
ソース

これは私に関係しています。実際にはnpm install、エンタープライズプロキシが原因で適切に終了することができませんでした。だから、パターンが完了していないだろうnpm installエーションを

— Z. Khullah

0

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

これは、と統合enzymeするときにポップアップしましたjest。Githubの問題についての議論は、上記のように、すなわち追加、同じことを示唆しています

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

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

— パスカルフープ
ソース

0

私は同じ問題を抱えており、これを私のpackage.jsonファイルに入れるとうまくいきました：

"jest": {
    "verbose": true,
    "testURL": "http://localhost/"
}

— ザヒド・アリ
ソース

0

Jest SecurityError: localStorageエラーを解決するにはjest: { ... }、package.jsonファイルにパーツを追加する必要があります

{

"name": "...",
"version": "..",
"main": "..",
"description": "...",
...

"jest": { "verbose": true, "testURL": "http://localhost/" },

}

— ウジェーヌ・ベリエフ
ソース