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>)
amirdehghan
источник
Как вы получаете доступ к своему приложению? .. Я имею в виду, вы обращаетесь к нему, как http://localhost:port...,?
Дэвид Р
Это проблема с бегуном теста, @DavidR, у него есть проблема с >>> npm run test <<<
Martin Chaov
@ MartinChaov Да, я знаю это. Я хотел бы увидеть его ответ, чтобы убедиться, что что-то не так в его jestконфигурации :-)
David R
1
Я только начал сталкиваться с этим сам ... Я вообще не использую локальное хранилище в коде. Ваш код тоже использует ts-jest?
k2snowman69
@ k2snowman69 Пожалуйста, проверьте мой ответ и оставьте свой комментарий.
Дэвид Р

Ответы:

139

В случае, если вы обращаетесь к своему приложению с http://localhostпрефиксом, вам необходимо обновить свою конфигурацию Jest (в вашем jest.config.js) как,

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

    // ...
  }]
}
Дэвид Р
источник
17
Да, это сработало для меня ... хотя я не совсем понимаю, зачем мне это нужно, и почему оно работало до последнего обновления
k2snowman69
1
Это обсуждается на jestстранице github: github.com/facebook/jest/issues/6766
Джордан Бонитатис,
2
Вы также можете использовать командную строку опцию в вашем НПМ сценарии: jest --testURL=\"http://localhost\". Полезно, если вы не можете установить глобальную конфигурацию Jest из-за другой среды (для меня реагируют на скрипты).
Баррич
Я работаю над реакцией родных. Даже у меня testUrlсработало.
Джимит Патель
78

Я только что получил это в большом monorepo (в модульных тестах, которые иначе не потребовали бы jsdom). Явная установка следующего в нашем jest.config.js(или package.jsonэквивалентном) также облегчает эту проблему:

module.exports = {
  testEnvironment: 'node'
}

Обновление: как Николя упомянул ниже (спасибо!), Вы также можете добавить следующие флаги, если вы не используете какие-либо конфигурационные файлы:

jest --testEnvironment node    
# or 
jest --env=node
Burgi
источник
3
Это сработало для меня! ЭТО ответ, который вам нужен! Спасибо!
blueprintchris
Похоже, что у автора нет узла среды - в его случае он должен установить testEnvironment: "jsdom". Это работает для меня с последним обновлением. Спасибо за ваш совет!
Филипп Мёлер
3
Как упоминалось в некоторых других ответах ниже, вы можете пропустить генерацию файла конфигурации (или свойства package.json), запустив jest --testEnvironment nodeего или его сокращение jest --env=node, intead.
Николас Фантоне
2
Это должен быть принятый ответ. Это кажется более подходящим для ошибки. Также, если вы тестируете только сценарии, нет смысла определять testURL.
Dez
16

Вы должны указать, в какой среде (--env ) вы собираетесь использовать.

Когда вы запускаете jestкоманду в, package.jsonвы должны указать среду ( jsdomили node). Например:

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

Это должно работать для вас!

Мануэль Морехон
источник
1
Если вы используете jsdom, то же самое происходит независимо от того, указали ли вы envчерез config или командную строку . Это только начало происходить с последним обновлением шутки сегодня. Пожалуйста, смотрите ответ @David R для решения, если это так.
fisch2
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
+1 Хотя это не относится конкретно к Jest, это альтернативное решение, и его можно использовать для других настроек (так как это верхняя SO для кода ошибки, другие, как я, найдут эту страницу, не использующую Jest) Per @ Хороший вопрос dspacejs, это будет отдельный файл, который вызывается с помощью вашей команды test in package.json. Например, этот код может быть сохранен в testHelper.tsфайле и вызывается с помощью мокко: scripts: { test-setup: 'mocha --compilers ts:ts-node/register,tsx:ts-nocde/register --require testHelper.ts --reporter progress' }.
jmbertucci
4

Предложение в ответе о добавлении testURL: "http://localhost"в мой Jest config не сработало. Тем не менее, это предложение из обсуждения jsdom GitHub о передаче URL при создании объекта jsdom, сделало.

const url = 'http://localhost';

const dom = new JSDOM('<!DOCTYPE html><html><body></body></html>', { url });
Скотт Мартин
источник
1

для меня это было решено обновлением до "шутка": "^ 24.9.0",

Майк Родов
источник
0

Это может показаться глупым, но для меня проблема была вызвана тем, что я по ошибке установил случайные пакеты с npm update. Я бежал npm installи тогда, npm updateно я должен был только бежать npm install. Я исправил проблему, удалив node_modulesкаталог и npm installснова запустив его.

Рок Ли
источник
Это касается меня, я фактически не смог закончить npm installдолжным образом из-за корпоративного прокси. Таким образом, картина будет незавершенной npm installAtion
Z. Khullah
0

Вам не нужно ничего делать при работе с React JS. Поведение create-реагировать на приложение по умолчанию для размещения JEST и настройки среды тестирования. При запуске ниже, он начинает показывать успех теста или неудачу,

тест npm

Если вы хотите тестовое покрытие, вам просто нужно добавить ниже в файл package.json

"test": "test-scripts test --coverage" Теперь ваш "скрипт" package.json выглядит так:

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

в шутку конфиг. Тем не менее, хорошо знать, что это также вызывается ферментом. Для меня это был React v15 и адаптер v15.

pascalwhoop
источник
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/" },

}
Евгений Беляев
источник