title: Should I put UT test for React Component to the same file with that component?
body: <p>Because it's become a commonly used pattern to put markups, styling and javascript of 1 specific React component into 1 single file. Is it also a good pattern to put the unit tests (for example mocha <code>describe</code>s) to that same file?</p>
  
  <p>Note: Let's assume the bundle tool can strip unused <code>import</code>s and the codes inside <code>describe</code>s.</p>
  
  <p>Example:</p>
  
  <pre><code>import React from 'react';
  import { shallow } from 'enzyme';
  import { expect } from 'chai';
  
  const MyComponent = ({ active }) =&gt; (
    &lt;div style={{ color: active ? 'blue' : 'gray' }}&gt;
      {active ? 'this is active' : 'this is inactive'}  
    &lt;/div&gt;
  );
  
  export default MyComponent;
  
  // mocha tests (same file)
  
  describe('MyComponent', () =&gt; {
    context('active = true', () =&gt; {
      it('should include is active text', () =&gt; { ... });
      it('should have color blue', () =&gt; { ... });
    });
  
    context('active = false', () =&gt; { ... });
  });
  </code></pre>