title: React.js - Simulating a click with Enzyme
body: <p>I have this React.js app that is a simple Cart app. <a href="https://codesandbox.io/s/znvk4p70xl" rel="noreferrer">https://codesandbox.io/s/znvk4p70xl</a></p>
  
  <p>The problem is I am trying to unit test the state of the application using Jest and Enzyme but it does not seem to work. Here is my <code>Todo.test.js</code> unit test:</p>
  
  <pre><code>import React from 'react';
  import { shallow, mount, render } from 'enzyme';
  import Todo from '../components/Todo';
  
  import { configure } from 'enzyme';
  import Adapter from 'enzyme-adapter-react-16';
  
  configure({ adapter: new Adapter() });
  
  test('Test it', async () =&gt; {
    // Render a checkbox with label in the document
    const cart = [
      { name: 'Green', cost: 4 },
      { name: 'Red', cost: 8 },
      { name: 'Blue', cost: 14 }
    ];
  
    const wrapper = mount(&lt;Todo cart={cart} /&gt;);
    const firstInput = wrapper.find('.name');
    firstInput.simulate('change', { target: { value: 'Pink' } });
  
    const firstCost = wrapper.find('.cost');
    firstCost.simulate('change', { target: { value: 200 } });
  
    const submitButton = wrapper.find('.addtocart');
    submitButton.simulate('click');
  
    wrapper.update();
  
    expect(wrapper.state('price')).toBe(26);
  
    console.log(wrapper.state());
    console.log(wrapper.props().cart);
  
  });
  </code></pre>
  
  <p>When I run the test, the cart still says the same thing when the item <code>Pink</code> should have been added.</p>
  
  <p>How can this be when I have simulated a button click on the <code>addToCart</code> method?</p>
  
  <pre><code> PASS  src/__tests__/todo.test.js
    ● Console
      console.log src/__tests__/todo.test.js:32      { price: 26 }    
  console.log src/__tests__/todo.test.js:33      [ { name: 'Green', cost: 4 },        { name: 'Red', cost: 8 },        { name: 'Blue', cost: 14 } ]
  </code></pre>