v143 · dom

Allow more characters in javascript DOM APIs

The HTML parser has always (or for a long time) allowed elements and attributes to have a wide variety of valid characters and names, but the javascript DOM APIs to create the same elements and attributes are more strict and don't match the parser. This change relaxes the validation of the javascript DOM APIs to match the HTML parser. More context here

concepts

  1. Character Permissivity

    Interactive probe: pick or type a tag name with unicode or punctuation and see whether createElement and querySelector accept it in your browser.

  2. Parser vs JS

    The motivating mismatch: parse an HTML snippet, then try to rebuild the same tree with createElement. Pre-v143 the parser accepted unicode tags but JS threw — v143 closes the gap.

  3. Attribute name permissivity

    Same relaxation, attribute side. Type any name, watch the parser and setAttribute finally agree.

  4. SVG / MathML round-trip

    Pick an SVG or MathML snippet, parse it, then rebuild the whole tree with createElementNS / setAttributeNS. Both forms now render identically.

  5. querySelector with Exotic Names

    The full round-trip: create an element with a unicode tag name, then query it back using CSS.escape(). Gallery of 9 character sets — Latin accents, CJK, Cyrillic, Arabic, emoji — with live create/querySelector results and an attribute selector sandbox.

  6. i18n data-* Attributes

    Real-world use case: data-名前, data-precio, data-название. A product catalog built with Unicode data-* attribute names, readable via getAttribute and dataset. Includes a dataset camelCase mapping table and a live attribute setter/reader.

why it shipped

The HTML parser has always (or for a long time) allowed elements and attributes to have a wide variety of valid characters and names, but the javascript DOM APIs to create the same elements and attributes are more strict and don't match the parser. This change relaxes the validation of the javascript DOM APIs to match the HTML parser. More context here

references