Fix Menu showing behind Drawer (#3639)

Co-authored-by: Fernanda Castillo <[email protected]>❤️
jpmorganchase · Jun 26, 2024 · db527bc · db527bc
1 parent ad6f7b4
commit db527bc
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/.changeset/twelve-pets-poke.md b/.changeset/twelve-pets-poke.md
@@ -0,0 +1,5 @@
+---
+"@salt-ds/core": patch
+---
+
+Fixed Menu showing behind Drawer (#3636).
diff --git a/packages/core/src/__tests__/__e2e__/menu/Menu.cy.tsx b/packages/core/src/__tests__/__e2e__/menu/Menu.cy.tsx
@@ -12,6 +12,9 @@ describe("Given a Menu", () => {
     cy.findByRole("menu").should("not.exist");
     cy.findByRole("button", { name: "Open Menu" }).realClick();
     cy.findByRole("menu").should("exist");
+    // Regression - #3636
+    cy.get(".saltMenuPanel").should("have.css", "z-index", "1500");
+
     cy.get("@openChangeSpy").should("have.been.calledWith", true);
     cy.findByRole("menuitem", { name: "Copy" }).realClick();
     cy.on("window:alert", (str) => {

diff --git a/packages/core/src/menu/MenuPanel.css b/packages/core/src/menu/MenuPanel.css
@@ -5,7 +5,7 @@
   overflow-y: auto;
   min-width: 10em;
   position: relative;
-  z-index: var(--salt-zIndex-popout);
+  z-index: var(--salt-zIndex-flyover);
   box-shadow: var(--salt-overlayable-shadow-popout);
   box-sizing: border-box;
 }