Proposal: Opt-In Case-Sensitive Parsing for Custom HTML Elements

[Thaoky]

What problem are you trying to solve?

Currently, HTML parsers automatically normalize all tag names to lowercase, even for custom elements. This behavior is hardcoded into browser engines and prevents developers from preserving the original casing of their custom tags in the DOM. While this aligns with the HTML spec’s case-insensitive nature for standard elements, it limits expressiveness and consistency for developers using Web Components or custom DSLs.

For example, writing <MyWidget> in HTML will be parsed and exposed in the DOM as <mywidget>, which breaks the visual and semantic alignment with the JavaScript definition customElements.define('MyWidget', ...).

What solutions exist today?

• Developers can use JavaScript to define custom elements with case-sensitive names, but the HTML parser still lowercases the tag name.

• Workarounds include using attributes or data-* markers to preserve casing, but these are clunky and non-semantic.

• XML and XHTML support case sensitivity, but they require strict syntax and are not widely used for modern web development.

How would you solve it?

Introduce an opt-in mechanism that allows developers to preserve the casing of custom element tag names during HTML parsing. This could be scoped to custom elements only, leaving standard HTML tags unaffected.

Suggested Implementation:

<meta name="html-parsing-mode" content="preserve-case-custom">
or
<meta name="custom-elements-case-sensitive" content="true">
or
whichever way you find more appropriate, you know this standard better than I do.

When this meta tag is absent:

Business as usual.

When this meta tag is present:

Browsers preserve the original casing of custom element tag names.

Standard HTML elements continue to be normalized to lowercase.

DOM APIs reflect the exact casing used in the source HTML for custom elements.

This approach maintains backward compatibility, avoids breaking legacy content, and empowers developers with more control over their markup semantics.

Alternatively, this could be a flag that affects all HTML elements as well, not just the custom ones.

Anything else?

I have worked with several JavaScript frameworks, and even considered creating one myself, and the blocking point to create something clean was always the case-insensitiveness of HTML.

Since I don't want to break the whole internet, I would like to suggest allowing this for developers who opt-in, and definitely not enforce it for everyone.

Thanks for considering this.