1 files changed, 80 insertions, 0 deletions
diff --git a/Source/WebCore/manual-tests/optgroup-empty-and-nested.html b/Source/WebCore/manual-tests/optgroup-empty-and-nested.html
new file mode 100644
index 0000000..6aa3e7b
--- /dev/null
+++ b/Source/WebCore/manual-tests/optgroup-empty-and-nested.html
@@ -0,0 +1,80 @@
+<html>
+<head>
+  <title>Empty and nested optgroup elements</title>
+</head>
+
+<body>
+
+<select>
+  <!-- A div here is invalid. However, both IE and Firefox will walk into it
+       and enumerate the elements inside. -->
+  <div>
+    <option value="1">Item one</option>
+
+    <!-- this group has no children. We /should/ render it because that matches
+         IE and FireFox. -->
+    <optgroup label="Group one"></optgroup>
+
+    <!-- this group has a text node child. It should render the same as group one. -->
+    <optgroup label="Group two"> </optgroup>
+
+    <!-- for an optgroup without a label, IE will show an empty, unselectable row.
+         Firefox doesn't show it. We /do/ show it because someone might be using
+         it as a spacer. -->
+    <!-- Additionally, this has been updated to test the crash fixed in
+         https://bugs.webkit.org/show_bug.cgi?id=26656. When setting the
+         font-size in the <optgroup> to extra large, opening the select element
+         must not leave any unpainted areas of overlapping text. -->
+    <optgroup style="font-size: x-large;">
+      <option value="2">Item inside an optgroup without a label</option>
+    </optgroup>
+
+    <!-- for an optgroup with an empty label, IE will show an empty,
+         unselectable row.  Firefox doesn't show it. We /do/ show it because
+         someone might be using it as a spacer. -->
+    <optgroup label="">
+      <option value="3">Item inside an optgroup with an empty label</option>
+    </optgroup>
+
+    <div>
+      <option value="4"></option>
+      <optgroup label="Group three">
+        <option value="5">Item two</option>
+        <!-- nested groups are disallowed by the spec, but IE and Firefox will
+             flatten the tree. We should match them. -->
+        <optgroup label="Nested group 1"></optgroup>
+        <optgroup label="Nested group 2">
+          <optgroup label="Nested group 3">
+              <option value="6">Item three</option>
+          </optgroup>
+        </optgroup>
+      </optgroup>
+    </div>
+    <option value="7">Item four</option>
+  </div>
+</select>
+
+<p>Click on the select element above. When it drops down you should see the following items in the list:</p>
+
+<ul>
+  <li>Item one</li>
+  <li><b>Group one</b></li>
+  <li><b>Group two</b></li>
+  <li><i>(unselectable, empty row)</i></li>
+  <li>Item inside an optgroup without a label</li>
+  <li><i>(unselectable, empty row)</i></li>
+  <li>Item inside an optgroup with an empty label</li>
+  <li><i>(selectable, empty row)</i></li>
+  <li><b>Group three</b></li>
+  <li>Item two</li>
+  <li><b>Nested group 1</b></li>
+  <li><b>Nested group 2</b></li>
+  <li><b>Nested group 3</b></li>
+  <li>Item three</li>
+  <li>Item four</li>
+</ul>
+
+<p>The text of the rows of the dropdown must not overlap each other.</p>
+
+</body>
+</html>