title: Progress Bar with react.js
body: <p>I'm trying to implement a progress bar, but react doesn't seem to like the idea. I get </p>
  
  <blockquote>
    <p>Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op.</p>
  </blockquote>
  
  <p>as an error, though the element is mounted at the time the function is called. Here's the code:</p>
  
  <p>SocketAction.js</p>
  
  <pre><code>var x = new MainApplication;
  window.socket.on('label-downloads:Shipping\\Events\\ShippingProgress',function(event){
      x.showProgress(event);
  });
  </code></pre>
  
  <p>MainApplication.js</p>
  
  <pre><code>showProgress(e){
      console.log(window.performance.now());
      this.setState({
          progressBar:{
              height:'4px',
              background: 'green',
              position:'absolute',
              left:250,
              top: 70,
              width: e + '%'
          }
      })
  },
  </code></pre>
  
  <p>ProgressBar is in MainApplication.js:</p>
  
  <pre><code>&lt;div style={this.state.progressBar}&gt;&lt;/div&gt;
  </code></pre>
  
  <p>The element's set initial state is this</p>
  
  <pre><code>        progressBar:{
              height:'4px',
              background: 'green',
              width:1,
              position:'absolute',
              left:250,
              top: 70
          }
  </code></pre>
  
  <p>I don't get why it shouldn't be mounted... </p>
  
  <p>EDIT:</p>
  
  <p>This is the file that I pass to browserfy:</p>
  
  <pre><code>import MainApplication from './project/MainApplication';
  import MainSocketActions from './project/MainSocketActions';
  React.render(&lt;MainApplication /&gt;, document.getElementById('content'));
  </code></pre>
  
  <p>Complete MainSocketAction.js:</p>
  
  <pre><code>import MainApplication from './MainApplication';
  var x = new MainApplication;
  
      window.socket = io('http://localhost:3000');
      window.socket.on('connect', function () {
      });
      window.socket.on('label-downloads:Shipping\\Events\\ShippingProgress',function(event){
          x.showProgress(event);
      });
  </code></pre>