Skip to content

Add types for part attribute on <svg> element #16498

@Bladesheng

Description

@Bladesheng

Describe the problem

Svelte is throwing type error when you use part attribute on a <svg> element.

<svg part="myIcon">...</svg>
Svelte: Object literal may only specify known properties, and 'part' does not exist in type HTMLProps<'svg', SVGAttributes<any>>

This is very annoying when you, for example want to add the part attribute to an svg icon inside a shadow dom, so that you can style it from the outside of shadow dom using the ::part() selector. It works just fine, but svelte-check will throw error and your editor will give you red squiggles.

According to the css spec, the part attribute can be used on any element inside the shadow tree, so that should also include svg.
https://drafts.csswg.org/css-shadow-parts/#part-attr
I'm not sure if the part attribute was not included in SVGAttributes intentionally or if it was just forgotten.
https://github.com/sveltejs/svelte/blob/main/packages/svelte/elements.d.ts

There is no non-hacky way to supress type errors on html attributes as far as I know - see sveltejs/language-tools#1026.

Describe the proposed solution

Add types for the part attribute to SVGAttributes of the <svg> element. I haven't noticed if it's missing from any other elements.

Importance

would make my life easier

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions