<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>
When trying to rehydrate markup in IE11 'Argument is not optional' error is thrown. It happens only if component has dangerouslySetInnerHTML prop.</p>
<p dir="auto"><strong>Example</strong><br>
<a href="https://jsfiddle.net/oy9awLtq/" rel="nofollow">https://jsfiddle.net/oy9awLtq/</a></p>
<p dir="auto"><strong>What is the expected behavior?</strong><br>
No error should be thrown</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>
React version: 16<br>
Browser: IE11</p>
<p dir="auto"><strong>Do you want to request a <em>feature</em> or report a <em>bug</em>?</strong></p>
<p dir="auto">bug</p>
<p dir="auto"><strong>What is the current behavior?</strong></p>
<p dir="auto">React interactivity lost, React crash?</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 via <a href="https://jsfiddle.net" rel="nofollow">https://jsfiddle.net</a> or similar (template: <a href="https://jsfiddle.net/ebsrpraL/" rel="nofollow">https://jsfiddle.net/ebsrpraL/</a>).</strong></p>
<p dir="auto">Run with react-dom.development.js in IE11, not sure exactly what the exact repo steps are the fix I've attempted for IE11 was to simply pass an empty string.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="var normalizeHTML = function (parent, html) {
    if (!testDocument) {
      testDocument = document.implementation.createHTMLDocument(&quot;&quot;); // fix for IE11 here
    }
    var testElement = parent.namespaceURI === HTML_NAMESPACE ? testDocument.createElement(parent.tagName) : testDocument.createElementNS(parent.namespaceURI, parent.tagName);
    testElement.innerHTML = html;
    return testElement.innerHTML;
  };
}"><pre class="notranslate"><code class="notranslate">var normalizeHTML = function (parent, html) {
    if (!testDocument) {
      testDocument = document.implementation.createHTMLDocument(""); // fix for IE11 here
    }
    var testElement = parent.namespaceURI === HTML_NAMESPACE ? testDocument.createElement(parent.tagName) : testDocument.createElementNS(parent.namespaceURI, parent.tagName);
    testElement.innerHTML = html;
    return testElement.innerHTML;
  };
}
</code></pre></div>
<p dir="auto">Source </p><div class="Box Box--condensed my-2">
  <div class="Box-header f6">
    <p class="mb-0 text-bold">
      <a href="https://github.com/facebook/react/blob/e932ad68bed656eed5295b61ba74e5d0857902ed/src/renderers/dom/fiber/ReactDOMFiberComponent.js#L133-L146">react/src/renderers/dom/fiber/ReactDOMFiberComponent.js</a>
    </p>
    <p class="mb-0 color-fg-muted">
        Lines 133 to 146
      in
      <a data-pjax="true" class="commit-tease-sha" href="/facebook/react/commit/e932ad68bed656eed5295b61ba74e5d0857902ed">e932ad6</a>
    </p>
  </div>
  <div itemprop="text" class="Box-body p-0 blob-wrapper blob-wrapper-embedded data">
    <table class="highlight tab-size mb-0 js-file-line-container" data-tab-size="8" data-paste-markdown-skip="">

        <tbody><tr class="border-0">
          <td id="L133" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="133"></td>
          <td id="LC133" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-k">var</span> <span class="pl-en">normalizeHTML</span> <span class="pl-c1">=</span> <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-s1">parent</span>: <span class="pl-v">Element</span><span class="pl-kos">,</span> <span class="pl-s1">html</span>: <span class="pl-s1">string</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L134" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="134"></td>
          <td id="LC134" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-c1">!</span><span class="pl-s1">testDocument</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L135" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="135"></td>
          <td id="LC135" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-s1">testDocument</span> <span class="pl-c1">=</span> <span class="pl-smi">document</span><span class="pl-kos">.</span><span class="pl-c1">implementation</span><span class="pl-kos">.</span><span class="pl-en">createHTMLDocument</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L136" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="136"></td>
          <td id="LC136" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-kos">}</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L137" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="137"></td>
          <td id="LC137" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-k">var</span> <span class="pl-s1">testElement</span> <span class="pl-c1">=</span> <span class="pl-s1">parent</span><span class="pl-kos">.</span><span class="pl-c1">namespaceURI</span> <span class="pl-c1">===</span> <span class="pl-c1">HTML_NAMESPACE</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L138" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="138"></td>
          <td id="LC138" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       ? <span class="pl-s1">testDocument</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s1">parent</span><span class="pl-kos">.</span><span class="pl-c1">tagName</span><span class="pl-kos">)</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L139" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="139"></td>
          <td id="LC139" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       : <span class="pl-s1">testDocument</span><span class="pl-kos">.</span><span class="pl-en">createElementNS</span><span class="pl-kos">(</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L140" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="140"></td>
          <td id="LC140" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">           <span class="pl-kos">(</span><span class="pl-s1">parent</span><span class="pl-kos">.</span><span class="pl-c1">namespaceURI</span>: <span class="pl-s1">any</span><span class="pl-kos">)</span><span class="pl-kos">,</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L141" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="141"></td>
          <td id="LC141" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">           <span class="pl-s1">parent</span><span class="pl-kos">.</span><span class="pl-c1">tagName</span><span class="pl-kos">,</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L142" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="142"></td>
          <td id="LC142" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">         <span class="pl-kos">)</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L143" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="143"></td>
          <td id="LC143" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-s1">testElement</span><span class="pl-kos">.</span><span class="pl-c1">innerHTML</span> <span class="pl-c1">=</span> <span class="pl-s1">html</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L144" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="144"></td>
          <td id="LC144" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-k">return</span> <span class="pl-s1">testElement</span><span class="pl-kos">.</span><span class="pl-c1">innerHTML</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L145" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="145"></td>
          <td id="LC145" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-kos">}</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L146" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="146"></td>
          <td id="LC146" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> <span class="pl-kos">}</span> </td>
        </tr>
    </tbody></table>
  </div>
</div>
<p></p>
<p dir="auto">MDN docs <a href="https://developer.mozilla.org/en-US/docs/Web/API/DOMImplementation/createHTMLDocument" rel="nofollow">here</a>.</p>
<p dir="auto"><strong>What is the expected behavior?</strong></p>
<p dir="auto">Well, that React does not crash in dev mode and that interactively continues to work.</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></p>
<p dir="auto"><code class="notranslate">react@16.0.0</code> IE11</p>