2016-01-08 10 views
9

Używam programu żart i Babel 6 i próbuję uruchomić test zawierający plik .jsx. Z jakiegoś powodu plik nie jest pobierany jako .jsx i wydaje się być traktowany jako czysty js, co prowadzi do błędu w wierszu, który ma komponent React.Uruchamianie testu przez żart, dostaję `nieoczekiwany token` w dołączonych plikach .jsx

To jest test:

var searchPath = '../../../../../app/assets/javascripts/components/navigation/search_icon.js.jsx'; 
jest.dontMock(searchPath); 

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import TestUtils from 'react-addons-test-utils' 

const SearchIcon = require(searchPath); 

describe('components',() => { 
    describe('SearchIcon',() => { 
    it('Should dispatch an action to toggle the search bar when clicked',() => { 

     var icon = TestUtils.renderIntoDocument(
     <SearchIcon labelOn="On" labelOff="Off"/> 
    ); 

     // Smoke test - I can't even get this far :(
     expect(true).to.eq(true) 

    }) 
    }) 
}); 

Moja package.json jest tutaj:

{ 
    "name": "fd-v5-web", 
    "version": "1.0.0", 
    "description": "Farmdrop mobile site", 
    "dependencies": { 
    "babel-preset-es2015": "^6.0", 
    "babel-preset-stage-0": "^6.0", 
    "babel-preset-react": "^6.0", 
    "babelify": "~>7.2", 
    "browserify": "~> 10.2.4", 
    "browserify-incremental": "^3.0.1", 
    "classnames": "~>2.1", 
    "immutable": "^3.7.5", 
    "lodash": "~3.9.3", 
    "moment": "~2.10.3", 
    "react": "^0.14.3", 
    "react-redux": "^4.0.0", 
    "react-dom": "^0.14.6", 
    "react-tools": "^0.13.1" 
    }, 
    "engines": { 
    "node": "4.0.0", 
    "npm": "2.1.x" 
    }, 
    "devDependencies": { 
    "babel-jest": "*", 
    "jest-cli": "*", 
    "react-addons-test-utils": "^0.14.3" 
    }, 
    "scripts": { 
    "test": "BABEL_JEST_STAGE=0 jest" 
    }, 
    "jest": { 
    "scriptPreprocessor": "<rootDir>/node_modules/babel-jest", 
    "unmockedModulePathPatterns": [ 
     "<rootDir>/node_modules/react", 
     "<rootDir>/node_modules/react-dom", 
     "<rootDir>/node_modules/react-addons-test-utils", 
     "<rootDir>/node_modules/fbjs" 
    ], 
    "testFileExtensions": [ 
     "js" 
    ], 
    "moduleFileExtensions": [ 
     "js", 
     "jsx", 
     "json", 
     "es6" 
    ] 
    } 
} 

I biegnę w linii poleceń z npm test

My .babelrc wygląda następująco :

{ 
    "presets": [ 
    "react", 
    "es2015" 
    ] 
} 
+14

'searchPath = '../../../../../ app' ouch;) –

+0

Tak, wiem: (To jest projekt Rails, więc jest dużo zagnieżdżania.) W jaki sposób to obejść? Nie jestem jeszcze zaznajomiony z testowaniem JS Rails ma funky mechanizm automatycznego ładowania, który automatycznie odnajdzie pliki, więc zwykle nie jest to wymagane w moich testach –

+0

@MattGibson Używałem tego. https : //github.com/classflow/import-alias reergymerej

Odpowiedz

20

Naprawiono. Miałem mój .babelrc w niewłaściwym folderze. Powinien znajdować się w katalogu głównym. Kiedy ją tam przeniosłem, wszystko działało.

{ 
    "presets": [ 
    "react", 
    "es2015" 
    ] 
} 
+7

użytkownicy mogą również dodać następujący fragment na package.json: '" babel ": {" presets ": [" react "," es2015 "]} ', dla tych, którzy lubią wszystko w pakiecie.json – AceMark

+0

ŁADNE DZIĘKUJĘ ... i więcej znaków –

0

Innym miejscem, gdzie można rzucić żartem Unexpected token jest @ podczas korzystania z @connect (spotyka się w większości tutoriali). Dołącz babel-plugin-transform-dekoratory-legacy do pliku package.json, uruchom npm install i upewnij się, że w twoim pliku .babelrc znajdują się linie "presets": ["es2015", "react", "stage-0"] i "plugins": ["transform-decorators-legacy"].

Powiązane problemy