<p dir="auto">Functional component which looks like this</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="function DateTime({ dateTime }) {
  return &lt;span&gt;{(dateTime || new Date()).toLocaleDateString(currentLocale)}&lt;/span&gt;;
}"><pre class="notranslate"><code class="notranslate">function DateTime({ dateTime }) {
  return &lt;span&gt;{(dateTime || new Date()).toLocaleDateString(currentLocale)}&lt;/span&gt;;
}
</code></pre></div>
<p dir="auto">being included to any conventional component causes this component's test failing with</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="TypeError: inst.render is not a function
        at ReactCompositeComponentMixin._renderValidatedComponentWithoutOwnerOrContext (node_modules/react/lib/ReactCompositeComponent.js:587:34)
        at ReactCompositeComponentMixin._renderValidatedComponent (node_modules/react/lib/ReactCompositeComponent.js:607:32)
        at ..."><pre class="notranslate"><code class="notranslate">TypeError: inst.render is not a function
        at ReactCompositeComponentMixin._renderValidatedComponentWithoutOwnerOrContext (node_modules/react/lib/ReactCompositeComponent.js:587:34)
        at ReactCompositeComponentMixin._renderValidatedComponent (node_modules/react/lib/ReactCompositeComponent.js:607:32)
        at ...
</code></pre></div>
<p dir="auto">React 0.14.3, JEST 0.8.0, npm 3.5.2, node 5.2</p>
<p dir="auto">Any suggestions on how to get rid of this?</p>
<p dir="auto">I originally left a comment in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="107717775" data-permission-text="Title is private" data-url="https://github.com/facebook/react/issues/4936" data-hovercard-type="issue" data-hovercard-url="/facebook/react/issues/4936/hovercard" href="https://github.com/facebook/react/issues/4936">#4936</a>, but I felt this might be better as a separate issue.</p>
<blockquote>
<p dir="auto">I completely agree with the rationale behind no backing instances and no refs for stateless components. I want to use pure stateless components as much as possible.</p>
<p dir="auto">However, I'm running into instances where testing stateless components gets tricky. For the most part, using the shallow renderer to render a stateless component has been fine. I can then make assertions on expected props and children. To reduce the duplication, I abstract out the shallow renderer process to a helper function.</p>
<p dir="auto">When, I want to test events, though, I have to take a different route. If my component takes an <code class="notranslate">onClick</code> prop, then I wrap it in a class component, so I can access the DOM node to simulate my click event. Again, this isn't a huge deal because I can abstract out the wrap/render process into a helper function.</p>
<p dir="auto">I bring all this up because I feel that it would be nice to have better facilities in <code class="notranslate">TestUtils</code> for stateless components. I don't think the answer is allowing <code class="notranslate">ReactDOM.findDOMNode</code> to work on stateless components because that opens up it to abuse in normal application code. Are you open to allowing extra functions in <code class="notranslate">TestUtils</code> to simplify the process of testing stateless components? Or am I creating a code smell in my testing?</p>
<p dir="auto">I'd be happy to create a PR for <code class="notranslate">TestUtils</code> if you think some more helper functions for stateless components would be beneficial.</p>
</blockquote>