Fix exponential DOM issue in unwrap

This fixes an issue in the current implementation where if `sanitize` is
called on an HTML with deep nested unallowed elements it creates an
exponential number of new elements and can eventually exhaust the
available memory.

For example, if you have this HTML:

    <x><y><z>blabla</z></y></x>

The code first hits `<x>` and inserts its `.innerHTML` after it:

    <x><y><z>blabla</z></y></x>
    <y><z>blabla</z></y>

Then it hits the inner `<y>`, and same thing:

    <x><y><z>blabla</z></y>
      <z>blabla</z></x>
    <y><z>blabla</z></y>

Then the inner `<z>`:

    <x><y><z>blabla</z>
          blabla</y>
      <z>blabla</z></x>
    <y><z>blabla</z></y>

Then the first `<z>`’s copy, etc.
At the end, there are 7 nodes in the document (2^3-1).
If you raise the depth from 3 to 20, you get 2^20-1=1M nodes.

Note that there is also a performance issue as `.innerHTML` serializes
the whole DOM and then `insertAdjacentHTML` unserializes it.

This commit fixes both the exponential issue and the
serialization/unserialization.

Author: bfontaine

src/index.ts

@@ -254,23 +254,25 @@ function sanitizeHtml(
         element.setAttribute('target', '_blank');
       }
     } else {
-      element.insertAdjacentHTML('afterend', element.innerHTML);
+      // Disallowed tag: mark, and unwrap only after traversal
       toRemove.push(element);
     }
   }
 
-  for (const element of toRemove) {
-    try {
-      try {
-        element.parentNode?.removeChild(element);
-      } catch {
-        element.outerHTML = '';
-      }
-    } catch {
-      try {
-        element.remove();
-      } catch {}
+  // Unwrap disallowed elements by moving their child nodes before them
+  // and then dropping the now-empty element.
+  // Iterate in reverse to start from the innermost elements
+  // and limit the size of the trees we move.
+  for (let i = toRemove.length - 1; i >= 0; i--) {
+    const element = toRemove[i];
+    const parent = element.parentNode;
+    if (!parent) continue; // already removed
+    // copy each of its children above it
+    while (element.firstChild) {
+      parent.insertBefore(element.firstChild, element);
     }
+    // then remove it
+    parent.removeChild(element);
   }
 
   const styleList = doc.querySelectorAll('style');