Bug 1563275 - make dynamically inserted slotted elements accessible r=Jamie

Differential Revision: https://phabricator.services.mozilla.com/D36919

--HG--
extra : moz-landing-system : lando

accessible/base/TreeWalker.cpp

@@ -106,6 +106,15 @@ bool TreeWalker::Seek(nsIContent* aChildNode) {
                      ? childNode->GetParentNode()
                      : childNode->GetFlattenedTreeParent();
 
+    // Handle the special case of XBL binding child under a shadow root.
+    if (parentNode && parentNode->IsShadowRoot()) {
+      parentNode = childNode->GetFlattenedTreeParent();
+      if (parentNode == mAnchorNode) {
+        return true;
+      }
+      continue;
+    }
+
     if (!parentNode || !parentNode->IsElement()) {
       return false;
     }

accessible/tests/browser/tree/browser.ini

@@ -7,3 +7,4 @@ support-files =
 
 [browser_aria_owns.js]
 skip-if = true || (verify && !debug && (os == 'linux')) #Bug 1445513
+[browser_shadowdom.js]

accessible/tests/browser/tree/browser_shadowdom.js

@@ -0,0 +1,40 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const REORDER = { expected: [[EVENT_REORDER, "container"]] };
+
+// Dynamically inserted slotted accessible elements should be in
+// the accessible tree.
+const snippet = `
+<script>
+customElements.define("x-el", class extends HTMLElement {
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+    this.shadowRoot.innerHTML =
+      "<div role='presentation'><slot></slot></div>";
+  }
+});
+</script>
+<x-el id="container" role="group"><label id="l1">label1</label></x-el>
+`;
+addAccessibleTask(snippet,
+  async function(browser, accDoc) {
+    let container = findAccessibleChildByID(accDoc, "container");
+
+    testChildrenIds(container, ["l1"]);
+
+    await contentSpawnMutation(browser, REORDER, function() {
+      let labelEl = content.document.createElement("label");
+      labelEl.id = "l2";
+
+      let containerEl = content.document.getElementById("container");
+      containerEl.appendChild(labelEl);
+    });
+
+    testChildrenIds(container, ["l1", "l2"]);
+  }
+);