jestとjsdomを私の反応プロジェクトにインストールしましたが、window.localStorage
変数を使用する反応コンポーネントのインポートに問題があります。私は、問題を解決すると信じていたjsdom用のセットアップファイルを追加しました。ここでjestをjestで設定するには
は私の設定です:package.jsonで
冗談の設定
"jest": {
"verbose": true,
"testEnvironment": "jsdom",
"testURL": "http://localhost:8080/Dashboard/index.html",
"transform": {
"^.+\\.js$": "<rootDir>/node_modules/babel-jest",
"^.+\\.jsx$": "<rootDir>/node_modules/babel-jest"
},
"unmockedModulePathPatterns": [
"node_modules/react/",
],
"moduleFileExtensions": [
"js",
"jsx",
"json",
"es6"
]
}
setup.js
import jsdom from 'jsdom';
const DEFAULT_HTML = '<html><body></body></html>';
global.document = jsdom.jsdom(DEFAULT_HTML);
global.window = document.defaultView;
global.navigator = window.navigator;
global.localStorage = window.localStorage;
test.js
'use strict';
import setup from './setup';
import React from 'react';
import jsdom from 'jsdom';
import Reportlet from '../components/Reportlet.jsx';
it('Ensures the react component renders',() => {
});
マイreportletコンポーネントの使用localStor age変数が、叫ぶ:
Cannot read property getItem of undefined
を私はlocalStorage.getItem(<some item>)
を呼び出すときに、私は冗談が来ることをhereを読んでjsdomに同梱されますが、私は余分なjsdom依存性を必要とするかどうかわかりません。私はhereを読んでjsdomを最初に反応させる前にロードする必要があることも読んでいます。
jsdomでjestを正しく設定する方法を知っている人はいますか?
jsdomはのlocalStorageをサポートしていません。 Node-localstorageのようなノードにやさしいスタブを使うことができるようです - https://github.com/tmpvar/jsdom/issues/1137のコメントの一番下を参照するか、https:// github.com/letsrock-today/mock-local-storageまたは自分自身を回すhttp://stackoverflow.com/questions/11485420/how-to-mock-localstorage-in-javascript-unit-tests –
ああ私はそれを見るjsdomの機能が欠落していることに特有です。私はあなたの提案したnode-localstorageのソリューションを使って私の問題を解決しました。これを回答として書式化すると、私はそれを正解として喜んで受け入れます。 –
うれしい私は助けることができました!私は私のマシンに戻ってきたときに答えを返すよ(今の電話で)。ありがとう! –