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);
+  });
+});

spec/system/admin/products_v3/products_spec.rb

@@ -157,6 +157,36 @@ describe 'As an admin, I can see the new product page' do
     end
   end
 
+  describe "Actions columns (edit)" do
+    let!(:variant_a1) {
+      create(:variant,
+             product: product_a,
+             display_name: "Medium box",
+             sku: "APL-01",
+             price: 5.25)
+    }
+    let!(:product_a) { create(:simple_product, name: "Apples", sku: "APL-00") }
+
+    before do
+      visit admin_products_v3_index_url
+    end
+
+    it "shows an actions memu with an edit link when clicking on icon for product" do
+      within row_containing_name("Apples") do
+        page.find(".vertical-ellipsis-menu").click
+        expect(page).to have_link "Edit", href: spree.edit_admin_product_path(product_a)
+      end
+    end
+
+    it "shows an actions memu with an edit link when clicking on icon for variant" do
+      within row_containing_name("Medium box") do
+        page.find(".vertical-ellipsis-menu").click
+        expect(page).to have_link "Edit",
+                                  href: spree.edit_admin_product_variant_path(product_a, variant_a1)
+      end
+    end
+  end
+
   describe "updating" do
     let!(:variant_a1) {
       create(:variant,