2017-12-29 19 views
0

Ich habe create-react-app verwendet, um eine neue react App zu erstellen und habe ein paar einfache Komponenten und Tests hinzugefügt. Wenn die Tests mit 'npm test' ausgeführt werden, laufen sie gut. Wenn ich mit "jest" spiele, bekomme ich "Unexpected token", wenn ich die importierte Komponente innerhalb des Tests verwende. Zum Beispiel:Beim Testen reagieren Projekt npm Test funktioniert aber Jest nicht

import React from 'react'; 
import { shallow } from 'enzyme'; 
import App from './App'; 

it('renders without crashing',() => { 
    shallow(<App />); 
}); 

Die Nutzung der App im Test gibt den Fehler, aber nur beim Laufen Scherz.

+0

was laufen Sie mit Scherz? create-react-app benutzt jest, wenn du 'npm test' spielst – Gintoki

+0

Einfach nur herumspielen. versuchen, den Unterschied herauszufinden. Es sieht so aus, als ob create-react-app etwas in package.json namens 'react-scripts test --env = jsdom' erstellt. Ich schätze, das nutzt Spaß darunter? Ich würde gerne mehr Kontrolle haben, da es mit dem Beobachter läuft und ich will das nicht immer tun. Ich hätte auch gerne Berichterstattung – user1584120

Antwort

1

Der unexpected token Fehler liegt wahrscheinlich daran, dass Sie babel-jest nicht installiert haben und den transform Schlüssel nicht zu jest.json hinzufügen. Ich erwarte, dass createReactApp is doing something to hide this from you. If you want to use non-createReactApp commands (like jest`), dann ich wurde ‚eject‘ die App (die rückgängig gemacht werden können), so dass Sie alle configs sehen usw.

oder Sie können Ihre eigenen jest.json hinzufügen, aber ich finde, dass diese Es könnte verwirrend sein, 2 Möglichkeiten zum Ausführen von Tests zu haben.

0

Wenn Sie mehr Kontrolle über das wollen, würde ich empfehlen, umgehen, was aus der Box kommt mit create-react-app.

Sie können einen test Eintrag in Ihrem package.json hinzufügen, der im Wesentlichen jest verwendet, aber Ihnen erlaubt, eine Konfigurationsdatei zu übergeben.

"scripts": { 
    ... 
    "test": "jest --config jest.conf.js", 
    ... 
    }, 

Dann in Ihrem jest.conf.js können Sie Variablen hinzufügen, in Ihren Tests verwendet werden. Die Attribute collectCoverage und coverageDirectory dienen zur Codeabdeckung.

{ 
    "globals":{ 
    "__DEV__": true, 
    "API_BASE_URL": "http://api", 
    "SOME_VAR": "whatever" 
    "unmockedModulePathPatterns": [ 
     "node_modules/react/", 
     "node_modules/enzyme/" 
    ] 
    }, 
    "collectCoverage": "true", 
    "coverageDirectory": "coverage" 
} 

Dann, wenn npm run test läuft, wird es die Tests ausführen jest verwenden, mit einer benutzerdefinierten Konfiguration.

Verwandte Themen