From 57e43a36f8a24d00b3059f4fbd7807afa1d57c17 Mon Sep 17 00:00:00 2001
From: Calvin Liang <me@calvin.sh>
Date: Mon, 18 Aug 2025 19:25:27 -0700
Subject: [PATCH 1/2] add more customizable select support

---
 src/mapping.js | 76 +++++++++++++++++++++++++++++++++++++++++++++++---
 1 file changed, 72 insertions(+), 4 deletions(-)

diff --git a/src/mapping.js b/src/mapping.js
index 2695038..a297756 100644
--- a/src/mapping.js
+++ b/src/mapping.js
@@ -17,10 +17,76 @@ const onlyValidChildren = {
 		'script',
 		'template',
 	]),
-	optgroup: new Set(['option']),
-	select: new Set(['optgroup', 'option', 'hr', 'button']),
+	option: new Set([
+		'div',
+		'a',
+		'abbr',
+		'area',
+		'audio',
+		'b',
+		'bdi',
+		'bdo',
+		'br',
+		'canvas',
+		'cite',
+		'code',
+		'data',
+		'del',
+		'dfn',
+		'em',
+		'i',
+		'img',
+		'input',
+		'ins',
+		'kbd',
+		'link',
+		'map',
+		'mark',
+		'math',
+		'meta',
+		'meter',
+		'noscript',
+		'output',
+		'picture',
+		'progress',
+		'q',
+		'ruby',
+		's',
+		'samp',
+		'script',
+		'slot',
+		'small',
+		'span',
+		'strong',
+		'sub',
+		'sup',
+		'svg',
+		'template',
+		'time',
+		'u',
+		'var',
+		'video',
+		'wbr',
+	]),
+	optgroup: new Set([
+		'option',
+		'legend',
+		'script',
+		'template',
+		'noscript',
+		'div',
+	]),
+	select: new Set([
+		'optgroup',
+		'option',
+		'hr',
+		'button',
+		'script',
+		'template',
+		'noscript',
+		'div',
+	]),
 	math: new Set(['mrow']),
-	script: new Set(),
 	// table
 	table: new Set(['caption', 'colgroup', 'tbody', 'tfoot', 'thead']),
 	tr: new Set(['td', 'th']),
@@ -29,11 +95,12 @@ const onlyValidChildren = {
 	thead: new Set(['tr']),
 	tfoot: new Set(['tr']),
 	// these elements can not have any children elements
+	script: emptySet,
 	iframe: emptySet,
-	option: emptySet,
 	textarea: emptySet,
 	style: emptySet,
 	title: emptySet,
+	selectedcontent: emptySet,
 };
 
 /** maps elements to set of elements which can be it's parent, no other */
@@ -60,6 +127,7 @@ const onlyValidParents = {
 	// li: new Set(["ul", "ol"]),
 	summary: new Set(['details']),
 	area: new Set(['map']),
+	selectedcontent: new Set(['button']),
 };
 
 /** maps element to set of elements that can not be it's children, others can */

From b8e53828e27acf17662576d47de83656c31db912 Mon Sep 17 00:00:00 2001
From: Calvin Liang <me@calvin.sh>
Date: Mon, 18 Aug 2025 20:02:59 -0700
Subject: [PATCH 2/2] add tests

---
 tests/validation.test.js | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/tests/validation.test.js b/tests/validation.test.js
index 70c5bed..44df6d6 100644
--- a/tests/validation.test.js
+++ b/tests/validation.test.js
@@ -26,6 +26,20 @@ test('select', () => {
 	expect(isValidHTMLNesting('select', 'button')).toBe(true);
 });
 
+test('customizable select', () => {
+	// invalid
+	expect(isValidHTMLNesting('select', 'selectedcontent')).toBe(false);
+	expect(isValidHTMLNesting('option', 'button')).toBe(false);
+
+	// using example from https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Customizable_select
+
+	// valid
+	expect(isValidHTMLNesting('select', 'button')).toBe(true);
+	expect(isValidHTMLNesting('button', 'selectedcontent')).toBe(true);
+	expect(isValidHTMLNesting('select', 'option')).toBe(true);
+	expect(isValidHTMLNesting('option', 'span')).toBe(true);
+});
+
 test('p', () => {
 	// invalid
 	expect(isValidHTMLNesting('p', 'p')).toBe(false);