<p dir="auto">I've a component whose <code class="notranslate">render</code> method looks like</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="render() {
    const {condition} = this.state;

    if (!condition) {
      return null;
    }

    return &lt;div onClick={() =&gt; { doSomething(); }} &gt;
      ...
    &lt;/div&gt;
  }"><pre class="notranslate"><span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-k">const</span> <span class="pl-kos">{</span>condition<span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">state</span><span class="pl-kos">;</span>

    <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-c1">!</span><span class="pl-s1">condition</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
      <span class="pl-k">return</span> <span class="pl-c1">null</span><span class="pl-kos">;</span>
    <span class="pl-kos">}</span>

    <span class="pl-k">return</span> <span class="pl-c1">&lt;</span><span class="pl-ent">div</span> <span class="pl-c1">onClick</span><span class="pl-c1">=</span><span class="pl-kos">{</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span> <span class="pl-en">doSomething</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span><span class="pl-kos">}</span> <span class="pl-c1">&gt;</span>
      ...
    <span class="pl-c1">&lt;</span><span class="pl-c1">/</span><span class="pl-ent">div</span><span class="pl-c1">&gt;</span>
  <span class="pl-kos">}</span></pre></div>
<p dir="auto">When the state changes and <code class="notranslate">condition</code> changes from <code class="notranslate">true</code> to <code class="notranslate">false</code>, this triggers the error</p>
<p dir="auto"><code class="notranslate">EventListener.js:37 Uncaught TypeError: Cannot read property 'addEventListener' of null</code><br>
Here is the trace if that helps:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="
EventListener.listen    @   EventListener.js:37
SimpleEventPlugin.didPutListener    @   SimpleEventPlugin.js:612
EventPluginHub.putListener  @   EventPluginHub.js:113
putListener @   ReactDOMComponent.js:175
_assign.notifyAll   @   CallbackQueue.js:66
ON_DOM_READY_QUEUEING.close @   ReactReconcileTransaction.js:79
Mixin.closeAll  @   Transaction.js:202
Mixin.perform   @   Transaction.js:149
Mixin.perform   @   Transaction.js:136
_assign.perform @   ReactUpdates.js:89
flushBatchedUpdates @   ReactUpdates.js:165
ReactUpdates_flushBatchedUpdates    @   ReactPerf.js:66
Mixin.closeAll  @   Transaction.js:202
Mixin.perform   @   Transaction.js:149
ReactDefaultBatchingStrategy.batchedUpdates @   ReactDefaultBatchingStrategy.js:63
batchedUpdates  @   ReactUpdates.js:97
ReactEventListener.dispatchEvent    @   ReactEventListener.js:150"><pre class="notranslate"><code class="notranslate">
EventListener.listen    @   EventListener.js:37
SimpleEventPlugin.didPutListener    @   SimpleEventPlugin.js:612
EventPluginHub.putListener  @   EventPluginHub.js:113
putListener @   ReactDOMComponent.js:175
_assign.notifyAll   @   CallbackQueue.js:66
ON_DOM_READY_QUEUEING.close @   ReactReconcileTransaction.js:79
Mixin.closeAll  @   Transaction.js:202
Mixin.perform   @   Transaction.js:149
Mixin.perform   @   Transaction.js:136
_assign.perform @   ReactUpdates.js:89
flushBatchedUpdates @   ReactUpdates.js:165
ReactUpdates_flushBatchedUpdates    @   ReactPerf.js:66
Mixin.closeAll  @   Transaction.js:202
Mixin.perform   @   Transaction.js:149
ReactDefaultBatchingStrategy.batchedUpdates @   ReactDefaultBatchingStrategy.js:63
batchedUpdates  @   ReactUpdates.js:97
ReactEventListener.dispatchEvent    @   ReactEventListener.js:150
</code></pre></div>
<p dir="auto">Returning an empty div instead of null fixes the issue:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="render() {
    const {condition} = this.state;

    if (!condition) {
      return &lt;div&gt;&lt;/div&gt;;
    }

    return &lt;div onClick={() =&gt; { doSomething(); }} &gt;
      ...
    &lt;/div&gt;
  }"><pre class="notranslate"><span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-k">const</span> <span class="pl-kos">{</span>condition<span class="pl-kos">}</span> <span class="pl-c1">=</span> <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">state</span><span class="pl-kos">;</span>

    <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-c1">!</span><span class="pl-s1">condition</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
      <span class="pl-k">return</span> <span class="pl-c1">&lt;</span><span class="pl-ent">div</span><span class="pl-c1">&gt;</span><span class="pl-c1">&lt;</span><span class="pl-c1">/</span><span class="pl-ent">div</span><span class="pl-c1">&gt;</span><span class="pl-kos">;</span>
    <span class="pl-kos">}</span>

    <span class="pl-k">return</span> <span class="pl-c1">&lt;</span><span class="pl-ent">div</span> <span class="pl-c1">onClick</span><span class="pl-c1">=</span><span class="pl-kos">{</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span> <span class="pl-en">doSomething</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-kos">}</span><span class="pl-kos">}</span> <span class="pl-c1">&gt;</span>
      ...
    <span class="pl-c1">&lt;</span><span class="pl-c1">/</span><span class="pl-ent">div</span><span class="pl-c1">&gt;</span>
  <span class="pl-kos">}</span></pre></div>
<p dir="auto">Hello,</p>
<p dir="auto">After updating to React 15.0.1, we are getting the following error:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Uncaught TypeError: Cannot read property 'addEventListener' of null"><pre class="notranslate"><code class="notranslate">Uncaught TypeError: Cannot read property 'addEventListener' of null
</code></pre></div>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/4996164/14602577/5bb4e9f2-0571-11e6-9aa1-98de49f50d76.png"><img src="https://cloud.githubusercontent.com/assets/4996164/14602577/5bb4e9f2-0571-11e6-9aa1-98de49f50d76.png" alt="image" style="max-width: 100%;"></a></p>