Incremental update fails when the body contains top-level text nodes

[mbostock]

The preview server assumes that Markdown will always generate top-level elements (e.g., wrapping text in paragraph elements). Unfortunately, that’s not true in some cases like this:

<h2>hello</h2> world

In this case, world becomes a top-level next node. Which means that changing the contents won’t update during live preview:

<h2>hello</h2> other

There are two ways we could fix this. One way would be to require that all top-level children are elements by wrapping any top-level text in SPAN elements:

<h2>hello</h2><span> other </span>

The other way would be to diff document.body.childNodes instead of document.body.children, which would mean being able to diff text and comment nodes, not just elements. 🤔

[mbostock]

Another pathological example, we can’t tell the difference between these two:

<h2>one</h2>

<h2>two</h2>

<style type="text/css">

h2 {
  display: inline;
}

</style>

<h2>one</h2><h2>two</h2>

<style type="text/css">

h2 {
  display: inline;
}

</style>