wip

Author: jp-knj

internal/parser.go

@@ -1444,6 +1444,12 @@ func inBodyIM(p *parser) bool {
 			return true
 		}
 
+		// Special handling for selectedcontent end tag - just ignore it
+		// since it's treated as a void element
+		if p.tok.Data == "selectedcontent" {
+			return true
+		}
+
 		switch p.tok.DataAtom {
 		case a.Body:
 			p.addLoc()
@@ -2327,6 +2333,19 @@ func inSelectIM(p *parser) bool {
 			p.resetInsertionMode()
 		case a.Template:
 			return inHeadIM(p)
+		default:
+			// Handle closing tags for elements that are allowed in customizable select
+			// (like button for the new HTML select element)
+			if p.tok.Data == "button" {
+				// Close the button if it's open
+				for i := len(p.oe) - 1; i >= 0; i-- {
+					if p.oe[i].Data == "button" {
+						p.oe = p.oe[:i]
+						break
+					}
+				}
+				return true
+			}
 		}
 	case CommentToken:
 		p.addChild(&Node{

internal/printer/__printer_js__/selectedcontent_element_in_customizable_select.snap

@@ -33,8 +33,8 @@ export const $$metadata = $$createMetadata(import.meta.url, { modules: [], hydra
 
 const $$Component = $$createComponent(($$result, $$props, $$slots) => {
 
-return $$render`${$$maybeRenderHead($$result)}<select><button><selectedcontent><option>Option 1</option><option>Option 2</option></button></select>`;
+return $$render`${$$maybeRenderHead($$result)}<select><button><selectedcontent></button><option>Option 1</option><option>Option 2</option></select>`;
 }, undefined, undefined);
 export default $$Component;
 ```
----
+---

internal/printer/__printer_js__/selectedcontent_self-closing_element.snap

@@ -33,8 +33,8 @@ export const $$metadata = $$createMetadata(import.meta.url, { modules: [], hydra
 
 const $$Component = $$createComponent(($$result, $$props, $$slots) => {
 
-return $$render`${$$maybeRenderHead($$result)}<select><button><selectedcontent><option>Option 1</option><option>Option 2</option></button></select>`;
+return $$render`${$$maybeRenderHead($$result)}<select><button><selectedcontent></button><option>Option 1</option><option>Option 2</option></select>`;
 }, undefined, undefined);
 export default $$Component;
 ```
----
+---

internal/token.go

@@ -1211,12 +1211,18 @@ func (z *Tokenizer) readStartTag() TokenType {
 	}
 
 	// HTML void tags list: https://www.w3.org/TR/2011/WD-html-markup-20110113/syntax.html#syntax-elements
-	// Also look for a self-closing token that’s not in the list (e.g. "<svg><path/></svg>")
-	if z.startTagIn("area", "base", "br", "col", "command", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "selectedcontent", "source", "track", "wbr") || z.err == nil && z.buf[z.raw.End-2] == '/' {
+	// Also look for a self-closing token that's not in the list (e.g. "<svg><path/></svg>")
+	if z.startTagIn("area", "base", "br", "col", "command", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr") || z.err == nil && z.buf[z.raw.End-2] == '/' {
 		// Reset tokenizer state for self-closing elements
 		z.rawTag = ""
 		return SelfClosingTagToken
 	}
+	// Special handling for selectedcontent - it's void but can have a closing tag in HTML
+	if z.startTagIn("selectedcontent") && z.err == nil && z.buf[z.raw.End-2] == '/' {
+		// Only treat as self-closing if it actually has />
+		z.rawTag = ""
+		return SelfClosingTagToken
+	}
 
 	// Handle TypeScript Generics
 	if len(z.expressionElementStack) > 0 && len(z.expressionElementStack[len(z.expressionElementStack)-1]) == 0 {

internal/token_test.go

@@ -418,7 +418,7 @@ func TestBasic(t *testing.T) {
 		{
 			"selectedcontent element",
 			`<select><button><selectedcontent></selectedcontent></button><option>A</option></select>`,
-			[]TokenType{StartTagToken, StartTagToken, SelfClosingTagToken, EndTagToken, EndTagToken, StartTagToken, TextToken, EndTagToken, EndTagToken},
+			[]TokenType{StartTagToken, StartTagToken, StartTagToken, EndTagToken, EndTagToken, StartTagToken, TextToken, EndTagToken, EndTagToken},
 		},
 		{
 			"selectedcontent self-closing",