Re: [WICG/webcomponents] [scoped-registries] Consider future expansion to allow using a registry without new API (Issue #1043)

> This should be verified, but I believe the most common pattern generally used by most web frameworks to create DOM is `document.createElement` + "append."

This is not the case – many frameworks such as [Solid](https://github.com/ryansolid/dom-expressions/blob/998e60384e31dc335290299e78f19e995f828b07/packages/dom-expressions/src/client.js#L75), [Vue Vapor](https://github.com/vuejs/core-vapor/blob/42d2f3dd9876c1c5f898c6507df1a845c7045d35/packages/runtime-dom/src/nodeOps.ts#L68), [Svelte v5](https://github.com/sveltejs/svelte/blob/7f237c2e41115b420f0d6432c51c85ec3b5ecaf5/packages/svelte/src/internal/client/reconciler.js#L101), and [Lit](https://github.com/lit/lit/blob/9a4d569f710a3c49409dcc778b71a71a04c4916a/packages/lit-html/src/lit-html.ts#L1054C2-L1058C4) instead use this pattern:

```js
const template = document.createElement('template')
template.innerHTML = htmlString
return template.content.cloneNode(true)
```

If the `htmlString` above contains `<x-foo></x-foo>`, then (AIUI) it would be upgraded in the global scope, since there is no associated shadow root.

I mentioned this in the call, but our (Salesforce's) [implementation of scoped registries](https://help.salesforce.com/s/articleView?id=release-notes.rn_lc_lws_custom_element.htm&release=246&type=5) solves this by conceptually tying a scoped registry to a [ShadowRealm](https://github.com/tc39/proposal-shadowrealm), not a ShadowRoot. This indeed requires a lot of global patching, but the upside is that the script can use `document.createElement`, `element.innerHTML`, `DOMParser`, or any other way of creating DOM, and constructed `<x-foo>` instances are bound to the right "scope" for that particular script.

> I don't see how this is possible without new API that frameworks use.

Maybe a v2 of the scoped registries spec could do this instead of boiling the ocean, but for our case at least, we would still need to patch globals to route the global APIs to the right scoped APIs.


-- 
Reply to this email directly or view it on GitHub:
https://github.com/WICG/webcomponents/issues/1043#issuecomment-1883315499
You are receiving this because you are subscribed to this thread.

Message ID: <WICG/webcomponents/issues/1043/1883315499@github.com>