1 files changed, 52 insertions, 0 deletions
diff --git a/devtools/client/inspector/markup/test/browser_markup_shadowdom_shadowroot_mode.js b/devtools/client/inspector/markup/test/browser_markup_shadowdom_shadowroot_mode.js
new file mode 100644
index 0000000000..fb98b7cb35
--- /dev/null
+++ b/devtools/client/inspector/markup/test/browser_markup_shadowdom_shadowroot_mode.js
@@ -0,0 +1,52 @@
+/* Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Test that the shadow root mode is displayed properly
+
+const TEST_URL = `data:text/html;charset=utf-8,
+  <closed-component></closed-component>
+  <open-component></open-component>
+
+  <script>
+    'use strict';
+
+    customElements.define("closed-component", class extends HTMLElement {
+      constructor() {
+        super();
+        this.attachShadow({mode: "closed"});
+      }
+    });
+
+    customElements.define("open-component", class extends HTMLElement {
+      constructor() {
+        super();
+        this.attachShadow({ mode: "open" });
+      }
+    });
+  </script>
+`;
+
+add_task(async function () {
+  const { inspector } = await openInspectorForURL(TEST_URL);
+  const { markup } = inspector;
+
+  info("Find and expand the closed-component shadow DOM host.");
+  const closedHostFront = await getNodeFront("closed-component", inspector);
+  const closedHostContainer = markup.getContainer(closedHostFront);
+  await expandContainer(inspector, closedHostContainer);
+
+  info("Check the shadow root mode");
+  const closedShadowRootContainer = closedHostContainer.getChildContainers()[0];
+  assertContainerHasText(closedShadowRootContainer, "#shadow-root (closed)");
+
+  info("Find and expand the open-component shadow DOM host.");
+  const openHostFront = await getNodeFront("open-component", inspector);
+  const openHostContainer = markup.getContainer(openHostFront);
+  await expandContainer(inspector, openHostContainer);
+
+  info("Check the shadow root mode");
+  const openShadowRootContainer = openHostContainer.getChildContainers()[0];
+  assertContainerHasText(openShadowRootContainer, "#shadow-root (open)");
+});