title: React view not successfully listening to store
body: <p>I have <a href="https://github.com/chadoh/life/pull/6/files#diff-8604f489b9796fbf13573d18b7b72eb4R18" rel="nofollow">a React controller-view</a> that subscribes to two different stores, and initiates calls that will cause each of them to emit:</p>
  
  <pre><code>componentWillMount() {
    UserStore.addChangeListener(this._onChange);
    EventStore.addChangeListener(this._onChange);
  }
  
  componentDidMount() {
    UserService.getUser(this.props.params.slug)
    EventService.fetchEventsForUser(this.props.params.slug);
  }
  </code></pre>
  
  <p>For the <code>UserStore</code> listener, this works fine. The user is fetched from the API, which comes back to <a href="https://github.com/chadoh/life/pull/6/files#diff-0922143789ebab05613ef9f3a0303c70R7" rel="nofollow">the <code>UserStore</code></a>, which emits a change. If I put <code>console.log</code> statements in, I can see all of this flow in exactly the way I'd expect, ending in the <code>_onChange</code> function of my controller-view.</p>
  
  <p><strong>But.</strong> For some inexplicable reason, the change listener added to <a href="https://github.com/chadoh/life/pull/6/files#diff-e3943b8df1283906a2c496e3f22aace5R5" rel="nofollow">the <code>EventStore</code></a> isn't firing. The events are correctly fetched from the API, and which come back to the <code>EventStore</code> method that I expect, which correctly updates <code>EventStore</code>'s internal state, and it even fires <code>emitChange()</code> just fine (I've verified with copious <code>console.log</code> statements). But <code>_onChange</code> in the controller-view is never called!</p>
  
  <p>I've been trying to troubleshoot this for close to double-digit hours now. I don't feel any closer to an answer than when I started. I don't even know where to look. </p>
  
  <hr>
  
  <h3>Other notes</h3>
  
  <ul>
  <li>I tried removing the <code>UserStore</code> listener from my controller-view, just setting static content in <code>UserStore</code>. I thought maybe there could be a race condition between the two updating. Nothing changed.</li>
  <li>I tried splitting my controller-view's <code>_onChange</code> into two separate functions, again with the suspicion that they weren't playing nicely together. But the <code>console.log</code>s showed that <code>_onUserChange</code> was called as expected, but <code>_onEventChange</code> was never called at all.</li>
  <li><strong>This used to work!</strong> In the master branch, which the pull request I've been linking to branches from, it works! Everything's structured a bit differently, there—the controller-view I've been linking to only listens to changes in <code>UserStore</code>, while its child component listens for changes in <code>EventStore</code>. If I duplicate this structure, though, it still doesn't work. In my new branch, whatever component is listening to changes in <code>EventStore</code> seems to be completely deaf to such changes.</li>
  <li>Also on <code>master</code>, <code>EventStore</code> did much more computation than it does now. I very much doubt that it being slow would make its listeners more likely to hear it, though. <code>UserStore</code> is equivalently simple, and its listeners have no problem hearing it.</li>
  <li><strong>Sometimes it <em>does</em> work.</strong> About 1 page load in 100, it works. The component updates its state, and the server-loaded content actually displays. I haven't been able to reproduce this or determine what causes it.</li>
  <li><a href="https://github.com/chadoh/life/pull/6/files#diff-0265e467b11d169edb0baaa297741de8R23" rel="nofollow">Another component in this app</a> also listens for <code>EventStore</code> changes, and also rarely hears them.</li>
  <li>You can see it failing to work at <a href="http://life.chadoh.com/#/chadoh" rel="nofollow">http://life.chadoh.com/#/chadoh</a>. If you then visit <a href="http://life.chadoh.com/#/chadoh/week/0" rel="nofollow">http://life.chadoh.com/#/chadoh/week/0</a>, you'll see that an event has correctly been loaded from the server. But for some reason the listeners were not alerted. If you refresh the page on <a href="http://life.chadoh.com/#/chadoh/week/0" rel="nofollow">http://life.chadoh.com/#/chadoh/week/0</a>, the sidebar will never be updated with events (the difference is whether it's initially rendered before or after <code>EventStore</code> has already been loaded with data).</li>
  <li>Changing the <code>get events()</code> method in <code>EventStore</code> to a regular <code>events()</code> has no effect.</li>
  <li>Putting the <code>EventService.fetchEvents</code> call inside a <code>setTimeout</code> does not yield better results.</li>
  <li>Putting the <code>listen</code> calls inside the constructor does not yield better results.</li>
  </ul>