Why are Jets tests not working for React.js?

Question

JavaScript

Hello.
I try to fasten tests according to docks
In this case everything works.
main.jsx

function sum(value1, value2) { return value1 + value2; }
module.exports = sum;

main.test.js

jest.dontMock('../js/assets/components/main.jsx');

describe('sum', function() {
    it('adds 1 + 2 to equal 3', function() {
        var sum = require('../js/assets/components/main.jsx');

        expect(sum(1, 2)).toBe(3); });
    }
);

But when I try to attach Jets tests to React, I get an error.
main.jsx

import React from 'react';

class Main extends React.Component {
    constructor(props) {
        super(props);
        
        this.state = {
            isChecked: false
        };
        
        this.onChange = this.onChange.bind(this);
    }
    
    onChange() {
        this.setState({
            isChecked: !this.state.isChecked
        });
    }
    
    render() {
        return (
            <label>
                <input type="checkbox" checked={this.state.isChecked} onChange={this.onChange} />
                {this.state.isChecked ? this.props.labelOn : this.props.labelOff}
            </label>
        );
    }
}
export default Main;

main.test.js

jest.dontMock('../js/assets/components/main.jsx');

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

const CheckboxWithLabel = require('../js/assets/components/main.jsx');

describe('CheckboxWithLabel', () => {
    it('changes the text after click', () => {
        var checkbox = TestUtils.renderIntoDocument(<CheckboxWithLabel labelOn="On" labelOff="Off" /> );
        var checkboxNode = ReactDOM.findDOMNode(checkbox);
        
        expect(checkboxNode.textContent).toEqual('Off');
        
        TestUtils.Simulate.change( TestUtils.findRenderedDOMComponentWithTag(checkbox, 'input') );
        expect(checkboxNode.textContent).toEqual('On'); 
    }); 
});

package.json

{
  "name": "",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "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" ]
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "babel-core": "^5.8.25",
    "babel-loader": "^5.3.2",
    "bluebird": "^2.10.2",
    "handlebars": "^4.0.4",
    "handlebars-loader": "^1.1.4",
    "highlight.js": "^8.9.1",
    "react": "^0.14.0",
    "react-dom": "^0.14.0",
    "react-router": "^1.0.0-rc1",
    "reflux": "^0.3.0",
    "webpack": "^1.12.2",
    "whatwg-fetch": "^0.10.0"
  },
  "devDependencies": {
    "babel-jest": "*",
    "jest-cli": "*",
    "react-addons-test-utils": "~0.14.0",
    "css-loader": "^0.19.0",
    "file-loader": "^0.8.4",
    "jsx-loader": "^0.13.2",
    "style-loader": "^0.12.4",
    "stylus-loader": "^1.4.0",
    "url-loader": "^0.5.6"
  }
}

Writes a SyntaxError to the console, but nothing else specific.
What is wrong, please tell me.

Answer 1

They say there is a problem with Babel 6, that they say you need to use the previous version of babel-jest in package.json - for example ^5.3.0