0
jest와 jsdom을 내 반응 프로젝트에 설치했지만 window.localStorage 변수를 사용하는 반응 구성 요소를 가져 오는 데 문제가 있습니다. jsdom에 대한 설정 파일을 추가하여 문제를 해결할 수 있다고 생각했습니다. 여기 농담으로 jsdom을 구성하는 방법
농담의 설정
"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 연령 변수하지만 으악 :
Cannot read property getItem of undefined 내가 농담이 jsdom와 함께 제공되는 오는 것을 here을 읽을 수는 있지만 내가 여분의 jsdom 의존성을 필요 아닌지 확실하지 않다 localStorage.getItem(<some item>)
를 호출 할 때. 나는 또한 here을 읽어 처음으로 반응을 요구하기 전에 jsdom을 로딩해야한다.
jsdom으로 jest를 올바르게 구성하는 방법을 아는 사람이 있습니까?
jsdom은 로컬 스토리지를 지원하지 않습니다. '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의 제안 된 솔루션을 사용하여 문제를 해결했다. 이 형식을 정답으로 사용하면 정답으로 기꺼이 받아 들일 것입니다. –
기꺼이 도와 드리겠습니다! 나는 내 컴퓨터로 돌아 왔을 때 답장을 할 것이다. (전화로). 감사! –