Implement `selectedIndex` IDL attribute on `HTMLOptionsCollection`.

components/script/dom/htmloptionscollection.rs

@@ -6,6 +6,7 @@ use dom::bindings::codegen::Bindings::ElementBinding::ElementMethods;
 use dom::bindings::codegen::Bindings::HTMLCollectionBinding::HTMLCollectionMethods;
 use dom::bindings::codegen::Bindings::HTMLOptionsCollectionBinding;
 use dom::bindings::codegen::Bindings::HTMLOptionsCollectionBinding::HTMLOptionsCollectionMethods;
+use dom::bindings::codegen::Bindings::HTMLSelectElementBinding::HTMLSelectElementMethods;
 use dom::bindings::codegen::Bindings::NodeBinding::NodeBinding::NodeMethods;
 use dom::bindings::codegen::UnionTypes::{HTMLOptionElementOrHTMLOptGroupElement, HTMLElementOrLong};
 use dom::bindings::error::{Error, ErrorResult};
@@ -16,6 +17,7 @@ use dom::bindings::str::DOMString;
 use dom::element::Element;
 use dom::htmlcollection::{CollectionFilter, HTMLCollection};
 use dom::htmloptionelement::HTMLOptionElement;
+use dom::htmlselectelement::HTMLSelectElement;
 use dom::node::{document_from_node, Node};
 use dom::window::Window;
 
@@ -182,4 +184,22 @@ impl HTMLOptionsCollectionMethods for HTMLOptionsCollection {
             element.Remove();
         }
     }
+
+    // https://html.spec.whatwg.org/multipage/#dom-htmloptionscollection-selectedindex
+    fn SelectedIndex(&self) -> i32 {
+        self.upcast()
+            .root_node()
+            .downcast::<HTMLSelectElement>()
+            .expect("HTMLOptionsCollection not rooted on a HTMLSelectElement")
+            .SelectedIndex()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-htmloptionscollection-selectedindex
+    fn SetSelectedIndex(&self, index: i32) {
+        self.upcast()
+            .root_node()
+            .downcast::<HTMLSelectElement>()
+            .expect("HTMLOptionsCollection not rooted on a HTMLSelectElement")
+            .SetSelectedIndex(index)
+    }
 }

components/script/dom/webidls/HTMLOptionsCollection.webidl

@@ -14,5 +14,5 @@ interface HTMLOptionsCollection : HTMLCollection {
   void add((HTMLOptionElement or HTMLOptGroupElement) element, optional (HTMLElement or long)? before = null);
   //[CEReactions]
   void remove(long index);
-  //attribute long selectedIndex;
+  attribute long selectedIndex;
 };

tests/wpt/metadata/MANIFEST.json

    "testharness"
   ],
   "html/semantics/forms/the-select-element/selected-index.html": [
-   "3ab30abb683f3fb42b6fdc84555126379d472a3d",
+   "0753a7487a10bde3b879d4c2ed10ba3d0260a48a",
    "testharness"
   ],
   "html/semantics/forms/the-textarea-element/.gitkeep": [

tests/wpt/metadata/html/dom/interfaces.html.ini

@@ -720,18 +720,12 @@
   [HTMLCollection interface: calling namedItem(DOMString) on document.all with too few arguments must throw TypeError]
     expected: FAIL
 
-  [HTMLOptionsCollection interface: attribute selectedIndex]
-    expected: FAIL
-
   [HTMLOptionsCollection interface: document.createElement("select").options must inherit property "add" with the proper type (3)]
     expected: FAIL
 
   [HTMLOptionsCollection interface: document.createElement("select").options must inherit property "remove" with the proper type (4)]
     expected: FAIL
 
-  [HTMLOptionsCollection interface: document.createElement("select").options must inherit property "selectedIndex" with the proper type (5)]
-    expected: FAIL
-
   [HTMLPropertiesCollection interface: existence and properties of interface object]
     expected: FAIL
 
@@ -9723,9 +9717,6 @@
   [Navigator interface: window.navigator must inherit property "hardwareConcurrency" with the proper type (22)]
     expected: FAIL
 
-  [HTMLOptionsCollection interface: document.createElement("select").options must inherit property "selectedIndex" with the proper type (4)]
-    expected: FAIL
-
   [HTMLEmbedElement interface: document.createElement("embed") must inherit property "align" with the proper type (5)]
     expected: FAIL
 

tests/wpt/web-platform-tests/html/semantics/forms/the-select-element/selected-index.html

@@ -28,46 +28,76 @@
 </form>
 
 <script>
+function assertSelectedIndex(select, value) {
+  assert_equals(select.selectedIndex, value);
+  assert_equals(select.options.selectedIndex, value);
+}
+
 test(function () {
   var select = document.getElementById('empty');
-  assert_equals(select.selectedIndex, -1);
+  assertSelectedIndex(select, -1);
 }, "get empty");
 
 test(function () {
   var select = document.getElementById('default');
-  assert_equals(select.selectedIndex, 0);
+  assertSelectedIndex(select, 0);
 }, "get default");
 
 test(function () {
   var select = document.getElementById('disabled');
-  assert_equals(select.selectedIndex, 1);
+  assertSelectedIndex(select, 1);
 }, "get disabled");
 
 test(function () {
   var select = document.getElementById('selected');
-  assert_equals(select.selectedIndex, 1);
+  assertSelectedIndex(select, 1);
 }, "get unselected");
 
 test(function () {
   var select = document.getElementById('empty');
   select.selectedIndex = 1;
-  assert_equals(select.selectedIndex, -1);
-}, "set empty");
+  assertSelectedIndex(select, -1);
+}, "set empty (HTMLSelectElement)");
+
+test(function () {
+  var select = document.getElementById('empty');
+  select.options.selectedIndex = 1;
+  assertSelectedIndex(select, -1);
+}, "set empty (HTMLOptionsCollection)");
 
 test(function () {
   var select = document.getElementById('default');
-  assert_equals(select.selectedIndex, 0);
+  assertSelectedIndex(select, 0);
   select.selectedIndex = 2;
-  assert_equals(select.selectedIndex, 2);
-}, "set");
+  assertSelectedIndex(select, 2);
+  this.add_cleanup(() => select.selectedIndex = 0);
+}, "set (HTMLSelectElement)");
+
+test(function () {
+  var select = document.getElementById('default');
+  assertSelectedIndex(select, 0);
+  select.options.selectedIndex = 2;
+  assertSelectedIndex(select, 2);
+  this.add_cleanup(() => select.selectedIndex = 0);
+}, "set (HTMLOptionsCollection)");
 
 test(function () {
   var select = document.getElementById('selected');
   var form = document.getElementById('form');
-  assert_equals(select.selectedIndex, 1);
+  assertSelectedIndex(select, 1);
   select.selectedIndex = 0;
-  assert_equals(select.selectedIndex, 0);
+  assertSelectedIndex(select, 0);
+  form.reset();
+  assertSelectedIndex(select, 1);
+}, "set and reset (HTMLSelectElement)");
+
+test(function () {
+  var select = document.getElementById('selected');
+  var form = document.getElementById('form');
+  assertSelectedIndex(select, 1);
+  select.options.selectedIndex = 0;
+  assertSelectedIndex(select, 0);
   form.reset();
-  assert_equals(select.selectedIndex, 1);
-}, "set and reset");
+  assertSelectedIndex(select, 1);
+}, "set and reset (HTMLOptionsCollection)");
 </script>