Just 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>)
만약 당신이 당신의 애플리케이션에 접속하고 있다면,http://localhost
접두사, 당신은 당신의 농담 구성을 업데이트해야 합니다.jest.config.js
) 로서,
"jest": {
"verbose": true,
"testURL": "http://localhost/"
}
아직 농담 구성이 없는 경우에는 해당 구성을 다음에 포함합니다.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/",
// ...
}]
}
의 구성을 위해package.json
jej v28에서 test URL이 제거되었습니다.이제 testEnvironmentOptions를 사용하여 다음과 같은 url 옵션을 전달해야 합니다.
"jest": {
"verbose": true,
"testEnvironmentOptions": {
"url": "http://localhost/"
}
}
저는 방금 큰 모노레포(단위 테스트에서, 그렇지 않았다면 jsdom이 필요하지 않았을 것)에서 이 크롭을 했습니다.다음 사항을 당사에서 명시적으로 설정jest.config.js
(또는package.json
동등) 또한 이 문제를 완화했습니다.
module.exports = {
testEnvironment: 'node'
}
업데이트: Nicolas가 아래에 언급한 것처럼 구성 파일을 사용하지 않는 경우 다음 플래그를 추가할 수도 있습니다.
jest --testEnvironment node
# or
jest --env=node
어떤 환경인지 지정해야 합니다(--env
)을 사용할 것입니다.
실행할 때jest
의 지휘권.package.json
환경을 지정해야 합니다(jsdom
또는node
). 예:
"scripts": {
"jest": "jest --env=node --colors --coverage test",
"test": "npm run jest"
},
이것은 당신에게 효과가 있을 것입니다!
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/" });
동일한 문제가 발생하여 수동으로 설치했습니다.jest-environment-jsdom
버전 28(이 GitHub 스레드 기반)이 해결했습니다.
just를 v28.0.3으로 업데이트할 때 문제가 발생했습니다.릴리스 28.0.0에서는 testUrl을 제거하고 기본값이 'http://localhost/'인 속성 URL을 가진 개체 testEnvironmentOptions를 도입한 것 같습니다.
사용 중지 경고:
옵션 "testURL"이 "testEnvironmentOptions.url"을 통해 URL을 전달하는 것으로 대체되었습니다.
구성을 업데이트하십시오.
구성 설명서: https://jestjs.io/docs/configuration
PR은 여기에서 확인하십시오. https://github.com/facebook/jest/pull/10797
그러나 jejest-environment-jsdom을 업데이트하고 jejest.config.js testEnvironment를 설정했을 때 문제가 사라졌습니다.
module.exports = {
...
testEnvironment: 'jest-environment-jsdom',
...
}
추가에 대한 상위 등급 답변의 제안은testURL: "http://localhost"
내 Jest 설정은 나에게 효과가 없었습니다.그러나 jsdom GitHub 토론에서 제안한 jsdom 개체를 만들 때 URL을 전달하는 것은 가능했습니다.
const url = 'http://localhost';
const dom = new JSDOM('<!DOCTYPE html><html><body></body></html>', { url });
나에게 이것은 "jest"로 업그레이드함으로써 해결되었습니다: "^24.9.0",
문를해결을 .Jest SecurityError: localStorage
오류: 패키지에 부품을 추가해야 합니다.json 파일
{
"name": "...",
"version": "..",
"main": "..",
"description": "...",
...
"jest": { "verbose": true, "testURL": "http://localhost/" },
}
바보같이 들릴 수도 있지만, 저에게 문제는 제가 실수로 무작위 패키지를 설치했기 때문에 발생했습니다.npm update
달리고 있었습니다.npm install
그리고 나서.npm update
는 ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠnpm install
는 삭하여문해니다습결했제를을 삭제하여 문제를 했습니다.node_modules
및 중npm install
한 번
React JS로 작업하는 동안에는 아무것도 할 필요가 없습니다.JEST를 배치하고 테스트 환경을 설정하는 것은 create-react-app의 기본 동작입니다.아래를 실행하면 테스트 성공 또는 실패를 표시하기 시작합니다.
npm 테스트
테스트 적용 범위를 원하는 경우 아래 내용을 패키지에 추가하기만 하면 됩니다.json 파일
"test": "react-scripts test --coverage" 이제 패키지의 "script"입니다.json은 마치,
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --coverage",
"eject": "react-scripts eject"
}
통합할 때 이 메시지가 표시되었습니다.enzyme
와 함께jest
Github 이슈 토론은 위에서 언급한 것과 동일한 것을 제안합니다. 즉, 추가.
"testURL": "http://localhost/"
농담 구성으로.하지만, 이것이 효소에 의해서도 유발된다는 것을 아는 것은 좋습니다.저는 React v15와 v15 어댑터를 사용했습니다.
나도 같은 문제가 있고 이것을 나의 것에 둡니다.package.json
파일 작업 완료:
"jest": {
"verbose": true,
"testURL": "http://localhost/"
}
jsdom을 사용하는 경우 다음과 같은 테스트를 위해 설정을 변경해야 합니다.
const { JSDOM } = require('jsdom');
const jsdom = new JSDOM('<!doctype html><html><body></body></html>', {
url: 'http://localhost/',
});```
언급URL : https://stackoverflow.com/questions/51554366/jest-securityerror-localstorage-is-not-available-for-opaque-origins
'programing' 카테고리의 다른 글
Swift에서 iPhone의 화면 너비를 가져오는 방법UI? (0) | 2023.07.31 |
---|---|
HTML에서 구성 요소의 선택 도구 태그 제거/바꾸기 (0) | 2023.07.31 |
내림차순 날짜순 정렬 - 월, 일 및 연도 (0) | 2023.07.31 |
MySQL에서 JSON_EXTRACT를 사용하고 따옴표 없이 문자열을 얻으려면 어떻게 해야 합니까? (0) | 2023.07.31 |
Android가 JS 번들을 로드하지 못했습니다. (0) | 2023.07.31 |