<p dir="auto">When rendering:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="render: function() {
    &lt;span contentEditable={this.state.isEditing}&gt;{this.state.value}&lt;/span&gt;
}"><pre class="notranslate"><code class="notranslate">render: function() {
    &lt;span contentEditable={this.state.isEditing}&gt;{this.state.value}&lt;/span&gt;
}
</code></pre></div>
<p dir="auto">Output:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;span contenteditable=&quot;true&quot; data-reactid=&quot;.1msoq843u9s.1.$49.1.0&quot;&gt;Hello World&lt;/span&gt;"><pre class="notranslate"><code class="notranslate">&lt;span contenteditable="true" data-reactid=".1msoq843u9s.1.$49.1.0"&gt;Hello World&lt;/span&gt;
</code></pre></div>
<p dir="auto">There is only a text node as a child of this span, no react components and yet I still receive the</p>
<p dir="auto">"A component is <code class="notranslate">contentEditable</code> and contains <code class="notranslate">children</code> managed by React. It is now your responsibility to guarantee that none of those nodes are unexpectedly modified or duplicated. This is probably not intentional."</p>
<p dir="auto">Is this expected?</p>
<p dir="auto"><strong>Do you want to request a <em>feature</em> or report a <em>bug</em>?</strong><br>
Bug</p>
<p dir="auto"><strong>What is the current behavior?</strong><br>
Getting this error message: <strong>Should have a queue. This is likely a bug in React. Please file an issue.</strong></p>
<p dir="auto"><strong>If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React.</strong></p>
<p dir="auto">I tried to implement a simple data cache in a custom hook:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import { useState, useEffect } from 'react'

const get = url =&gt; {
  return fetch(url)
    .then(res =&gt; res.text())
    .then(data =&gt; JSON.parse(data))
}

const cache = new Map()

const useData = dataURL =&gt; {
  const [data, setData] = useState(null)
  if (cache.has(dataURL)) {
    return cache.get(dataURL)
  }

  useEffect(() =&gt; {
    get(dataURL).then(data =&gt; {
      cache.set(dataURL, data)
      setData(data)
    })
  }, [dataURL])

  return data
}

export default useData"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span> <span class="pl-s1">useState</span><span class="pl-kos">,</span> <span class="pl-s1">useEffect</span> <span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">'react'</span>

<span class="pl-k">const</span> <span class="pl-en">get</span> <span class="pl-c1">=</span> <span class="pl-s1">url</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-k">return</span> <span class="pl-en">fetch</span><span class="pl-kos">(</span><span class="pl-s1">url</span><span class="pl-kos">)</span>
    <span class="pl-kos">.</span><span class="pl-en">then</span><span class="pl-kos">(</span><span class="pl-s1">res</span> <span class="pl-c1">=&gt;</span> <span class="pl-s1">res</span><span class="pl-kos">.</span><span class="pl-en">text</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span>
    <span class="pl-kos">.</span><span class="pl-en">then</span><span class="pl-kos">(</span><span class="pl-s1">data</span> <span class="pl-c1">=&gt;</span> <span class="pl-c1">JSON</span><span class="pl-kos">.</span><span class="pl-en">parse</span><span class="pl-kos">(</span><span class="pl-s1">data</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-s1">cache</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> <span class="pl-v">Map</span><span class="pl-kos">(</span><span class="pl-kos">)</span>

<span class="pl-k">const</span> <span class="pl-en">useData</span> <span class="pl-c1">=</span> <span class="pl-s1">dataURL</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
  <span class="pl-k">const</span> <span class="pl-kos">[</span><span class="pl-s1">data</span><span class="pl-kos">,</span> <span class="pl-s1">setData</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-en">useState</span><span class="pl-kos">(</span><span class="pl-c1">null</span><span class="pl-kos">)</span>
  <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">cache</span><span class="pl-kos">.</span><span class="pl-en">has</span><span class="pl-kos">(</span><span class="pl-s1">dataURL</span><span class="pl-kos">)</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-k">return</span> <span class="pl-s1">cache</span><span class="pl-kos">.</span><span class="pl-en">get</span><span class="pl-kos">(</span><span class="pl-s1">dataURL</span><span class="pl-kos">)</span>
  <span class="pl-kos">}</span>

  <span class="pl-en">useEffect</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">get</span><span class="pl-kos">(</span><span class="pl-s1">dataURL</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">then</span><span class="pl-kos">(</span><span class="pl-s1">data</span> <span class="pl-c1">=&gt;</span> <span class="pl-kos">{</span>
      <span class="pl-s1">cache</span><span class="pl-kos">.</span><span class="pl-en">set</span><span class="pl-kos">(</span><span class="pl-s1">dataURL</span><span class="pl-kos">,</span> <span class="pl-s1">data</span><span class="pl-kos">)</span>
      <span class="pl-s1">setData</span><span class="pl-kos">(</span><span class="pl-s1">data</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-kos">[</span><span class="pl-s1">dataURL</span><span class="pl-kos">]</span><span class="pl-kos">)</span>

  <span class="pl-k">return</span> <span class="pl-s1">data</span>
<span class="pl-kos">}</span>

<span class="pl-k">export</span> <span class="pl-k">default</span> <span class="pl-en">useData</span></pre></div>
<p dir="auto">The entire project code is here: <a href="https://github.com/justin0022/dashboard/tree/cache">https://github.com/justin0022/dashboard/tree/cache</a></p>
<p dir="auto"><strong>Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?</strong><br>
Using React 16.8.2, Chrome, and MacOS.</p>