Jest SecurityError: localStorage non è disponibile per origini opache

144

Quando voglio eseguire il mio progetto con il comando npm run test, visualizzo l'errore di seguito. Cosa sta causando questo?

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
fonte

Come si accede alla propria applicazione? .. Voglio dire, ci si accede come http://localhost:port...?

— David R,

Questo è un problema con il test runner, @DavidR, ha problemi con >>> test di esecuzione npm <<<

— Martin Chaov,

@MartinChaov Sì, lo so. Vorrei vedere la sua risposta per verificare se qualcosa non andava nella sua jestconfigurazione :-)

— David R

1

Ho appena iniziato a imbattermi in questo ... Non sto usando l'archiviazione locale nel codice. Anche il tuo codice utilizza ts-jest?

— k2snowman69,

@ k2snowman69 Controlla la mia risposta e pubblica il tuo commento.

— David R,

139

Nel caso, se si accede alla propria applicazione con un http://localhostprefisso, è necessario aggiornare la propria configurazione jest (nella propria jest.config.js) come,

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

Nel caso in cui non si abbia già una configurazione jest, è sufficiente includere la configurazione nel proprio package.json. Per esempio:

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

o in jest.config.js:

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

o se hai projectsconfigurato:

module.exports = {
  verbose: true,

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

    // ...
  }]
}

— David R
fonte

17

Sì, ha funzionato per me ... anche se non capisco bene perché ne ho bisogno, né perché funzionasse prima dell'ultimo aggiornamento

— k2snowman69,

1

Questo è discusso nella jestpagina di github: github.com/facebook/jest/issues/6766

— Jordan Bonitatis,

2

È inoltre possibile utilizzare l'opzione cli nello script NPM: jest --testURL=\"http://localhost\". Utile se non è possibile impostare una configurazione jest globale a causa di un altro ambiente (reagire-script per me).

— Burrich,

Sto lavorando su reattivo nativo. Anche per me ha testUrlfunzionato.

— Jimit Patel,

78

Ho appena avuto questo ritaglio in un grande monorepo (nei test unitari, che altrimenti non avrebbe richiesto jsdom). L'impostazione esplicita di quanto segue nel nostro jest.config.js(o package.jsonequivalente) ha anche alleviato il problema:

module.exports = {
  testEnvironment: 'node'
}

Aggiornamento: Come Nicolas menzionato di seguito (grazie!), Puoi anche aggiungere i seguenti flag se non stai usando alcun file di configurazione:

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

— Burgi
fonte

3

Questo ha funzionato per me! QUESTA è la risposta di cui hai bisogno! Grazie!

— blueprintchris,

Sembra che l'autore non abbia un ambiente nodo - nel suo caso dovrebbe impostare testEnvironment: "jsdom". Questo funziona per me con l'ultimo aggiornamento. Grazie per il tuo consiglio!

— Philipp Möhler,

3

Come menzionato in alcune altre risposte di seguito, puoi saltare la generazione di un file di configurazione (o proprietà package.json) eseguendo jest --testEnvironment nodeo la sua scorciatoia jest --env=node, intead.

— Nicolás Fantone,

2

Questa dovrebbe essere la risposta accettata. Sembra più appropriato per l'errore. Inoltre, se stai solo testando gli script, non ha senso definire un testURL.

— Dez,

16

È necessario specificare quale ambiente ( --env) si intende utilizzare.

Quando si esegue il jestcomando in package.jsonè necessario specificare l'ambiente ( jsdomo node). Per esempio:

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

Questo dovrebbe funzionare per te!

— Manuel Morejón
fonte

1

Se stai usando jsdom, la stessa cosa accade indipendentemente dal fatto che tu specifichi o meno una envvia config o una riga di comando. Questo è iniziato solo con l'ultimo aggiornamento di jest oggi. Vedi la risposta di @David R per una soluzione se questo è il tuo caso.

— fisch2,

7

Se stai usando jsdom, assicurati di includere url.

Acquista le semplici opzioni del repository jsdom. https://github.com/jsdom/jsdom#simple-options

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

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

— p8ul
fonte

Nel mio caso ho aggiunto quel codice nel mio file di configurazione 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 Sebbene non sia specificamente su Jest, questa è una soluzione alternativa e potrebbe essere utilizzata per altre configurazioni (poiché si tratta del SO principale per il codice di errore, altri, come me, troveranno questa pagina che non utilizza Jest) Per @ dspacejs buona domanda, questo sarebbe un file separato che viene chiamato tramite il comando test in package.json. Ad esempio, questo codice potrebbe essere salvato in un testHelper.tsfile e la chiamò con moka:

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

.

— jmbertucci,

4

Il suggerimento nella risposta più votata di aggiungere testURL: "http://localhost"alla mia configurazione Jest non ha funzionato per me. Tuttavia, questo suggerimento della discussione su jsdom GitHub , di passare un URL durante la creazione dell'oggetto jsdom, ha funzionato.

const url = 'http://localhost';

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

— Scott Martin
fonte

1

per me questo è stato risolto aggiornando a "jest": "^ 24.9.0",

— Mike Rodov
fonte

0

Questo può sembrare sciocco, ma per me il problema è stato causato perché avevo erroneamente installato pacchetti casuali con npm update. Stavo correndo npm installe poi npm updateavrei dovuto solo correre npm install. Ho risolto il problema eliminando la node_modulesdirectory ed eseguendolo di npm installnuovo.

— Rock Lee
fonte

Ciò riguarda me, in realtà non sono riuscito a finire npm installcorrettamente a causa del proxy aziendale. Così, il modello sarebbe incompleta npm installzione

— Z. Khullah

0

Non devi fare nulla mentre lavori con React JS. È comportamento predefinito dell'app create-reagire-posizionare JEST e impostare l'ambiente di test. In esecuzione di seguito, inizia a mostrare l'esito positivo o negativo del test,

test npm

Nel caso in cui si desideri la copertura del test, è sufficiente aggiungere di seguito il file package.json

"test": "reatt-script test --coverage" Ora il tuo "script" di package.json sembra,

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

}

— Amjad Khan
fonte

0

Questo è emerso con me durante l'integrazione enzymecon jest. La discussione sul problema di Github suggerisce lo stesso di quanto notato sopra, vale a dire l'aggiunta

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

al massimo config. Tuttavia, è bene sapere che questo è innescato anche dall'enzima. Per me era React v15 e l'adattatore v15.

— pascalwhoop
fonte

0

Ho lo stesso problema e inserendo questo nel mio package.jsonfile ha funzionato per me:

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

— Zahid Ali
fonte

0

Per risolvere l' Jest SecurityError: localStorageerrore è necessario aggiungere la jest: { ... }parte al file package.json

{

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

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

}

— Eugène Beliaev
fonte