Declarative Shadow DOM

Describe the bug

I would like to have the ability to use declarative shadow DOM (without custom elements) within Solid components just to get style scoping. It doesn't work and I get the error Uncaught TypeError: Cannot read properties of null (reading 'nextSibling')

Your Example Website or App

https://codesandbox.io/p/sandbox/awesome-sky-8fp8z5

Steps to Reproduce the Bug or Issue

export default function ShadowTest() {
  return (
    <div>
      <template shadowrootmode="open">
        <p>This is in the shadow DOM</p>
        <slot>
          <p>This is in the light DOM</p>
          <button>Light button</button>
        </slot>
        <button>Shadow button</button>
      </template>
    </div>
  );
}

Expected behavior

It should render a shadow tree.

Screenshots or Videos

No response

Platform

• OS: all
• Browser: Chrome + Safari (Firefox hasn't shipped support for it yet)

Additional context

No response

Start with the linked CodeSandbox reproduction and the declarative shadow DOM example in this issue, checking the reported null nextSibling error in Chrome or Safari. Done means the Solid component renders a shadow tree with the shadow and light DOM content without throwing; Firefox support is not part of the report.