Retain original hierarchy option

[TheJaredWilcurt]

When working with markup generated via components, or component testing, sometimes you receive stubbed markup that represents HTML5 compliant code, but is abstracted. For example:

parseFragment Input	Output
<tbody> <tr> <td> Text </td> </tr> <component-that-gets-rendered-as-tr /> </tbody>	<tbody> <tr> <td> Text </td> </tr> </tbody> <component-that-gets-rendered-as-tr> </component-that-gets-rendered-as-tr>
<table> <tbody> <tr> <td> Text </td> </tr> <component-that-gets-rendered-as-tr /> </tbody> </table>	<component-that-gets-rendered-as-tr> </component-that-gets-rendered-as-tr> <table> <tbody> <tr> <td> Text </td> </tr> </tbody> </table>

Parse5 sees that there is a non <tr> as a direct descendant of a <tbody>, and as a result, it tries to correct the situation by relocating the child to a different place in the DOM.

Would it be possible to retain the nested DOM hierarchy of the original input in the produced AST, given a specific boolean option being set? Something like this:

import { parseFragment } from 'parse5';

const markup = `
<tbody>
  <tr>
    <td>
      Text
    </td>
  </tr>
  <component-that-gets-rendered-as-tr />
</tbody>
`.trim();

const astOptions = {
  sourceCodeLocationInfo: true,
  retainOriginalHierarchy: true
};

const ast = parseFragment(markup, astOptions);

[fb55]

You can switch to the htmlparser2 backend, as that has simpler semantics.