Jest: Unexpected token ...

[sibelius]

Versions:

babel-jest: ^14.1.0
babel-preset-react-native: ^1.9.0
jest: ^14.1.0
jest-react-native: ^14.1.3

Jest config

"jest": {
    "preset": "jest-react-native",
    "preprocessorIgnorePatterns": [
      "node_modules/(?!react-native|tcomb-form-native|react-native-localization|@exponent/react-native-action-sheet|rnrf-relay-renderer)"
    ],
    "verbose": true,
    "moduleFileExtensions": [
      "js",
      "json",
      "es6",
      "ios.js"
    ]
  },

Snapshot test

import 'react-native';
import React from 'react';
import AppLaunch from '../index';

jest.unmock('Image');

import renderer from 'react-test-renderer';

describe('AppLaunch', () => {
  it('render correctly', () => {
    const tree = renderer.create(
      <AppLaunch />
    ).toJSON();
    expect(tree).toMatchSnapshot();
  });
});

Component

import React, { Component } from "react";
import { Router, Scene, Actions } from 'react-native-router-flux';

import Launch from './launch';
import Login from './login';
import Register from './register';
import ResetPassword from './resetPassword';

const scenes = Actions.create(
  <Scene key="boot" hideNavBar={true}>
    <Scene key="launch" component={Launch} initial={true} />
    <Scene key="register" component={Register} />
    <Scene key="login" component={Login} />
    <Scene key="resetPassword" component={ResetPassword} />
  </Scene>
);

export default class AppLaunch extends Component {
  render() {
      return (
        <Router scenes={scenes} />
      );
    }
}

Runtime Error

Runtime Error
  - SyntaxError: Unexpected token ...
        at transformAndBuildScript (node_modules/jest-runtime/build/transform.js:306:10)
        at Object.<anonymous> (node_modules/react-native/Libraries/CustomComponents/ListView/ListView.js:44:28)
        at Object.ListView (node_modules/react-native/Libraries/react-native/react-native.js:39:23)

I unmock Image to make RNRF work with jest, because it is Image.propTypes

[aaronabramov]

hey @sibelius !
this is most likely happening because you use a spread operator somewhere in your code and you node doesn't support it.
If that's the case, the easiest fix would be to add this plugin to your babel transform.

ideally we should guard against those errors and at least provide a SyntaxError with explanations

[sibelius]

when I use node 6, it solves the spread operator, however I've got another error:

Runtime Error
  - app/node_modules/react-clone-referenced-element/cloneReferencedElement.js:18
          );
          ^
    SyntaxError: Unexpected token )
        at transformAndBuildScript (node_modules/jest-runtime/build/transform.js:306:10)
        at Object.<anonymous> (node_modules/react-native/Libraries/CustomComponents/ListView/ListView.js:44:28)
        at Object.ListView (node_modules/react-native/Libraries/react-native/react-native.js:39:23)

[cpojer]

It seems like you need to add react-clone-referenced-element to the list of patterns that need to be preprocessed.

[sibelius]

this resolves this issue, thanks

[anil1712]

@sibelius can you please tell the exacts steps to resolve this issue. I am still getting the same issue.
Please help me to out of it.

[sibelius]

this could help you

"jest": {
    "preset": "jest-react-native",
    "transformIgnorePatterns": [
      "node_modules/(?!react-native|tcomb-form-native|react-native-localization|@exponent/react-native-action-sheet|@exponent/ex-navigation|@exponent/react-native-touchable-native-feedback-safe|rnrf-relay-renderer|react-clone-referenced-element|react-native-looped-carousel|rn-splash-screen)"
    ],
    "setupFiles": [
      "./test/env.js"
    ],
    "verbose": true,
    "moduleFileExtensions": [
      "js",
      "json",
      "es6",
      "ios.js"
    ]
  },

[anil1712]

@sibelius Its not working for me, can you share your package.json and env.js also?

[sibelius]

just remove ./test/env.js

[granmoe]

Another option (for anyone like me who stumbles upon this at some point in the future) is to use the babel-preset-env with the following config:

{
  "presets": [
    ["env", {
      "targets": {
        "node": "current"
      }
    }]
  ]
}