Sposób użycia Jest z React Native

Question

The testing section dokumentów dla React Native sugerują, że Jest to oficjalny sposób przeprowadzania testów jednostkowych. Nie wyjaśniają jednak, jak je skonfigurować. Uruchamianie Bez żadnej konfiguracji daje błędy składniowe (bez numerów wierszy :(), ponieważ nie stosuje transformacji (np. Funkcje ES6, JSX i Flow), które reagują na kod natywny. Jest tam folder jestSupport w źródle React Native . spróbować zawiera env.js i scriptPrerocess.js, ten ostatni ma kod zastosować transformacje Więc skopiowaniu tych do mojego projektu i dodaje następującą sekcję do mojego package.json:

"jest": { 
    "scriptPreprocessor": "jestSupport/scriptPreprocess.js", 
    "setupEnvScriptFile": "jestSupport/env.js" 
    }, 

to rozwiązuje pierwszy błąd, ale Nadal pojawia się następujący błąd:

Using Jest CLI v0.4.0 
FAIL js/sync/__tests__/SynchronisedStorage-tests.js 
SyntaxError: /Users/tom/my-project/js/sync/__tests__/SynchronisedStorage-tests.js: /Users/tom/my-project/js/sync/SynchronisedStorage.js: /Users/tom/my-project/node_modules/react-native/Libraries/react-native/react-native.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/browser/ui/React.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/utils/ReactChildren.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/addons/ReactFragment.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/classic/element/ReactElement.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/core/ReactContext.js: /Users/tom/my-project/node_modules/react-native/node_modules/react-tools/src/vendor/core/warning.js: Unexpected token . 
1 test failed, 0 tests passed (1 total) 
Run time: 0.456s 

Czy jest więcej rzeczy do zrobienia, aby Czy rozumiesz React Native? Czy są jakieś przykłady konfiguracji Jest do przetestowania React Native?

EDIT:

Nie było sprawdzenie w scriptPreprocess że zatrzymał go z systemem nad każdego pliku w node_modules co oczywiście wliczone całość React Native. Usunięcie tego spowoduje usunięcie powyższego błędu. Jednak teraz otrzymuję więcej błędów ze źródła React Native, zdecydowanie wydaje się, że nie ma być uruchamiany wewnątrz Jest.

EDIT2:

Jawne ustawienie makiety dla modułu react-native działa:

jest.setMock('react-native', {}); 

To wydaje się jak to będzie bardzo ręczne i nie bardzo przydatne do testowania kodu, który współdziała z React Natywne API dużo. Zdecydowanie wciąż czuję, że czegoś brakuje!

Answer 1

Mam do pracy dla mojej aplikacji Native React i testuje bez problemu pliki z transformacjami ES6 i ES7.

Aby uzyskać żartem do pracy, a następnie kroki:

1. skopiowany folder jestSupport z React Native głównego repo do notatnika react-native w node_modules.

2. Zmieniano linię "żartem" W mojej packages.json do punktów do plików w folderze jestSupport

Linia "JEST" w moim packages.json wygląda teraz robiła to:

"jest": { 
    "scriptPreprocessor": "<rootDir>/node_modules/react-native/jestSupport/scriptPreprocess.js", 
    "setupEnvScriptFile": "<rootDir>/node_modules/react-native/jestSupport/env.js", 
    "testFileExtensions": [ 
    "js" 
    ], 
    "unmockedModulePathPatterns": [ 
    "source-map" 
    ] 
}, 

Answer 2

W przypadku nowszych wersji jest ustawienie go na react-native jest bardzo łatwe.

Install żart użyciu

npm install --save-dev jest-cli babel-jest 

W package.json, dodać to

"scripts": { 
    "start": "babel-node ./server/server.js", 
    "import-data": "babel-node ./scripts/import-data-from-parse.js", 
    "update-schema": "babel-node ./server/schema/updateSchema.js", 
    "test": "jest", 
    "lint": "eslint ." 
}, 
"jest": { 
    "haste": { 
    "defaultPlatform": "ios", 
    "platforms": [ 
     "ios", 
     "android" 
    ], 
    "providesModuleNodeModules": [ 
     "react-native" 
    ] 
    } 
}, 

Być może trzeba tylko dodać linie związane żart

teraz można używać

npm test 

do uruchomienia żartu.

Zapoznaj się z repozytorium gitubu f8app, aby dowiedzieć się więcej na ten temat.

Answer 3

Jako React Native v0.37.0, Jest jest częścią nowego szablonu aplikacji.

W nowej aplikacji można uruchomić testy razu:

$ react-native init MyAwesomeApp 
$ cd MyAwesomeApp 
$ npm test 
... 
Tests:  2 passed