ReactJs: Unexpected token Error

Question

I am running this tests using Mocha with following configuration in my npm package.json

 "scripts": {"test": "mocha './app/**/*.spec.js' --compilers js:babel-core/register"}

and this results in the following error

employeeGrid.row.spec.jsx: Unexpected token (8:12)

Notice that line 8:12 is the following: return (<tr>

import React from 'react';
import TestUtils from 'react-addons-test-utils';
import expect from 'expect-jsx';
//import GridRow from './employeeGrid.row.jsx'

class GridRow extends React.Component {
  render() {
    return (<tr>
      <td>{this.props.employee.name}</td>
      <td>{this.props.employee.position}</td>
      <td>{this.props.employee.yearStarted}</td>
    </tr>)
  }
}
describe('Grid Row', () => {
  it('Row Actions Test', ()=> {
    let employee = {
      "name": "Person",
      "position": "Software Engineer",
      "yearStarted": 2010
    };

    // shallow render
    // renders only one level deep
    const renderer = TestUtils.createRenderer();
    renderer.render(<GridRow employee={employee}/>);
    const output = renderer.getRenderOutput();
    console.log(output);
  });
});

Any idea what I am doing wrong?

I assume you're using babel? what does your .babelrc file look like? — rossipedia
– rossipedia, Commented Feb 3, 2016 at 23:34
github.com/eugenekgn/reactjs-tests/blob/master/.babelrc it's right here, but all the other es6(2015) work — eugenekgn
– eugenekgn, Commented Feb 4, 2016 at 0:24

rossipedia · Accepted Answer · 2016-02-04 06:03:54Z

1

With babel 6.0, JSX is no longer processed by default, nor is it processed with the es2015 preset. You need to use the react preset specifically to get the appropriate JSX transforms:

$ npm install babel-preset-react

and in your .babelrc:

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

answered Feb 4, 2016 at 6:03

rossipedia

59.8k10 gold badges95 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

ReactJs: Unexpected token Error

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related