title: mobx computed function not re-running when observable value is updated in test
body: <p>I am attempting to write a unit test for mobx-based reaction. For some reason, when the <code>@observable</code> value is updated in an <code>@action</code>, the <code>@computed</code> function does not re-run as you'd expect. </p>
  
  <p>Code:</p>
  
  <p><strong>STORE</strong></p>
  
  <pre><code>class NameStore {
      @observable name;
  
      @action setName(name) {
          this.name = name;
      }
  }
  </code></pre>
  
  <p><strong>COMPONENT 1</strong></p>
  
  <pre><code>@observer
  class Name {
      @computed get name() {
          if (this.props.nameStore.name) {
              return `${this.props.nameStore.name} is awesome!`;
          }
  
          return null;
      }
  
      render() {
          return (
              &lt;div className="name"&gt;
                  {this.name}
              &lt;/div&gt;
          );
      }
  }
  </code></pre>
  
  <p><strong>COMPONENT 2</strong></p>
  
  <pre><code>@observer
  class Name {
      setName() {
          this.props.nameStore.setName(this.name);
      }
  
      render() {
          return (
              &lt;form onSubmit={this.setName.bind(this)}&gt;
                  &lt;input type="text" ref={input =&gt; this.name = input} /&gt;
              &lt;/form&gt;
          );
      }
  }
  </code></pre>
  
  <p><strong>TEST</strong></p>
  
  <pre><code>define('Name component', () =&gt; {
      let markup;
  
      beforeEach(() =&gt; {
          const nameStore = new NameStore();
          markup = mount(
              &lt;div&gt;
                  &lt;Component1 nameStore={nameStore} /&gt;
                  &lt;Component2 nameStore={nameStore} /&gt;
              &lt;/div&gt;
          );
      });
  
      it('should re-render name when updated', (done) =&gt; {
          expect(markup.find('.name').text()).to.be.blank;
  
          markup.find('form input').first().value = "john";
          markup.find('form').simulate('submit');
  
          expect(markup.find('.name').text()).to.equal("john is awesome")
      });
  });
  </code></pre>
  
  <p>For some reason, in the test, the actual value of <code>{this.name}</code> in <code>Component1</code> remains unchanged even though I'm able to verify that the <code>setName</code> function in the store is being called properly and with the correct value. </p>
  
  <p>Any help as to why <code>Component1</code> is not re-rendering would be much appreciated. </p>
  
  <p>Also, this is a contrived example as the actual example is proprietary..so forgive me if this example feels dumb :)</p>
  
  <p>Thanks!</p>