Skip to content

Unable to define SVG elements conflicting with HTML #20149

Closed
@falsandtru

Description

@falsandtru

TypeScript Version: master

Expected behavior:

interface SVGElementTagNameMap {
    'a': SVGAElement;
}
interface ElementTagNameMap extends HTMLElementTagNameMap, SVGElementTagNameMap {
}

But deriving from both HTMLElementTagNameMap and SVGElementTagNameMap still throw an error by conflicts. To resolve this, ElementTagNameMap has to be defined using Diff type as follows.

interface ElementTagNameMap extends HTMLElementTagNameMap, Diff<SVGElementTagNameMap, HTMLElementTagNameMap> {
}

type Diff<T, U> = Pick<T, DiffKey<keyof T, keyof U>>;
type DiffKey<T extends string, U extends string> = (
  & { [P in T]: P; }
  & { [P in U]: never; }
  & { [x: string]: never; }
)[T];

However, defining ElementTagNameMap is originally wrong. It should be removed later.

Actual behavior:

interface ElementTagNameMap {
    'a': SVGAElement; // error, conflicts with 'a': HTMLAnchorElement;
}

related: #20134, #14783

Metadata

Metadata

Assignees

No one assigned

    Labels

    Design LimitationConstraints of the existing architecture prevent this from being fixed

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions