title: Failing Jest unit testing
body: <p>I have a component in which I wrote test for. It worked great but now something is going wrong and I cannot figure out what.</p>
  
  <p>This is the simple component which takes two numbers and returns their sum:</p>
  
  <pre><code>import 'bootstrap/dist/css/bootstrap.css';
  import 'bootstrap/dist/css/bootstrap-theme.css';
  import React from 'react';
  import ReactDOM from 'react-dom';
  import { LogOutButton } from './LogOutButton.js';
  
  class Home extends React.Component {
  displayName = Home.name;
  
  state = {
    result: 0,
    val1: 0,
    val2: 0,
  };
  
  handleChangeOne = event =&gt; {
    this.setState({ val1: event.target.value });
  };
  
  handleChangeTwo = event =&gt; {
    this.setState({ val2: event.target.value });
  };
  
  add = () =&gt; {
    this.setState({ 
      result: parseInt(this.state.val1) + parseInt(this.state.val2)
    });
  };
  
  onLogoutClick = () =&gt; {
    window.location.href = 'https://www.MICROSOFT.com';
  }
  
  render() {
    return (
      &lt;div&gt;
        &lt;h1&gt;Hello world! The result is: {this.state.result}&lt;/h1&gt;
        &lt;input type="text" onChange={this.handleChangeOne} /&gt;
        +
        &lt;input type="text" onChange={this.handleChangeTwo} /&gt;
        = &lt;br /&gt;
        &lt;button onClick={this.add}&gt;Add&lt;/button&gt;
        &lt;br/&gt;&lt;br/&gt; 
        &lt;LogOutButton onLogout={this.onLogoutClick} /&gt; 
      &lt;/div&gt;
    );
  }
  }
  
    export default Home;
  </code></pre>
  
  <p>And this is the test which used to work great:</p>
  
  <pre><code>import React from 'react';
  import { shallow } from 'enzyme'
  import ReactDOM from 'react-dom';
  import App from './App';
  import { Home } from './components/Home';
  
  describe('Home /&gt;', () =&gt; {
    it('Renders a sum', () =&gt; {
        const home = shallow(&lt;Home /&gt;);
        var first_value = home.state().val1;
        var second_value = home.state().val2;
        var result = first_value + second_value;
        expect(result).toBe(0);
  
        const inputs = home.find('input');
        inputs.at(0).simulate('change', {target: {value: 5} } );
        inputs.at(1).simulate('change', { target: { value: 8 } });
        home.find('button').simulate('click');
        home.update();
        expect(home.state().result).toBe(13);
    });
  });
  </code></pre>
  
  <p>This is the error that I get:</p>
  
  <pre><code> FAIL  src/Home.test.js
    ● Test suite failed to run
  
  C:/Users/Itay/Documents/Experiments/WebApplication1/WebApplication1/ClientApp/src/components/Home.js: Unexpected token (8:12)
  
    Jest encountered an unexpected token
    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html
    Details:
       6 |
       7 | class Home extends React.Component {
    &gt;  8 | displayName = Home.name;
         |             ^
       9 |
      10 |     state = {
      11 |       result: 0,
  </code></pre>
  
  <p>What's going on here? I have tried several things but nothing helped so far.</p>