Bug 1535438 - Remove Shadow DOM v0 APIs. r=smaug
authorEmilio Cobos Álvarez <emilio@crisal.io>
Sat, 16 Mar 2019 00:14:57 +0000
changeset 464676 fbfeb6efec16dc63340328ac30946c25d35aead8
parent 464675 8c6fc5c010f4409df097cf5fa2f34fa03b3de279
child 464677 2f4bd03bfc3568c8fb27667efb9a63dbaebf9d0f
push id112465
push useraciure@mozilla.com
push dateSun, 17 Mar 2019 09:50:10 +0000
treeherdermozilla-inbound@e0861be8d6c0 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerssmaug
bugs1535438
milestone67.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1535438 - Remove Shadow DOM v0 APIs. r=smaug Looks like these three APIs slipped through when shipping v1, but no other vendor supports them, so no reason to be here. I don't think there's any harm in letting the implementations keep living in DocumentOrShadowRoot, but let me know if you think otherwise and I'll move them to Document. Differential Revision: https://phabricator.services.mozilla.com/D23577
dom/base/test/file_bug1453693.html
dom/html/test/forms/test_input_datetime_hidden.html
dom/html/test/forms/test_input_datetime_tabindex.html
dom/html/test/forms/test_interactive_content_in_label.html
dom/html/test/forms/test_interactive_content_in_summary.html
dom/tests/mochitest/webcomponents/test_shadowroot.html
dom/webidl/ShadowRoot.webidl
--- a/dom/base/test/file_bug1453693.html
+++ b/dom/base/test/file_bug1453693.html
@@ -795,36 +795,36 @@
         }
 
         var input = document.createElement("input");
         document.body.appendChild(host1);
         document.body.appendChild(input);
         document.body.offsetLeft;
 
         // Test shadow tree which doesn't have anything tab-focusable.
-        host1.shadowRoot.getElementsByTagName("div")[0].focus();
+        host1.shadowRoot.querySelector("div").focus();
         synthesizeKey("KEY_Tab");
         is(document.activeElement, input, "Should have focused input element.");
         synthesizeKey("KEY_Tab", {shiftKey: true});
         opener.is(document.activeElement, document.body.firstChild, "body's first child should have focus.");
 
         // Same test but with focusable elements in the tree...
         var input2 = document.createElement("input");
         var host2 = host1.firstChild;
         var host3 = host2.firstChild;
         host2.insertBefore(input2, host3);
         var input3 = document.createElement("input");
         lastHost.appendChild(input3);
         document.body.offsetLeft;
-        host3.shadowRoot.getElementsByTagName("div")[0].focus();
+        host3.shadowRoot.querySelector("div").focus();
         synthesizeKey("KEY_Tab");
         is(document.activeElement, input3, "Should have focused input3 element.");
 
         // ...and backwards
-        host3.shadowRoot.getElementsByTagName("div")[0].focus();
+        host3.shadowRoot.querySelector("div").focus();
         synthesizeKey("KEY_Tab", {shiftKey: true});
         is(document.activeElement, input2, "Should have focused input2 element.");
 
         // Remove elements added to body element.
         host1.remove();
         input.remove();
 
         // Tests expect body.firstChild to have focus.
--- a/dom/html/test/forms/test_input_datetime_hidden.html
+++ b/dom/html/test/forms/test_input_datetime_hidden.html
@@ -16,17 +16,17 @@ https://bugzilla.mozilla.org/show_bug.cg
   <input id="date" type="date" hidden value="1947-02-28">
 </div>
 <pre id="test">
 <script type="application/javascript">
 
 let el = document.getElementById("date");
 ok(el.hidden, "element is hidden");
 is(el.value, "1947-02-28", ".value is set correctly");
-let fieldElements = Array.from(SpecialPowers.wrap(el).openOrClosedShadowRoot.getElementsByClassName("datetime-edit-field"));
+let fieldElements = Array.from(SpecialPowers.wrap(el).openOrClosedShadowRoot.querySelectorAll(".datetime-edit-field"));
 is(fieldElements[0].textContent, "02", "month is set");
 is(fieldElements[1].textContent, "28", "day is set");
 is(fieldElements[2].textContent, "1947", "year is set");
 
 </script>
 </pre>
 </body>
 </html>
