Nested slot mis-ordering

This is a simple test case for an issue I'm running into with Stencil's virtual DOM implementation and nested slots when not using Shadow DOM. Here's the issue I'm running into:

  1. A parent component's template includes a child component.
  2. The parent's slot is passed into the child component.
  3. A prop on the child component is set based on the state of the parent component.
  4. The slot content is misordered in relation to the child component's template content.
  5. When the parent component's state changes the components re-render and the content is ordered correctly.

Slot

The "Slot" h1 should come after the "State: true" text. When the state is updated (using the button) it will switch to the correct order.

I originally ran into this in a more complex component. When the slots were re-ordered it would reload iframes breaking video playback.