Custom SVG Elements state of play

[GordonSmith]

So I spent the weekend learning about custom web components with great success, until I tried to use them in an SVG setting (which I now know is not supported ).

Does anyone know if there are plans for supporting custom SVG Elements in the future?

FWIW my current workaround looks like:

const template = html<HPCCZoomElement>`
<svg ${ref("_svg")} width="${s => s.width}" height="${s => s.height}" viewbox="[0, 0, ${s => s.width}, ${s => s.height}]">
    <foreignObject ${ref("_content")} x="0" y="0" width="100%" height="100%">
        <slot>
        </slot>
    </foreignObject>
</svg>
`;

Which is still jolly useful.

[EisenbergEffect]

Yes. In W3C we are discussing enabling SVG custom elements. There are a couple capabilities that have to be added to enable that, but last time the CG met together, there was general consensus that we wanted to enable this and various implementors were looking into the details (and edge cases) in order to come up with an addition to the standards.

[nileshtrivedi]

What's the current status? Can we now use the custom elements API to define new elements in the SVG namespace?

[chrisdholt]

I think this is the latest status on this - looks like it's still outstanding: WICG/webcomponents#634