refactor: add check of native element for safe element handling

Author: baspinarenes

src/index.js

@@ -4,6 +4,7 @@ import {
 	UNSAFE_NAME,
 	NAMESPACE_REPLACE_REGEX,
 	HTML_LOWER_CASE,
+	HTML_ELEMENTS,
 	HTML_ENUMERATED,
 	SVG_CAMEL_CASE,
 	createComponent,
@@ -666,7 +667,7 @@ function _renderToString(
 								? 'panose-1'
 								: name.replace(/([A-Z])/g, '-$1').toLowerCase();
 					}
-				} else if (HTML_LOWER_CASE.has(name)) {
+				} else if (HTML_ELEMENTS.has(type) && HTML_LOWER_CASE.has(name)) {
 					name = name.toLowerCase();
 				}
 			}

src/lib/util.js

@@ -1,6 +1,121 @@
 import { DIRTY, BITS } from './constants';
 
 export const VOID_ELEMENTS = /^(?:area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr)$/;
+
+export const HTML_ELEMENTS = new Set([
+	'a',
+	'abbr',
+	'address',
+	'area',
+	'article',
+	'aside',
+	'audio',
+	'b',
+	'base',
+	'bdi',
+	'bdo',
+	'blockquote',
+	'body',
+	'br',
+	'button',
+	'canvas',
+	'caption',
+	'cite',
+	'code',
+	'col',
+	'colgroup',
+	'data',
+	'datalist',
+	'dd',
+	'del',
+	'details',
+	'dfn',
+	'dialog',
+	'div',
+	'dl',
+	'dt',
+	'em',
+	'embed',
+	'fieldset',
+	'figcaption',
+	'figure',
+	'footer',
+	'form',
+	'h1',
+	'h2',
+	'h3',
+	'h4',
+	'h5',
+	'h6',
+	'head',
+	'header',
+	'hgroup',
+	'hr',
+	'html',
+	'i',
+	'iframe',
+	'img',
+	'input',
+	'ins',
+	'kbd',
+	'label',
+	'legend',
+	'li',
+	'link',
+	'main',
+	'map',
+	'mark',
+	'menu',
+	'meta',
+	'meter',
+	'nav',
+	'noscript',
+	'object',
+	'ol',
+	'optgroup',
+	'option',
+	'output',
+	'p',
+	'picture',
+	'pre',
+	'progress',
+	'q',
+	'rp',
+	'rt',
+	'ruby',
+	's',
+	'samp',
+	'script',
+	'search',
+	'section',
+	'select',
+	'slot',
+	'small',
+	'source',
+	'span',
+	'strong',
+	'style',
+	'sub',
+	'summary',
+	'sup',
+	'table',
+	'tbody',
+	'td',
+	'template',
+	'textarea',
+	'tfoot',
+	'th',
+	'thead',
+	'time',
+	'title',
+	'tr',
+	'track',
+	'u',
+	'ul',
+	'var',
+	'video',
+	'wbr'
+]);
 // oxlint-disable-next-line no-control-regex
 export const UNSAFE_NAME = /[\s\n\\/='"\0<>]/;
 export const NAMESPACE_REPLACE_REGEX = /^(xlink|xmlns|xml)([A-Z])/;

src/pretty.js

@@ -11,6 +11,7 @@ import {
 	SVG_CAMEL_CASE,
 	HTML_ENUMERATED,
 	HTML_LOWER_CASE,
+	HTML_ELEMENTS,
 	getContext,
 	setDirty,
 	isDirty,
@@ -299,7 +300,7 @@ function _renderToStringPretty(
 							? 'panose-1'
 							: name.replace(/([A-Z])/g, '-$1').toLowerCase();
 				}
-			} else if (HTML_LOWER_CASE.has(name)) {
+			} else if (HTML_ELEMENTS.has(nodeName) && HTML_LOWER_CASE.has(name)) {
 				name = name.toLowerCase();
 			}