Jest SecurityError: localStorage no está disponible para orígenes opacos

144

Cuando quiero ejecutar mi proyecto con el comando npm run test, aparece el siguiente error. ¿Qué está causando esto?

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
fuente

¿Cómo accede a su aplicación? .. Quiero decir, ¿está accediendo a ella como http://localhost:port...?

— David R

Este es un problema con el corredor de prueba, @DavidR, tiene problemas con >>> npm run test <<<

— Martin Chaov

@ MartinChaov Sí, lo sé. Me gustaría ver su respuesta para verificar si algo anda mal en su jestconfiguración :-)

— David R

1

Acabo de empezar a encontrarme con esto ... No estoy usando almacenamiento local en absoluto en el código. ¿Tu código también usa ts-jest?

— k2snowman69

@ k2snowman69 Por favor revise mi respuesta y publique su comentario.

— David R

139

En caso de que esté accediendo a su aplicación con un http://localhostprefijo, debe actualizar su configuración de broma (en su jest.config.js) como,

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

En caso de que aún no tenga ninguna configuración de broma, simplemente incluya la configuración en su package.json. Por ejemplo:

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

o en jest.config.js:

module.exports = {
  verbose: true,
  testURL: "http://localhost/",
  ...
}

o si has projectsconfigurado:

module.exports = {
  verbose: true,

  projects: [{
    runner: 'jest-runner',
    testURL: "http://localhost/",

    // ...
  }]
}

— David R
fuente

17

Sí esto funcionó para mí ... aunque yo no entiendo muy bien por qué necesito esto ni por qué estaba trabajando antes de la última actualización

— k2snowman69

1

Esto se discute en la jestpágina de github: github.com/facebook/jest/issues/6766

— Jordan Bonitatis

2

También puede utilizar la opción de CLI en el script NPM: jest --testURL=\"http://localhost\". Útil si no puede establecer una configuración global de broma debido a otro entorno (react-scripts para mí).

— Burrich

Estoy trabajando en reaccionar nativo. Incluso para mí testUrltrabajó.

— Jimit Patel

78

Acabo de tener esto surgiendo en un gran monorepo (en pruebas unitarias, que de lo contrario no hubieran requerido jsdom). Establecer explícitamente lo siguiente en nuestro jest.config.js(o el package.jsonequivalente) también alivió ese problema:

module.exports = {
  testEnvironment: 'node'
}

Actualización: como Nicolas menciona a continuación (¡gracias!), También puede agregar los siguientes indicadores si no está utilizando ningún archivo de configuración:

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

— Burgi
fuente

3

¡Esto funcionó para mí! ¡ESTA es la respuesta que necesitas! ¡Gracias!

— blueprintchris

Parece que el autor no tiene un entorno de nodo; en su caso, debe establecer testEnvironment: "jsdom". Esto funciona para mí con la última actualización. ¡Gracias por su consejo!

— Philipp Möhler

3

Como se menciona en algunas otras respuestas a continuación, puede omitir la generación de un archivo de configuración (o propiedad package.json) ejecutando jest --testEnvironment nodeo su abreviatura jest --env=node, intead.

— Nicolás Fantone

2

Esta debería ser la respuesta aceptada. Parece más apropiado para el error. Además, si solo está probando scripts, no tiene sentido definir a testURL.

— Dez

16

Debe especificar qué entorno (--env ) va a utilizar.

Cuando ejecute el jestcomando en package.json, debe especificar el entorno ( jsdomo node). Por ejemplo:

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

¡Esto debería funcionar para ti!

— Manuel Morejón
fuente

1

Si está utilizando jsdom, lo mismo sucede independientemente de si especifica o no una envvía config o línea de comando. Esto solo comenzó a suceder con la última actualización de jest hoy. Consulte la respuesta de @David R para obtener una solución si este es el caso para usted.

— fisch2

7

Si está utilizando jsdom, asegúrese de incluir la URL.

Verifique las opciones simples del repositorio jsdom. https://github.com/jsdom/jsdom#simple-options

const jsdom = require("jsdom");
const { JSDOM } = jsdom;

const dom = new JSDOM(`...`, { url: "https://example.org/" });

— p8ul
fuente

En mi caso, agregué ese código en mi archivo de configuración 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 Aunque no se trata específicamente de Jest, esta es una solución alternativa y podría usarse para otras configuraciones (dado que este es el SO principal para el código de error, otros, como yo, encontrarán esta página que no están usando Jest) Per @ Buena pregunta de dspacejs, este sería un archivo separado que se llama a través de su comando de prueba package.json. Por ejemplo, este código podría ser guardado en un testHelper.tsarchivo y llama utilizando moka:

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

.

— jmbertucci

4

La sugerencia en la respuesta mejor calificada de agregar testURL: "http://localhost"a mi configuración de Jest no funcionó para mí. Sin embargo, esta sugerencia de la discusión jsdom GitHub , de pasar una URL al crear el objeto jsdom, lo hizo.

const url = 'http://localhost';

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

— Scott Martin
fuente

1

para mí esto se resolvió actualizando a "broma": "^ 24.9.0",

— Mike Rodov
fuente

0

Esto puede sonar tonto, pero para mí, el problema fue causado porque había instalado por error paquetes aleatorios con npm update. Estaba corriendo npm instally luego, npm updatepero solo debería haber corrido npm install. Solucioné el problema eliminando el node_modulesdirectorio y ejecutándolo npm installnuevamente.

— Rock Lee
fuente

Esto se relaciona conmigo, en realidad no pude terminar npm installcorrectamente debido al proxy de la empresa. Entonces, el patrón sería una npm installacción incompleta

— Z. Khullah

0

No necesita hacer nada mientras trabaja con React JS. El comportamiento predeterminado de create-react-app es colocar JEST y configurar el entorno de prueba. Al ejecutarse a continuación, comienza a mostrar que la prueba fue exitosa o fallida,

prueba npm

En caso de que desee una cobertura de prueba, simplemente necesita agregar a continuación al archivo package.json

"test": "react-scripts test --coverage" Ahora se ve su "script" de package.json,

"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --coverage",
"eject": "react-scripts eject"

}

— Amjad Khan
fuente

0

Esto apareció conmigo al integrarse enzymecon jest. La discusión del problema de Github sugiere lo mismo que se señaló anteriormente, es decir, agregar

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

a la configuración de broma. Sin embargo, es bueno saber que esto también se desencadena por la enzima. Para mí fue React v15 y el adaptador v15.

— pascalwhoop
fuente

0

Tengo el mismo problema y colocar esto en mi package.jsonarchivo funcionó para mí:

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

— Zahid Ali
fuente

0

Para resolver el Jest SecurityError: localStorageerror, debe agregar la jest: { ... }parte a su archivo package.json

{

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

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

}

— Eugène Beliaev
fuente