Stencil version:

 @stencil/core@2.5.2

I'm submitting a:
[x] bug report
[ ] feature request
[ ] support request

Current behavior:
Putting content in the Stencil component's slot in Vue.js throws an error on hydrate.

Expected behavior:
The client-side rendered virtual DOM tree should match the server-rendered content.

Steps to reproduce:

1. Create a Stencil component with a <slot />.
2. Setup a Nuxt.js or Vue.js project with SSR.
3. Use the Stencil component in a Vue.js component and put some content in the slot.
4. SSR the Vue.js page/component.

Related code:

Stencil component

import { Component, Host, h } from '@stencil/core';

@Component({
  tag: 'bs-slot-component',
  shadow: false,
  scoped: true,
})
export class SlotComponent {
  render() {
    return (
      <Host>
        <slot />
      </Host>
    );
  }
}

Vue.js component

<template>
  <bs-slot-component>
    <div>Content in slot</div>
  </bs-slot-component>
</template>

Nuxt.js module to hydrate Stencil components

import { renderToString } from 'path/to/hydrate';

export default function() {
  this.nuxt.hook('render:route', async (_, page) => {
    const render = await renderToString(page.html);
    page.html = render.html;
  })
}

Other information:
Possible cause might be Stencil updating HTML comments on hydrate.