1 files changed, 237 insertions, 0 deletions
diff --git a/dom/html/test/test_bug596511.html b/dom/html/test/test_bug596511.html
new file mode 100644
index 0000000000..42b93e4632
--- /dev/null
+++ b/dom/html/test/test_bug596511.html
@@ -0,0 +1,237 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=596511
+-->
+<head>
+  <title>Test for Bug 596511</title>
+  <script src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
+  <style>
+    select:valid { background-color: green; }
+    select:invalid { background-color: red; }
+  </style>
+</head>
+<body>
+<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=596511">Mozilla Bug 596511</a>
+<p id="display"></p>
+<div id="content" style="display: none">
+</div>
+<pre id="test">
+<script>
+
+/** Test for Bug 596511 **/
+
+function checkNotSufferingFromBeingMissing(element, aTodo)
+{
+  if (aTodo) {
+    ok = todo;
+    is = todo_is;
+  }
+
+  ok(!element.validity.valueMissing,
+    "Element should not suffer from value missing");
+  ok(element.validity.valid, "Element should be valid");
+  ok(element.checkValidity(), "Element should be valid");
+
+  is(element.validationMessage, "",
+    "Validation message should be the empty string");
+
+  ok(element.matches(":valid"), ":valid pseudo-class should apply");
+  is(window.getComputedStyle(element).getPropertyValue('background-color'),
+     "rgb(0, 128, 0)", ":valid pseudo-class should apply");
+
+  if (aTodo) {
+    ok = SimpleTest.ok;
+    is = SimpleTest.is;
+  }
+}
+
+function checkSufferingFromBeingMissing(element, aTodo)
+{
+  if (aTodo) {
+    ok = todo;
+    is = todo_is;
+  }
+
+  ok(element.validity.valueMissing, "Element should suffer from value missing");
+  ok(!element.validity.valid, "Element should not be valid");
+  ok(!element.checkValidity(), "Element should not be valid");
+
+  is(element.validationMessage, "Please select an item in the list.",
+     "Validation message is wrong");
+
+  is(window.getComputedStyle(element).getPropertyValue('background-color'),
+     "rgb(255, 0, 0)", ":invalid pseudo-class should apply");
+
+  if (aTodo) {
+    ok = SimpleTest.ok;
+    is = SimpleTest.is;
+  }
+}
+
+function checkRequiredAttribute(element)
+{
+  ok('required' in element, "select should have a required attribute");
+
+  ok(!element.required, "select required attribute should be disabled");
+  is(element.getAttribute('required'), null,
+    "select required attribute should be disabled");
+
+  element.required = true;
+  ok(element.required, "select required attribute should be enabled");
+  isnot(element.getAttribute('required'), null,
+    "select required attribute should be enabled");
+
+  element.removeAttribute('required');
+  element.setAttribute('required', '');
+  ok(element.required, "select required attribute should be enabled");
+  isnot(element.getAttribute('required'), null,
+    "select required attribute should be enabled");
+
+  element.removeAttribute('required');
+  ok(!element.required, "select required attribute should be disabled");
+  is(element.getAttribute('required'), null,
+    "select required attribute should be disabled");
+}
+
+function checkRequiredAndOptionalSelectors(element)
+{
+  is(document.querySelector("select:optional"), element,
+     "select should be optional");
+  is(document.querySelector("select:required"), null,
+     "select shouldn't be required");
+
+  element.required = true;
+
+  is(document.querySelector("select:optional"), null,
+     "select shouldn't be optional");
+  is(document.querySelector("select:required"), element,
+     "select should be required");
+
+  element.required = false;
+}
+
+function checkInvalidWhenValueMissing(element)
+{
+  checkNotSufferingFromBeingMissing(select);
+
+  element.required = true;
+  checkSufferingFromBeingMissing(select);
+
+  /**
+   * Non-multiple and size=1.
+   */
+  select.appendChild(new Option());
+  checkSufferingFromBeingMissing(select);
+
+  // When removing the required attribute, element should not be invalid.
+  element.required = false;
+  checkNotSufferingFromBeingMissing(select);
+
+  element.required = true;
+  select.options[0].textContent = "foo";
+  // TODO: having that working would require us to add a mutation observer on
+  // the select element.
+  checkNotSufferingFromBeingMissing(select, true);
+
+  select.remove(0);
+  checkSufferingFromBeingMissing(select);
+
+  select.add(new Option("foo", "foo"), null);
+  checkNotSufferingFromBeingMissing(select);
+
+  select.add(new Option(), null);
+  checkNotSufferingFromBeingMissing(select);
+
+  // The placeholder label can only be the first option, so a selected empty second option is valid
+  select.options[1].selected = true;
+  checkNotSufferingFromBeingMissing(select);
+
+  select.selectedIndex = 0;
+  checkNotSufferingFromBeingMissing(select);
+
+  select.add(select.options[0]);
+  select.selectedIndex = 0;
+  checkSufferingFromBeingMissing(select);
+
+  select.remove(0);
+  checkNotSufferingFromBeingMissing(select);
+
+  select.options[0].disabled = true;
+  // TODO: having that working would require us to add a mutation observer on
+  // the select element.
+  checkSufferingFromBeingMissing(select, true);
+
+  select.options[0].disabled = false
+  select.remove(0);
+  checkSufferingFromBeingMissing(select);
+
+  var option = new Option("foo", "foo");
+  option.disabled = true;
+  select.add(option, null);
+  select.add(new Option("bar"), null);
+  option.selected = true;
+  checkNotSufferingFromBeingMissing(select);
+
+  select.remove(0);
+  select.remove(0);
+
+  /**
+   * Non-multiple and size > 1.
+   * Everything should be the same except moving the selection.
+   */
+  select.multiple = false;
+  select.size = 4;
+  checkSufferingFromBeingMissing(select);
+
+  // Setting defaultSelected to true should not make the option selected
+  select.add(new Option("", "", true), null);
+  checkSufferingFromBeingMissing(select);
+  select.remove(0);
+
+  select.add(new Option("", "", true, true), null);
+  checkNotSufferingFromBeingMissing(select);
+
+  select.add(new Option("foo", "foo"), null);
+  select.remove(0);
+  checkSufferingFromBeingMissing(select);
+
+  select.options[0].selected = true;
+  checkNotSufferingFromBeingMissing(select);
+
+  select.remove(0);
+
+  /**
+   * Multiple, any size.
+   * We can select more than one element and at least needs a value.
+   */
+  select.multiple = true;
+  select.size = 4;
+  checkSufferingFromBeingMissing(select);
+
+  select.add(new Option("", "", true), null);
+  checkSufferingFromBeingMissing(select);
+
+  select.add(new Option("", "", true), null);
+  checkSufferingFromBeingMissing(select);
+
+  select.add(new Option("foo"), null);
+  checkSufferingFromBeingMissing(select);
+
+  select.options[2].selected = true;
+  checkNotSufferingFromBeingMissing(select);
+}
+
+var select = document.createElement("select");
+var content = document.getElementById('content');
+content.appendChild(select);
+
+checkRequiredAttribute(select);
+checkRequiredAndOptionalSelectors(select);
+checkInvalidWhenValueMissing(select);
+
+</script>
+</pre>
+</body>
+</html>