1 files changed, 36 insertions, 0 deletions
diff --git a/devtools/client/inspector/test/browser_inspector_pane-toggle-01.js b/devtools/client/inspector/test/browser_inspector_pane-toggle-01.js
new file mode 100644
index 0000000000..e5335c3e93
--- /dev/null
+++ b/devtools/client/inspector/test/browser_inspector_pane-toggle-01.js
@@ -0,0 +1,36 @@
+/* Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Tests that the inspector panel has a 3 pane toggle button, and that
+// this button is visible both in BOTTOM and SIDE hosts.
+
+add_task(async function () {
+  info("Switch to 2 pane inspector to test the 3 pane toggle button behavior");
+  await pushPref("devtools.inspector.three-pane-enabled", false);
+
+  info("Open the inspector in a bottom toolbox host");
+  const { inspector, toolbox } = await openInspectorForURL(
+    "about:blank",
+    "bottom"
+  );
+
+  const button = inspector.panelDoc.querySelector(".sidebar-toggle");
+  ok(button, "The toggle button exists in the DOM");
+  ok(button.getAttribute("title"), "The title tooltip has initial state");
+  ok(
+    button.classList.contains("pane-collapsed"),
+    "The button is in collapsed state"
+  );
+  ok(!!button.getClientRects().length, "The button is visible");
+
+  info("Switch the host to the right");
+  await toolbox.switchHost("right");
+
+  ok(!!button.getClientRects().length, "The button is still visible");
+  ok(
+    button.classList.contains("pane-collapsed"),
+    "The button is still in collapsed state"
+  );
+});