Skip to content

Commit 76af4c2

Browse files
committed
test(compiler-dom): add failing tests for Chrome 134+ HTML nesting
Add tests for new HTML5 specifications that allow: - button as child of select - inline elements (span, b, i, strong, em) as children of option ref #13608
1 parent c875019 commit 76af4c2

File tree

1 file changed

+48
-0
lines changed

1 file changed

+48
-0
lines changed

packages/compiler-dom/__tests__/transforms/validateHtmlNesting.spec.ts

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,31 @@ describe('validate html nesting', () => {
2727
})
2828
expect(err).toBeUndefined()
2929
})
30+
31+
// #13608 - Chrome 134+ HTML5 spec updates
32+
it('should not warn with select > button', () => {
33+
let err: CompilerError | undefined
34+
compile(`<select><button>Click me</button></select>`, {
35+
onWarn: e => (err = e),
36+
})
37+
expect(err).toBeUndefined()
38+
})
39+
40+
it('should not warn with option > span', () => {
41+
let err: CompilerError | undefined
42+
compile(`<select><option><span>Styled text</span></option></select>`, {
43+
onWarn: e => (err = e),
44+
})
45+
expect(err).toBeUndefined()
46+
})
47+
48+
it('should not warn with option > b', () => {
49+
let err: CompilerError | undefined
50+
compile(`<select><option><b>Bold text</b></option></select>`, {
51+
onWarn: e => (err = e),
52+
})
53+
expect(err).toBeUndefined()
54+
})
3055
})
3156

3257
/**
@@ -148,6 +173,29 @@ describe('isValidHTMLNesting', () => {
148173
expect(isValidHTMLNesting('h1', 'div')).toBe(true)
149174
})
150175

176+
test('select - Chrome 134+ allows button as child', () => {
177+
// These should be valid according to new HTML5 spec (Chrome 134+)
178+
expect(isValidHTMLNesting('select', 'button')).toBe(true)
179+
180+
// Traditional valid children should still work
181+
expect(isValidHTMLNesting('select', 'option')).toBe(true)
182+
expect(isValidHTMLNesting('select', 'optgroup')).toBe(true)
183+
expect(isValidHTMLNesting('select', 'hr')).toBe(true)
184+
})
185+
186+
test('option - Chrome 134+ allows styled content', () => {
187+
// These should be valid according to new HTML5 spec (Chrome 134+)
188+
expect(isValidHTMLNesting('option', 'span')).toBe(true)
189+
expect(isValidHTMLNesting('option', 'b')).toBe(true)
190+
expect(isValidHTMLNesting('option', 'i')).toBe(true)
191+
expect(isValidHTMLNesting('option', 'strong')).toBe(true)
192+
expect(isValidHTMLNesting('option', 'em')).toBe(true)
193+
194+
// Block-level elements might still be invalid
195+
expect(isValidHTMLNesting('option', 'div')).toBe(false)
196+
expect(isValidHTMLNesting('option', 'p')).toBe(false)
197+
})
198+
151199
describe('SVG', () => {
152200
test('svg', () => {
153201
// invalid non-svg tags as children

0 commit comments

Comments
 (0)