Sytem specs + controller spec

- controller spec is lighter since it is based on an html element
This commit is contained in:
cyrillefr
2024-02-25 16:40:44 +01:00
parent 428b9b273c
commit b08623df23
3 changed files with 23 additions and 48 deletions

View File

@@ -13,13 +13,20 @@ describe("Dropdown controller", () => {
describe("Controller", () => {
beforeEach(() => {
document.body.innerHTML = `<div data-controller="dropdown" id="container">
<span id="dropdown" data-action="click->dropdown#toggle">
<span id="arrow" data-dropdown-target="arrow" data-expanded-class="expandedClass expandedCLass2" data-collapsed-class="collapsedClass" />
</span>
<div id="menu" data-dropdown-target="menu" >
</div>
document.body.innerHTML = `<div id="container">
<details data-controller="dropdown" id="dropdown">
<summary id='summary'>
<span class="icon-reorder">
Actions
</span>
</summary>
<div id = "menu" class="menu" data-action="click->dropdown#closeOnMenu">
<div class="menu_item">
<span>Item 1</span>
<span>Item 2</span>
</div>
</div>
</details>
</div>`;
});
@@ -27,48 +34,15 @@ describe("Dropdown controller", () => {
document.body.innerHTML = "";
});
it("hide menu by default", () => {
const menu = document.getElementById("menu");
expect(menu.classList.contains("hidden")).toBe(true);
});
it("show menu when toggle and add/remove class on arrow", () => {
const dropdown = document.getElementById("dropdown");
const arrow = document.getElementById("arrow");
const menu = document.getElementById("menu");
expect(menu.classList.contains("hidden")).toBe(true);
expect(arrow.classList.contains("expandedClass")).toBe(false);
expect(arrow.classList.contains("expandedClass2")).toBe(false);
expect(arrow.classList.contains("collapsedClass")).toBe(true);
dropdown.click();
expect(menu.classList.contains("hidden")).toBe(false);
expect(arrow.classList.contains("expandedClass")).toBe(true);
expect(arrow.classList.contains("expandedCLass2")).toBe(true);
expect(arrow.classList.contains("collapsedClass")).toBe(false);
});
it ("hide menu when click outside", () => {
const dropdown = document.getElementById("dropdown");
const menu = document.getElementById("menu");
dropdown.click();
expect(menu.classList.contains("hidden")).toBe(false);
//open the details
dropdown.toggleAttribute('open')
//click elsewhere
document.body.click();
expect(menu.classList.contains("hidden")).toBe(true);
});
it ("do not display menu when disabled", () => {
const dropdown = document.getElementById("dropdown");
const container = document.getElementById("container");
const menu = document.getElementById("menu");
container.classList.add("disabled");
dropdown.click();
expect(menu.classList.contains("hidden")).toBe(true);
expect(dropdown.open).toBe(false);
});
});
});

View File

@@ -719,7 +719,7 @@ describe '
it "should not display links but a js alert" do
visit spree.edit_admin_order_path(order)
find("#links-dropdown .ofn-drop-down").click
find("#links-dropdown .ofn-drop-down details").click
expect(page).to have_link "Send Invoice", href: "#"
expect(page).to have_link "Print Invoice", href: "#"
@@ -729,7 +729,7 @@ describe '
expect(message)
.to eq "#{distributor1.name} must have a valid ABN before invoices can be used."
find("#links-dropdown .ofn-drop-down").click
find("#links-dropdown .ofn-drop-down details").click
message = accept_prompt do
click_link "Send Invoice"
end

View File

@@ -497,8 +497,9 @@ describe '
expect(page.find(
"#listing_orders tbody tr td:first-child input[type=checkbox]"
)).to_not be_checked
# disables print invoices button
page.find("span.icon-reorder", text: "ACTIONS").click
# disables print invoices button not clickable
expect { find("span.icon-reorder", text: "ACTIONS").click }
.to raise_error(Capybara::Cuprite::MouseEventFailed)
expect(page).to_not have_content "Print Invoices"
end
end