Incorrect results when combining sequences of typeString (wrapped in HTML tag) and deleteChars

[sn3p]

I'm trying to add multiple strings, each wrapped in a HTML tag, and delete them again. I'm not sure if I'm overlooking something or if this is a bug.

This codepen illustrates the problem: https://codepen.io/snap/pen/YzbVeJL?editors=1010

Problem

When doing .typeString("<i>World</i>") followed by .deleteChars("World".length), an empty <i> element remains in the DOM. Not really a problem in most cases.

But when repeating the above sequence twice or more, the element and string is not completely cleared. This is only happening when wrapping the string in a HTML tag:

new Typewriter("#typewriter")
  .typeString("Hello")
  .typeString("<i> World</i>")
  .deleteChars("World".length)
  .typeString("<i> World</i>")
  .deleteChars(" World".length)
  .deleteChars("Hello".length)
  .start()

When strings are not wrapped in a HTML tag it works just fine:

new Typewriter("#typewriter")
  .typeString("Hello")
  .typeString(" World")
  .deleteChars(" World".length)
  .typeString("World")
  .deleteChars(" World".length)
  .deleteChars("Hello".length)
  .start()

Workaround

When appending a space before the opening HTML tag it seems to work fine:

new Typewriter("#typewriter")
  .typeString("Hello")
  .typeString(" <i>World</i>")
  .deleteChars(" World".length)
  .typeString(" <i>World</i>")
  .deleteChars(" World".length)
  .deleteChars("Hello".length)
  .start()