Duplicate h1

[mbostock]

Starting with this trivial Markdown file:

hello world

If I edit the file to make “hello world” an h1:

# hello world

I end up getting two h1 elements:

Cc @wiltsecarpenter.

[mbostock]

I can also reproduce this bug starting with a single h1:

# hello world

And then editing the h1:

# hello world2

[mbostock]

Following the debugger, the problem is that when the page is completely empty (after removing the previous h1), we do the first insert here:

var template = document.createElement("template");
template.innerHTML = item.html;
root.appendChild(template.content.firstChild);

And then we immediately insert the duplicate copy here:

root.children[newPos++].insertAdjacentHTML("beforebegin", item.html);

I imagine we could just have an else like so:

if (root.children.length === 0) {
  var template = document.createElement("template");
  template.innerHTML = item.html;
  root.appendChild(template.content.firstChild);
} else if (newPos >= root.children.length) {
  root.children[root.children.length - 1].insertAdjacentHTML("afterend", item.html);
  newPos++;
} else {
  root.children[newPos++].insertAdjacentHTML("beforebegin", item.html);
}

Or maybe more simply

if (root.children.length === 0) {
  root.innerHTML = item.html;
} else if (newPos >= root.children.length) {
  root.children[root.children.length - 1].insertAdjacentHTML("afterend", item.html);
  newPos++;
} else {
  root.children[newPos++].insertAdjacentHTML("beforebegin", item.html);
}

I should probably understand a bit more our approach here. 😅