--- a/dom/html/test/forms/test_input_datetime_tabindex.html
+++ b/dom/html/test/forms/test_input_datetime_tabindex.html
@@ -30,17 +30,17 @@ https://bugzilla.mozilla.org/show_bug.cg
  **/
 SimpleTest.waitForExplicitFinish();
 SimpleTest.waitForFocus(function() {
   test();
   SimpleTest.finish();
 });
 
 function checkInnerTextboxTabindex(input, tabindex) {
-  let fields = SpecialPowers.wrap(input).openOrClosedShadowRoot.getElementsByClassName("datetime-edit-field");
+  let fields = SpecialPowers.wrap(input).openOrClosedShadowRoot.querySelectorAll(".datetime-edit-field");
 
   for (let field of fields) {
     is(field.tabIndex, tabindex, "tabIndex in the inner textbox should be correct");
   }
 
 }
 
 function testTabindex(type) {
--- a/dom/html/test/forms/test_interactive_content_in_label.html
+++ b/dom/html/test/forms/test_interactive_content_in_label.html
@@ -60,18 +60,18 @@ var target = document.getElementById("ta
 
 var yes_nodes = Array.from(document.getElementsByClassName("yes"));
 
 var root1 = document.getElementById("root1");
 root1.attachShadow({ mode: "open" }).innerHTML = "<button class=yes>button in shadow tree</button>";
 var root2 = document.getElementById("root2");
 root2.attachShadow({ mode: "open" }).innerHTML = "<div class=yes>text in shadow tree</div>";
 var yes_nodes_in_shadow_tree =
-  Array.from(root1.shadowRoot.getElementsByClassName("yes")).concat(
-    Array.from(root2.shadowRoot.getElementsByClassName("yes")));
+  Array.from(root1.shadowRoot.querySelectorAll(".yes")).concat(
+    Array.from(root2.shadowRoot.querySelectorAll(".yes")));
 
 var no_nodes = Array.from(document.getElementsByClassName("no"));
 
 var target_clicked = false;
 target.addEventListener("click", function() {
   target_clicked = true;
 });
 
--- a/dom/html/test/forms/test_interactive_content_in_summary.html
+++ b/dom/html/test/forms/test_interactive_content_in_summary.html
@@ -58,18 +58,18 @@ var details = document.getElementById("d
 
 var yes_nodes = Array.from(document.getElementsByClassName("yes"));
 
 var root1 = document.getElementById("root1");
 root1.attachShadow({ mode: "open" }).innerHTML = "<button class=yes>button in shadow tree</button>";
 var root2 = document.getElementById("root2");
 root2.attachShadow({ mode: "open" }).innerHTML = "<div class=yes>text in shadow tree</div>";
 var yes_nodes_in_shadow_tree =
-  Array.from(root1.shadowRoot.getElementsByClassName("yes")).concat(
-    Array.from(root2.shadowRoot.getElementsByClassName("yes")));
+  Array.from(root1.shadowRoot.querySelectorAll(".yes")).concat(
+    Array.from(root2.shadowRoot.querySelectorAll(".yes")));
 
 var no_nodes = Array.from(document.getElementsByClassName("no"));
 
 var node;
 for (node of yes_nodes) {
   details.removeAttribute('open');
   node.click();
   ok(!details.hasAttribute('open'),
--- a/dom/tests/mochitest/webcomponents/test_shadowroot.html
+++ b/dom/tests/mochitest/webcomponents/test_shadowroot.html
@@ -34,35 +34,21 @@ createIframe(content)
     ok(!shadow.getElementById("svgmovedtoshadow"), "SVG element not in ShadowRoot should not be accessible from ShadowRoot API.");
     shadow.appendChild(inShadowEl);
     shadow.appendChild(inShadowSVGEl);
     is(shadow.getElementById("movedtoshadow"), inShadowEl, "Element appended to a ShadowRoot should be accessible from ShadowRoot API.");
     ok(!aDocument.getElementById("movedtoshadow"), "Element appended to a ShadowRoot should not be accessible from document.");
     is(shadow.getElementById("svgmovedtoshadow"), inShadowSVGEl, "SVG element appended to a ShadowRoot should be accessible from ShadowRoot API.");
     ok(!aDocument.getElementById("svgmovedtoshadow"), "SVG element appended to a ShadowRoot should not be accessible from document.");
 
-    // Test getElementsByClassName
-    is(aDocument.getElementsByClassName("testclass").length, 0, "Element removed from DOM should not be accessible by DOM accessors.");
-    is(shadow.getElementsByClassName("testclass").length, 1, "Element added to ShadowRoot should be accessible by ShadowRoot API.");
-
-    // Test getElementsByTagName{NS}
-    is(aDocument.getElementsByTagName("div").length, 0, "Element removed from DOM should not be accessible from DOM accessors.");
-    is(shadow.getElementsByTagName("div").length, 1, "Elements in the ShadowRoot should be accessible from the ShadowRoot API.");
-    is(aDocument.getElementsByTagName("svg").length, 0, "SVG elements removed from DOM should not be accessible from DOM accessors.");
-    is(shadow.getElementsByTagName("svg").length, 1, "SVG element in the ShadowRoot should be accessible from the ShadowRoot API.");
-    is(shadow.getElementsByTagNameNS("http://www.w3.org/2000/svg", "svg").length, 1, "SVG element in the ShadowRoot should be accessible from the ShadowRoot API.");
-
     // Remove elements from ShadowRoot and make sure that they are no longer accessible via the ShadowRoot API.
     shadow.removeChild(inShadowEl);
     shadow.removeChild(inShadowSVGEl);
     ok(!shadow.getElementById("movedtoshadow"), "ShadowRoot API should not be able to access elements removed from ShadowRoot.");
     ok(!shadow.getElementById("svgmovedtoshadow"), "ShadowRoot API should not be able to access elements removed from ShadowRoot.");
-    is(shadow.getElementsByClassName("testclass").length, 0, "ShadowRoot getElementsByClassName should not be able to access elements removed from ShadowRoot.");
-    is(shadow.getElementsByTagName("svg").length, 0, "ShadowRoot getElementsByTagName should not be able to access elements removed from ShadowRoot.");
-    is(shadow.getElementsByTagNameNS("http://www.w3.org/2000/svg", "svg").length, 0, "ShadowRoot getElementsByTagNameNS should not be able to access elements removed from ShadowRoot.");
 
     // Test querySelector on element in a ShadowRoot.
     element = aDocument.createElement("div");
     shadow = element.attachShadow({mode: "open"});
     var parentDiv = aDocument.createElement("div");
     var childSpan = aDocument.createElement("span");
     childSpan.id = "innerdiv";
     parentDiv.appendChild(childSpan);
--- a/dom/webidl/ShadowRoot.webidl
+++ b/dom/webidl/ShadowRoot.webidl
@@ -18,21 +18,18 @@ enum ShadowRootMode {
 
 // https://dom.spec.whatwg.org/#shadowroot
 interface ShadowRoot : DocumentFragment
 {
   // Shadow DOM v1
   readonly attribute ShadowRootMode mode;
   readonly attribute Element host;
 
-  // [deprecated] Shadow DOM v0
   Element? getElementById(DOMString elementId);
-  HTMLCollection getElementsByTagName(DOMString localName);
-  HTMLCollection getElementsByTagNameNS(DOMString? namespace, DOMString localName);
-  HTMLCollection getElementsByClassName(DOMString classNames);
+
   [CEReactions, SetterThrows]
   attribute [TreatNullAs=EmptyString] DOMString innerHTML;
 
   // When JS invokes importNode or createElement, the binding code needs to
   // create a reflector, and so invoking those methods directly on the content
   // document would cause the reflector to be created in the content scope,
   // at which point it would be difficult to move into the UA Widget scope.
   // As such, these methods allow UA widget code to simultaneously create nodes