Blazor builds DOM top-down, but some custom web components may rely on child content already being present when first attached to DOM

### Is there an existing issue for this?

- [X] I have searched the existing issues

### Describe the bug

Consider a simple Web Component that requires some HTML content:

```html

```

```js
// BlazorWebCompDemo.lib.module.js or any file that registers the component:
customElements.define("my-component", class extends HTMLElement {

#important = this.querySelector(".important");

constructor() {
super();

this.#important.textContent = "Component initialized";
}

});
```

The above code works fine. However, once any Blazor-specific binding/expression is involved, the component shows up without any inner content:

```html

@(foo)

@code {
int foo = 42;
}
```


Some of our Web Components are external and we cannot change the behavior and they expect the full HTML content when the component is created. This should not happen if it is in a Shadow DOM. Currently we have to write custom Javascript to render them instead of using Blazor as a workaround.

### Expected Behavior

The DOM Element should have all of its content before being attached to the DOM tree.

### Steps To Reproduce

The above code should be enough to reproduce the problem but here is a repo with the code: https://github.com/datvm/BlazorEmptyWebCompDemo


(`Foo` means the Web Component wasn't initialized successfully)

### Exceptions (if any)

_No response_

### .NET Version

7.0.302

### Anything else?

_No response_