Merge pull request #11568 from jibees/11069-buu-fully-update-the-details-of-my-products-and-variants-1

🚧 [BUU] Add `Edit` link into a small menu on the last Actions column to the right of the table

spec/javascripts/stimulus/vertical_ellipsis_menu_controller_test.js

@@ -0,0 +1,48 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import { Application } from "stimulus";
+import vertical_ellipsis_menu_controller from "../../../app/webpacker/controllers/vertical_ellipsis_menu_controller";
+
+describe("VerticalEllipsisMenuController test", () => {
+  beforeAll(() => {
+    const application = Application.start();
+    application.register("vertical-ellipsis-menu", vertical_ellipsis_menu_controller);
+  });
+
+  beforeEach(() => {
+    document.body.innerHTML = `
+      <div data-controller="vertical-ellipsis-menu" id="root">
+        <div data-action="click->vertical-ellipsis-menu#toggle" id="button">...</div>
+        <div data-vertical-ellipsis-menu-target="content" id="content">
+          
+        </div>
+      </div>
+    `;
+    const button = document.getElementById("button");
+    const content = document.getElementById("content");
+  });
+
+  it("add show class to content when toggle is called", () => {
+    expect(content.classList.contains("show")).toBe(false);
+    button.click();
+    expect(content.classList.contains("show")).toBe(true);
+  });
+
+
+  it("remove show class from content when clicking button", () => {
+    button.click();
+    expect(content.classList.contains("show")).toBe(true);
+    button.click();
+    expect(content.classList.contains("show")).toBe(false);
+  });
+
+  
+  it("remove show class from content when clicking outside", () => {
+    button.click();
+    expect(content.classList.contains("show")).toBe(true);
+    document.body.click();
+    expect(content.classList.contains("show")).toBe(false);
+  });
+});