Allow <input> in <select> with wrapper tags
This patch makes <input> get parsed as expected in <select> if there is
another tag in between the <select> and <input>, such as
<select><div><input>, in order to ensure compatibility with the legacy
behavior where <input> adds a closing </select> tag.
Bug: 402429384
Change-Id: Iff21245d0555844aa636eb002866bb3ed5af4d42
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6435161
Reviewed-by: Mason Freed <masonf@chromium.org>
Commit-Queue: Joey Arhar <jarhar@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1455251}
diff --git a/third_party/blink/renderer/core/html/parser/html_tree_builder.cc b/third_party/blink/renderer/core/html/parser/html_tree_builder.cc
index 9deb802ca..3e2fe10 100644
--- a/third_party/blink/renderer/core/html/parser/html_tree_builder.cc
+++ b/third_party/blink/renderer/core/html/parser/html_tree_builder.cc
@@ -741,11 +741,16 @@
if (parent_select) {
UseCounter::Count(tree_.CurrentNode()->GetDocument(),
WebFeature::kInputParsedParentSelect);
+ if (RuntimeEnabledFeatures::InputInSelectEnabled()) {
+ ProcessFakeEndTag(HTMLTag::kSelect);
+ }
} else {
UseCounter::Count(tree_.CurrentNode()->GetDocument(),
WebFeature::kInputParsedAncestorSelect);
}
- ProcessFakeEndTag(HTMLTag::kSelect);
+ if (!RuntimeEnabledFeatures::InputInSelectEnabled()) {
+ ProcessFakeEndTag(HTMLTag::kSelect);
+ }
}
}
// Per spec https://html.spec.whatwg.org/C/#parsing-main-inbody,
diff --git a/third_party/blink/renderer/platform/runtime_enabled_features.json5 b/third_party/blink/renderer/platform/runtime_enabled_features.json5
index 35d73ff..e83abece 100644
--- a/third_party/blink/renderer/platform/runtime_enabled_features.json5
+++ b/third_party/blink/renderer/platform/runtime_enabled_features.json5
@@ -2600,6 +2600,16 @@
status: "stable",
},
{
+ // The HTML parser inserts a </select> end tag before inserting <input>
+ // when parsing inside of a <select> tag. We want to allow <input> inside
+ // <select>, but it isn't web compatible enough. This flag allows <input>
+ // inside <select> but only if there is another open tag in between the
+ // <input> and the <select>, like <select><div><input>.
+ name: "InputInSelect",
+ status: "experimental",
+ depends_on: ["SelectParserRelaxation"],
+ },
+ {
name: "InputMultipleFieldsUI",
// No plan to support complex UI for date/time INPUT types on Android and
// iOS.
diff --git a/third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/customizable-select/select-parsing.tentative.html b/third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/customizable-select/select-parsing.tentative.html
index cc6596b..0c6972bc 100644
--- a/third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/customizable-select/select-parsing.tentative.html
+++ b/third_party/blink/web_tests/external/wpt/html/semantics/forms/the-select-element/customizable-select/select-parsing.tentative.html
@@ -96,6 +96,14 @@
<textarea></textarea>
</select>
+<select class=test
+ data-description='Input tags should parse inside select if nested in another tag'
+ data-expect='<div><input></div>'>
+ <div>
+ <input>
+ </div>
+</select>
+
<div id=afterlast>
keep this div after the last test case
</div>
diff --git a/third_party/blink/web_tests/fast/forms/select/customizable-select/disallowed-select-descendants-console-message-expected.txt b/third_party/blink/web_tests/fast/forms/select/customizable-select/disallowed-select-descendants-console-message-expected.txt
index 5fa3100..41c6ad5 100644
--- a/third_party/blink/web_tests/fast/forms/select/customizable-select/disallowed-select-descendants-console-message-expected.txt
+++ b/third_party/blink/web_tests/fast/forms/select/customizable-select/disallowed-select-descendants-console-message-expected.txt
@@ -3,6 +3,7 @@
CONSOLE ERROR: Non-phrasing content was found within an <option> element. The <option> element allows only non-interactive phrasing content, text, and <div> elements as its children. The semantics of non-phrasing content elements do not make sense as children of an <option>, and such semantics will largely be ignored by assistive technology since they are inappropriate in this context. Consider removing or changing such elements to one of the allowed phrasing content elements.
CONSOLE ERROR: Non-phrasing content was found within an <option> element. The <option> element allows only non-interactive phrasing content, text, and <div> elements as its children. The semantics of non-phrasing content elements do not make sense as children of an <option>, and such semantics will largely be ignored by assistive technology since they are inappropriate in this context. Consider removing or changing such elements to one of the allowed phrasing content elements.
CONSOLE ERROR: Non-phrasing content was found within an <option> element. The <option> element allows only non-interactive phrasing content, text, and <div> elements as its children. The semantics of non-phrasing content elements do not make sense as children of an <option>, and such semantics will largely be ignored by assistive technology since they are inappropriate in this context. Consider removing or changing such elements to one of the allowed phrasing content elements.
+CONSOLE ERROR: Non-phrasing content was found within an <option> element. The <option> element allows only non-interactive phrasing content, text, and <div> elements as its children. The semantics of non-phrasing content elements do not make sense as children of an <option>, and such semantics will largely be ignored by assistive technology since they are inappropriate in this context. Consider removing or changing such elements to one of the allowed phrasing content elements.
CONSOLE ERROR: An element which is not allowed in the content model of the <select> element was found within a <select> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology. If using disallowed elements for layout structure and styling, consider using the allowed <div> element instead. Any text existing within the <select> element should either be removed or relocated to a valid element that allows text descendants, e.g., an <optgroup> with a <legend> element or <option> elements.
CONSOLE ERROR: An element which is not allowed in the content model of the <select> element was found within a <select> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology. If using disallowed elements for layout structure and styling, consider using the allowed <div> element instead. Any text existing within the <select> element should either be removed or relocated to a valid element that allows text descendants, e.g., an <optgroup> with a <legend> element or <option> elements.
CONSOLE ERROR: An element which is not allowed in the content model of the <select> element was found within a <select> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology. If using disallowed elements for layout structure and styling, consider using the allowed <div> element instead. Any text existing within the <select> element should either be removed or relocated to a valid element that allows text descendants, e.g., an <optgroup> with a <legend> element or <option> elements.
@@ -10,6 +11,7 @@
CONSOLE ERROR: An element which is not allowed in the content model of the <optgroup> element was found within an <optgroup> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology. If using disallowed elements for layout structure and styling, consider using the allowed <div> element instead. Any text existing within the <optgroup> element should either be removed or relocated to a valid element that allows text descendants, e.g., the <legend> or <option> elements.
CONSOLE ERROR: An element which is not allowed in the content model of the <optgroup> element was found within an <optgroup> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology. If using disallowed elements for layout structure and styling, consider using the allowed <div> element instead. Any text existing within the <optgroup> element should either be removed or relocated to a valid element that allows text descendants, e.g., the <legend> or <option> elements.
CONSOLE ERROR: An interactive element which is not allowed in the content model of the <legend> element was found within a <legend> element. Interactive elements are not allowed children of a <legend> element when used within an <optgroup> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology.
+CONSOLE ERROR: An element which is not allowed in the content model of the <optgroup> element was found within an <optgroup> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology. If using disallowed elements for layout structure and styling, consider using the allowed <div> element instead. Any text existing within the <optgroup> element should either be removed or relocated to a valid element that allows text descendants, e.g., the <legend> or <option> elements.
CONSOLE ERROR: An interactive element which is not allowed in the content model of the <option> element was found within an <option> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology.
CONSOLE ERROR: An interactive element which is not allowed in the content model of the <option> element was found within an <option> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology.
CONSOLE ERROR: An interactive element which is not allowed in the content model of the <option> element was found within an <option> element. These elements will not consistently be accessible to people navigating by keyboard or using assistive technology.
diff --git a/third_party/blink/web_tests/fast/parser/inselect-tokenization-expected.txt b/third_party/blink/web_tests/fast/parser/inselect-tokenization-expected.txt
index 8660292..e57e097 100644
--- a/third_party/blink/web_tests/fast/parser/inselect-tokenization-expected.txt
+++ b/third_party/blink/web_tests/fast/parser/inselect-tokenization-expected.txt
@@ -11,6 +11,8 @@
assert_equals: select expected "12" but got "12<element></element>"
[FAIL] <form><select><option>1<noembed>2<element></element>3
assert_equals: select expected "123" but got "12<element></element>3"
+[FAIL] <form><select><option>1<input><noembed>2<element></element>
+ assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<keygen><noembed>2<element></element>
assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<textarea></textarea><noembed>2<element></element>
@@ -21,6 +23,8 @@
assert_equals: select expected "12" but got "12<element></element>"
[FAIL] <form><select><option>1<noframes>2<element></element>3
assert_equals: select expected "123" but got "12<element></element>3"
+[FAIL] <form><select><option>1<input><noframes>2<element></element>
+ assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<keygen><noframes>2<element></element>
assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<textarea></textarea><noframes>2<element></element>
@@ -31,6 +35,8 @@
assert_equals: select expected "12" but got "12<element></element>"
[FAIL] <form><select><option>1<noscript>2<element></element>3
assert_equals: select expected "123" but got "12<element></element>3"
+[FAIL] <form><select><option>1<input><noscript>2<element></element>
+ assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<keygen><noscript>2<element></element>
assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<textarea></textarea><noscript>2<element></element>
@@ -41,6 +47,8 @@
assert_equals: select expected "12" but got "12<element></element>"
[FAIL] <form><select><option>1<plaintext>2<element></element>3
assert_equals: select expected "123" but got "12<element></element>3"
+[FAIL] <form><select><option>1<input><plaintext>2<element></element>
+ assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<keygen><plaintext>2<element></element>
assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<textarea></textarea><plaintext>2<element></element>
@@ -51,6 +59,8 @@
assert_equals: select expected "12" but got "12<element></element>"
[FAIL] <form><select><option>1<style>2<element></element>3
assert_equals: select expected "123" but got "12<element></element>3"
+[FAIL] <form><select><option>1<input><style>2<element></element>
+ assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<keygen><style>2<element></element>
assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<textarea></textarea><style>2<element></element>
@@ -61,6 +71,8 @@
assert_equals: select expected "12" but got "12<element></element>"
[FAIL] <form><select><option>1<xmp>2<element></element>3
assert_equals: select expected "123" but got "12<element></element>3"
+[FAIL] <form><select><option>1<input><xmp>2<element></element>
+ assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<keygen><xmp>2<element></element>
assert_equals: select expected "1" but got "12<element></element>"
[FAIL] <form><select><option>1<textarea></textarea><xmp>2<element></element>
diff --git a/third_party/blink/web_tests/http/tests/inspector-protocol/issues/select-element-accessibility-issue-creation-expected.txt b/third_party/blink/web_tests/http/tests/inspector-protocol/issues/select-element-accessibility-issue-creation-expected.txt
index 0e1c410..927da6ac 100644
--- a/third_party/blink/web_tests/http/tests/inspector-protocol/issues/select-element-accessibility-issue-creation-expected.txt
+++ b/third_party/blink/web_tests/http/tests/inspector-protocol/issues/select-element-accessibility-issue-creation-expected.txt
@@ -30,6 +30,18 @@
selectElementAccessibilityIssueDetails : {
hasDisallowedAttributes : false
nodeId : <number>
+ selectElementAccessibilityIssueReason : DisallowedOptGroupChild
+ }
+ }
+ }
+}
+Inspector issue: {
+ issue : {
+ code : SelectElementAccessibilityIssue
+ details : {
+ selectElementAccessibilityIssueDetails : {
+ hasDisallowedAttributes : false
+ nodeId : <number>
selectElementAccessibilityIssueReason : NonPhrasingContentOptionChild
}
}
diff --git a/third_party/blink/web_tests/virtual/customizable-select-disabled/external/wpt/html/semantics/forms/the-select-element/customizable-select/select-parsing.tentative-expected.txt b/third_party/blink/web_tests/virtual/customizable-select-disabled/external/wpt/html/semantics/forms/the-select-element/customizable-select/select-parsing.tentative-expected.txt
index 9a53a76..c1774f3 100644
--- a/third_party/blink/web_tests/virtual/customizable-select-disabled/external/wpt/html/semantics/forms/the-select-element/customizable-select/select-parsing.tentative-expected.txt
+++ b/third_party/blink/web_tests/virtual/customizable-select-disabled/external/wpt/html/semantics/forms/the-select-element/customizable-select/select-parsing.tentative-expected.txt
@@ -13,5 +13,7 @@
assert_equals: expected "<div><option><img>option</option></div>" but got "<option>option</option>"
[FAIL] textarea tags should parse inside select instead of closing the select
assert_equals: expected "<textarea></textarea>" but got ""
+[FAIL] Input tags should parse inside select if nested in another tag
+ assert_equals: expected "<div><input></div>" but got ""
Harness: the test ran to completion.
