Support for XML namespace prefixes in DOM Element names / tagnames (XHTML, SVG, MathML), with proposed fix

[danielweck]

https://github.com/antonmedv/finder/blob/feef1994d7534099362ae60855a8a15ac908b61a/finder.ts#L220-L229

My current workaround is:

{
name: name.replace(/^(.+:)(.+)$/, "*|$2"),
}

Examples:

• m:math ==> *|math
• svg:a ==> *|a
• div ==> div

Unfortunately the wildcard * prefix is necessary because the querySelector() API does not support namespace prefixes, unlike CSS stylesheets:

https://developer.mozilla.org/en-US/docs/Web/SVG/Element/a

...consequently, for example *|a will match not only SVG link elements but also HTML hyperlinks! :(

https://www.w3.org/TR/selectors-api/#namespace-prefix-needs-to-be-resolved

[danielweck]

Follow-up, I've added name._____.replace(/^\*\|(a|script|style)$/, "*|$1:not(|$1)") to exclude HTML elements with the same name as namespace-prefixed SVG element names (could be extended to other common names, and MathML too...)