raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-01-24 20:36:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix all existing prettier issues

Browse Source
This commit is contained in:
David Rodríguez
2025-10-22 15:30:36 +02:00
parent 025f8b25b1
commit 852e7fa81e
64 changed files with 501 additions and 557 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
spec/javascripts/application_spec.js
View File

@@ -14,6 +14,6 @@
//= require handlebars
//= require jquery2
angular.module('templates', [])
angular.module('uiGmapgoogle-maps', []);
angular.module('duScroll', []);
angular.module("templates", []);
angular.module("uiGmapgoogle-maps", []);
angular.module("duScroll", []);

53
spec/javascripts/services/variant_unit_manager_test.js
View File

@@ -4,27 +4,33 @@
import VariantUnitManager from "../../../app/webpacker/js/services/variant_unit_manager";
describe("VariantUnitManager", function() {
describe("VariantUnitManager", function () {
let subject;
describe("with default units", function() {
describe("with default units", function () {
beforeAll(() => {
// Requires global var from page
global.ofn_available_units_sorted = {
"weight":{
"1.0":{"name":"g","system":"metric"},"28.35":{"name":"oz","system":"imperial"},"453.6":{"name":"lb","system":"imperial"},"1000.0":{"name":"kg","system":"metric"},"1000000.0":{"name":"T","system":"metric"}
weight: {
"1.0": { name: "g", system: "metric" },
28.35: { name: "oz", system: "imperial" },
453.6: { name: "lb", system: "imperial" },
"1000.0": { name: "kg", system: "metric" },
"1000000.0": { name: "T", system: "metric" },
},
"volume":{
"0.001":{"name":"mL","system":"metric"},"1.0":{"name":"L","system":"metric"},"1000.0":{"name":"kL","system":"metric"}
volume: {
0.001: { name: "mL", system: "metric" },
"1.0": { name: "L", system: "metric" },
"1000.0": { name: "kL", system: "metric" },
},
};
})
});
beforeEach(() => {
subject = new VariantUnitManager();
})
});
describe("getUnitName", function() {
it("returns the unit name based on the scale and unit type (weight/volume) provided", function() {
describe("getUnitName", function () {
it("returns the unit name based on the scale and unit type (weight/volume) provided", function () {
expect(subject.getUnitName(1, "weight")).toEqual("g");
expect(subject.getUnitName(1000, "weight")).toEqual("kg");
expect(subject.getUnitName(1000000, "weight")).toEqual("T");
@@ -36,8 +42,8 @@ describe("VariantUnitManager", function() {
});
});
describe("compatibleUnitScales", function() {
it("returns a sorted set of compatible scales based on the scale and unit type provided", function() {
describe("compatibleUnitScales", function () {
it("returns a sorted set of compatible scales based on the scale and unit type provided", function () {
expect(subject.compatibleUnitScales(1, "weight")).toEqual([1.0, 1000.0, 1000000.0]);
expect(subject.compatibleUnitScales(453.6, "weight")).toEqual([28.35, 453.6]);
expect(subject.compatibleUnitScales(0.001, "volume")).toEqual([0.001, 1.0, 1000.0]);
@@ -45,28 +51,31 @@ describe("VariantUnitManager", function() {
});
});
describe("should only load available units", function() {
describe("should only load available units", function () {
beforeAll(() => {
// Available units: "g,T,mL,L,kL,lb"
global.ofn_available_units_sorted = {
"weight":{
"1.0":{"name":"g","system":"metric"},"453.6":{"name":"lb","system":"imperial"},"1000000.0":{"name":"T","system":"metric"}
weight: {
"1.0": { name: "g", system: "metric" },
453.6: { name: "lb", system: "imperial" },
"1000000.0": { name: "T", system: "metric" },
},
"volume":{
"0.001":{"name":"mL","system":"metric"},"1.0":{"name":"L","system":"metric"},"1000.0":{"name":"kL","system":"metric"}
volume: {
0.001: { name: "mL", system: "metric" },
"1.0": { name: "L", system: "metric" },
"1000.0": { name: "kL", system: "metric" },
},
};
})
});
beforeEach(() => {
subject = new VariantUnitManager();
})
});
describe("compatibleUnitScales", function() {
it("returns a sorted set of compatible scales based on the scale and unit type provided", function() {
describe("compatibleUnitScales", function () {
it("returns a sorted set of compatible scales based on the scale and unit type provided", function () {
expect(subject.compatibleUnitScales(1, "weight")).toEqual([1.0, 1000000.0]);
expect(subject.compatibleUnitScales(453.6, "weight")).toEqual([453.6]);
});
});
});
});

4
spec/javascripts/stimulus/add_blank_to_link_controller_test.js
View File

@@ -17,8 +17,8 @@ describe("AddBlankToLink", () => {
});
it("adds target='_blank' to anchor tags", () => {
const anchorTag = document.querySelector('a')
expect(anchorTag.getAttribute('target')).toBe("_blank");
const anchorTag = document.querySelector("a");
expect(anchorTag.getAttribute("target")).toBe("_blank");
});
});
});

2
spec/javascripts/stimulus/checkbox_display_controller_test.js
View File

@@ -24,7 +24,7 @@ describe("CheckboxDisplayController", () => {
it("show the content if the checkbox is checked, hide content either", () => {
const checkbox = document.getElementById("checkbox");
const content = document.getElementById("content");
expect(content.style.display).toBe("none");
checkbox.click();

10
spec/javascripts/stimulus/checked_controller_test.js
View File

@@ -39,13 +39,13 @@ describe("CheckedController", () => {
expect(checkboxA.checked).toBe(false);
expect(checkboxB.checked).toBe(false);
selectAllCheckbox.click()
selectAllCheckbox.click();
expect(selectAllCheckbox.checked).toBe(true);
expect(checkboxA.checked).toBe(true);
expect(checkboxB.checked).toBe(true);
selectAllCheckbox.click()
selectAllCheckbox.click();
expect(selectAllCheckbox.checked).toBe(false);
expect(checkboxA.checked).toBe(false);
@@ -58,18 +58,18 @@ describe("CheckedController", () => {
const selectAllCheckbox = document.getElementById("selectAllCheckbox");
const checkboxA = document.getElementById("checkboxA");
const checkboxB = document.getElementById("checkboxB");
checkboxA.click()
checkboxA.click();
expect(selectAllCheckbox.checked).toBe(false);
expect(checkboxA.checked).toBe(true);
expect(checkboxB.checked).toBe(false);
checkboxB.click()
checkboxB.click();
expect(selectAllCheckbox.checked).toBe(true);
expect(checkboxA.checked).toBe(true);
expect(checkboxB.checked).toBe(true);
checkboxB.click()
checkboxB.click();
expect(selectAllCheckbox.checked).toBe(false);
expect(checkboxA.checked).toBe(true);

4
spec/javascripts/stimulus/dropdown_controller_test.js
View File

@@ -34,11 +34,11 @@ describe("Dropdown controller", () => {
document.body.innerHTML = "";
});
it ("hide menu when click outside", () => {
it("hide menu when click outside", () => {
const dropdown = document.getElementById("dropdown");
const menu = document.getElementById("menu");
//open the details
dropdown.toggleAttribute('open')
dropdown.toggleAttribute("open");
//click elsewhere
document.body.click();

1
spec/javascripts/stimulus/flash_controller_test.js
View File

@@ -15,7 +15,6 @@ describe("FlashController", () => {
document.body.innerHTML = `
<div id="element" data-controller='flash' data-flash-auto-close-value='true'></div>
`;
});
describe("autoClose", () => {

47
spec/javascripts/stimulus/help_modal_controller_test.js
View File

@@ -8,10 +8,10 @@ import help_modal_link_controller from "../../../app/webpacker/controllers/help_
expect.extend({
toBeVisible(element) {
if(element.className.includes("in") && element.style.display == "block") {
return { pass: true }
if (element.className.includes("in") && element.style.display == "block") {
return { pass: true };
} else {
return { pass: false }
return { pass: false };
}
},
});
@@ -21,7 +21,7 @@ describe("HelpModalController", () => {
const application = Application.start();
application.register("help-modal", help_modal_controller);
application.register("help-modal-link", help_modal_link_controller);
jest.useFakeTimers()
jest.useFakeTimers();
});
beforeEach(() => {
@@ -54,36 +54,36 @@ describe("HelpModalController", () => {
const modal = document.getElementById("modal");
const openLink = document.getElementById("open-link");
const closeLink = document.getElementById("close-link");
expect(document.body.className).not.toContain("modal-open")
expect(background).not.toBeVisible()
expect(modal).not.toBeVisible()
expect(document.body.className).not.toContain("modal-open");
expect(background).not.toBeVisible();
expect(modal).not.toBeVisible();
openLink.click();
jest.runAllTimers();
expect(document.body.className).toContain("modal-open")
expect(background).toBeVisible()
expect(modal).toBeVisible()
expect(document.body.className).toContain("modal-open");
expect(background).toBeVisible();
expect(modal).toBeVisible();
closeLink.click();
jest.runAllTimers();
expect(document.body.className).not.toContain("modal-open")
expect(background).not.toBeVisible()
expect(modal).not.toBeVisible()
expect(document.body.className).not.toContain("modal-open");
expect(background).not.toBeVisible();
expect(modal).not.toBeVisible();
});
it("closes when the escape key is pressed", () => {
const modal = document.getElementById("modal");
const openLink = document.getElementById("open-link");
openLink.click();
jest.runAllTimers()
expect(modal).toBeVisible()
jest.runAllTimers();
expect(modal).toBeVisible();
document.dispatchEvent(new KeyboardEvent('keyup', { 'code': 'Escape' }));
jest.runAllTimers()
document.dispatchEvent(new KeyboardEvent("keyup", { code: "Escape" }));
jest.runAllTimers();
expect(modal).not.toBeVisible()
expect(modal).not.toBeVisible();
});
it("closes when the background is clicked", () => {
@@ -91,13 +91,12 @@ describe("HelpModalController", () => {
const modal = document.getElementById("modal");
const openLink = document.getElementById("open-link");
openLink.click();
jest.runAllTimers()
expect(modal).toBeVisible()
jest.runAllTimers();
expect(modal).toBeVisible();
background.click()
jest.runAllTimers()
background.click();
jest.runAllTimers();
expect(modal).not.toBeVisible()
expect(modal).not.toBeVisible();
});
});

12
spec/javascripts/stimulus/popout_controller_test.js
View File

@@ -57,7 +57,7 @@ describe("PopoutController", () => {
// For some reason this has to be in a separate block
beforeEach(() => {
button.dispatchEvent(new Event("click")); // Dialog is open
})
});
it("closes the dialog when click outside", () => {
input4.click();
@@ -97,7 +97,7 @@ describe("PopoutController", () => {
});
it("doesn't close the dialog when a field is invalid", () => {
input1.value = "" // field is required
input1.value = ""; // field is required
input4.click();
expectToBeShown(dialog);
@@ -115,8 +115,8 @@ describe("PopoutController", () => {
describe("disable update-display", () => {
beforeEach(() => {
document.body.innerHTML = htmlTemplate({updateDisplay: "false" });
})
document.body.innerHTML = htmlTemplate({ updateDisplay: "false" });
});
it("doesn't update display value", () => {
expect(button.textContent).toBe("On demand");
@@ -133,9 +133,9 @@ describe("PopoutController", () => {
});
});
function htmlTemplate(opts = {updateDisplay: ""}) {
function htmlTemplate(opts = { updateDisplay: "" }) {
return `
<div data-controller="popout" data-popout-update-display-value="${opts['updateDisplay']}">
<div data-controller="popout" data-popout-update-display-value="${opts["updateDisplay"]}">
<button id="button" data-popout-target="button">On demand</button>
<div id="dialog" data-popout-target="dialog" style="display: none;">
<input id="input1" value="value1" required>

16
spec/javascripts/stimulus/stripe_cards_controller_test.js
View File

@@ -28,9 +28,7 @@ describe("StripeCardsController", () => {
const select = document.getElementById("select");
select.value = "";
select.dispatchEvent(new Event("change"));
expect(document.getElementById("stripeelements").style.display).toBe(
"block"
);
expect(document.getElementById("stripeelements").style.display).toBe("block");
});
});
describe("#selectCard", () => {
@@ -39,23 +37,17 @@ describe("StripeCardsController", () => {
select.value = "1";
select.dispatchEvent(new Event("change"));
expect(document.getElementById("stripeelements").style.display).toBe(
"none"
);
expect(document.getElementById("stripeelements").style.display).toBe("none");
expect(document.getElementById("input_1").disabled).toBe(true);
select.value = "2";
select.dispatchEvent(new Event("change"));
expect(document.getElementById("stripeelements").style.display).toBe(
"none"
);
expect(document.getElementById("stripeelements").style.display).toBe("none");
expect(document.getElementById("input_1").disabled).toBe(true);
select.value = "";
select.dispatchEvent(new Event("change"));
expect(document.getElementById("stripeelements").style.display).toBe(
"block"
);
expect(document.getElementById("stripeelements").style.display).toBe("block");
expect(document.getElementById("input_1").disabled).toBe(false);
});
});

188
spec/javascripts/stimulus/tabs_and_panels_controller_test.js
View File

@@ -2,13 +2,13 @@
* @jest-environment jsdom
*/
import { Application } from 'stimulus';
import tabs_and_panels_controller from '../../../app/webpacker/controllers/tabs_and_panels_controller';
import { Application } from "stimulus";
import tabs_and_panels_controller from "../../../app/webpacker/controllers/tabs_and_panels_controller";
describe('TabsAndPanelsController', () => {
describe("TabsAndPanelsController", () => {
beforeAll(() => {
const application = Application.start();
application.register('tabs-and-panels', tabs_and_panels_controller);
application.register("tabs-and-panels", tabs_and_panels_controller);
});
beforeEach(() => {
@@ -21,133 +21,133 @@ describe('TabsAndPanelsController', () => {
<div id="peek_panel" data-tabs-and-panels-target="panel default">Peek me</div>
<div id="ka_panel" data-tabs-and-panels-target="panel">Ka you</div>
<div id="boo_panel" data-tabs-and-panels-target="panel">Boo three</div>
</div>`
})
</div>`;
});
it("#activate by clicking on tab", () => {
const peakTab = document.getElementById("peek_tab")
const kaTab = document.getElementById("ka_tab")
const booTab = document.getElementById("boo_tab")
const peakPanel = document.getElementById("peek_panel")
const kaPanel = document.getElementById("ka_panel")
const booPanel = document.getElementById("boo_panel")
const peakTab = document.getElementById("peek_tab");
const kaTab = document.getElementById("ka_tab");
const booTab = document.getElementById("boo_tab");
const peakPanel = document.getElementById("peek_panel");
const kaPanel = document.getElementById("ka_panel");
const booPanel = document.getElementById("boo_panel");
expect(peakTab.classList.contains("selected")).toBe(true)
expect(kaTab.classList.contains("selected")).toBe(false)
expect(booTab.classList.contains("selected")).toBe(false)
expect(peakTab.classList.contains("selected")).toBe(true);
expect(kaTab.classList.contains("selected")).toBe(false);
expect(booTab.classList.contains("selected")).toBe(false);
expect(peakPanel.style.display).toBe("block")
expect(kaPanel.style.display).toBe("none")
expect(booPanel.style.display).toBe("none")
expect(peakPanel.style.display).toBe("block");
expect(kaPanel.style.display).toBe("none");
expect(booPanel.style.display).toBe("none");
kaTab.click()
kaTab.click();
expect(peakTab.classList.contains("selected")).toBe(false)
expect(kaTab.classList.contains("selected")).toBe(true)
expect(booTab.classList.contains("selected")).toBe(false)
expect(peakTab.classList.contains("selected")).toBe(false);
expect(kaTab.classList.contains("selected")).toBe(true);
expect(booTab.classList.contains("selected")).toBe(false);
expect(peakPanel.style.display).toBe("none")
expect(kaPanel.style.display).toBe("block")
expect(booPanel.style.display).toBe("none")
})
expect(peakPanel.style.display).toBe("none");
expect(kaPanel.style.display).toBe("block");
expect(booPanel.style.display).toBe("none");
});
it("#activateDefaultPanel on orderCycleSelected event", () => {
const peakTab = document.getElementById("peek_tab")
const kaTab = document.getElementById("ka_tab")
const booTab = document.getElementById("boo_tab")
const peakPanel = document.getElementById("peek_panel")
const kaPanel = document.getElementById("ka_panel")
const booPanel = document.getElementById("boo_panel")
const peakTab = document.getElementById("peek_tab");
const kaTab = document.getElementById("ka_tab");
const booTab = document.getElementById("boo_tab");
const peakPanel = document.getElementById("peek_panel");
const kaPanel = document.getElementById("ka_panel");
const booPanel = document.getElementById("boo_panel");
expect(peakTab.classList.contains("selected")).toBe(true)
expect(kaTab.classList.contains("selected")).toBe(false)
expect(booTab.classList.contains("selected")).toBe(false)
expect(peakTab.classList.contains("selected")).toBe(true);
expect(kaTab.classList.contains("selected")).toBe(false);
expect(booTab.classList.contains("selected")).toBe(false);
expect(peakPanel.style.display).toBe("block")
expect(kaPanel.style.display).toBe("none")
expect(booPanel.style.display).toBe("none")
expect(peakPanel.style.display).toBe("block");
expect(kaPanel.style.display).toBe("none");
expect(booPanel.style.display).toBe("none");
kaTab.click()
kaTab.click();
expect(peakTab.classList.contains("selected")).toBe(false)
expect(kaTab.classList.contains("selected")).toBe(true)
expect(booTab.classList.contains("selected")).toBe(false)
expect(peakTab.classList.contains("selected")).toBe(false);
expect(kaTab.classList.contains("selected")).toBe(true);
expect(booTab.classList.contains("selected")).toBe(false);
expect(peakPanel.style.display).toBe("none")
expect(kaPanel.style.display).toBe("block")
expect(booPanel.style.display).toBe("none")
expect(peakPanel.style.display).toBe("none");
expect(kaPanel.style.display).toBe("block");
expect(booPanel.style.display).toBe("none");
const event = new Event("orderCycleSelected")
const event = new Event("orderCycleSelected");
window.dispatchEvent(event);
expect(peakTab.classList.contains("selected")).toBe(true)
expect(kaTab.classList.contains("selected")).toBe(false)
expect(booTab.classList.contains("selected")).toBe(false)
expect(peakTab.classList.contains("selected")).toBe(true);
expect(kaTab.classList.contains("selected")).toBe(false);
expect(booTab.classList.contains("selected")).toBe(false);
expect(peakPanel.style.display).toBe("block")
expect(kaPanel.style.display).toBe("none")
expect(booPanel.style.display).toBe("none")
})
expect(peakPanel.style.display).toBe("block");
expect(kaPanel.style.display).toBe("none");
expect(booPanel.style.display).toBe("none");
});
describe("when valid anchor is specified in the url", () => {
const oldWindowLocation = window.location
const oldWindowLocation = window.location;
beforeAll(() => {
Object.defineProperty(window, "location", {
value: new URL("http://example.com/#boo_panel"),
configurable: true,
})
})
});
});
afterAll(() => {
delete window.location
window.location = oldWindowLocation
})
delete window.location;
window.location = oldWindowLocation;
});
it("#activateFromWindowLocationOrDefaultPanelTarget show panel based on anchor", () => {
const peakTab = document.getElementById("peek_tab")
const kaTab = document.getElementById("ka_tab")
const booTab = document.getElementById("boo_tab")
const peakPanel = document.getElementById("peek_panel")
const kaPanel = document.getElementById("ka_panel")
const booPanel = document.getElementById("boo_panel")
const peakTab = document.getElementById("peek_tab");
const kaTab = document.getElementById("ka_tab");
const booTab = document.getElementById("boo_tab");
const peakPanel = document.getElementById("peek_panel");
const kaPanel = document.getElementById("ka_panel");
const booPanel = document.getElementById("boo_panel");
expect(peakTab.classList.contains("selected")).toBe(false)
expect(kaTab.classList.contains("selected")).toBe(false)
expect(booTab.classList.contains("selected")).toBe(true)
expect(peakTab.classList.contains("selected")).toBe(false);
expect(kaTab.classList.contains("selected")).toBe(false);
expect(booTab.classList.contains("selected")).toBe(true);
expect(peakPanel.style.display).toBe("none")
expect(kaPanel.style.display).toBe("none")
expect(booPanel.style.display).toBe("block")
})
})
expect(peakPanel.style.display).toBe("none");
expect(kaPanel.style.display).toBe("none");
expect(booPanel.style.display).toBe("block");
});
});
describe("when non valid anchor is specified in the url", () => {
const oldWindowLocation = window.location
const oldWindowLocation = window.location;
beforeAll(() => {
Object.defineProperty(window, "location", {
value: new URL("http://example.com/#non_valid_panel"),
configurable: true,
})
})
});
});
afterAll(() => {
delete window.location
window.location = oldWindowLocation
})
delete window.location;
window.location = oldWindowLocation;
});
it("#activateFromWindowLocationOrDefaultPanelTarget show default panel", () => {
const peakTab = document.getElementById("peek_tab")
const kaTab = document.getElementById("ka_tab")
const booTab = document.getElementById("boo_tab")
const peakPanel = document.getElementById("peek_panel")
const kaPanel = document.getElementById("ka_panel")
const booPanel = document.getElementById("boo_panel")
const peakTab = document.getElementById("peek_tab");
const kaTab = document.getElementById("ka_tab");
const booTab = document.getElementById("boo_tab");
const peakPanel = document.getElementById("peek_panel");
const kaPanel = document.getElementById("ka_panel");
const booPanel = document.getElementById("boo_panel");
expect(peakTab.classList.contains("selected")).toBe(true)
expect(kaTab.classList.contains("selected")).toBe(false)
expect(booTab.classList.contains("selected")).toBe(false)
expect(peakTab.classList.contains("selected")).toBe(true);
expect(kaTab.classList.contains("selected")).toBe(false);
expect(booTab.classList.contains("selected")).toBe(false);
expect(peakPanel.style.display).toBe("block")
expect(kaPanel.style.display).toBe("none")
expect(booPanel.style.display).toBe("none")
})
})
})
expect(peakPanel.style.display).toBe("block");
expect(kaPanel.style.display).toBe("none");
expect(booPanel.style.display).toBe("none");
});
});
});

24
spec/javascripts/stimulus/tabs_controller_test.js
View File

@@ -33,19 +33,19 @@ describe("TabsController", () => {
});
it("shows the corresponding content when a tab button is clicked", () => {
const dogs_button = document.querySelectorAll('button')[0];
const cats_button = document.querySelectorAll('button')[1];
const birds_button = document.querySelectorAll('button')[2];
const dogs_content = document.querySelectorAll('.content-area')[0];
const cats_content = document.querySelectorAll('.content-area')[1];
const birds_content = document.querySelectorAll('.content-area')[2];
const dogs_button = document.querySelectorAll("button")[0];
const cats_button = document.querySelectorAll("button")[1];
const birds_button = document.querySelectorAll("button")[2];
const dogs_content = document.querySelectorAll(".content-area")[0];
const cats_content = document.querySelectorAll(".content-area")[1];
const birds_content = document.querySelectorAll(".content-area")[2];
expect(dogs_content.hidden).toBe(false);
expect(cats_content.hidden).toBe(true);
expect(birds_content.hidden).toBe(true);
expect(document.querySelectorAll('button.active').length).toBe(1);
expect(document.querySelectorAll('button.active')[0]).toBe(dogs_button);
expect(document.querySelectorAll("button.active").length).toBe(1);
expect(document.querySelectorAll("button.active")[0]).toBe(dogs_button);
birds_button.click();
@@ -53,8 +53,8 @@ describe("TabsController", () => {
expect(cats_content.hidden).toBe(true);
expect(birds_content.hidden).toBe(false);
expect(document.querySelectorAll('button.active').length).toBe(1);
expect(document.querySelectorAll('button.active')[0]).toBe(birds_button);
expect(document.querySelectorAll("button.active").length).toBe(1);
expect(document.querySelectorAll("button.active")[0]).toBe(birds_button);
cats_button.click();
@@ -62,8 +62,8 @@ describe("TabsController", () => {
expect(cats_content.hidden).toBe(false);
expect(birds_content.hidden).toBe(true);
expect(document.querySelectorAll('button.active').length).toBe(1);
expect(document.querySelectorAll('button.active')[0]).toBe(cats_button);
expect(document.querySelectorAll("button.active").length).toBe(1);
expect(document.querySelectorAll("button.active")[0]).toBe(cats_button);
});
});
});

24
spec/javascripts/stimulus/toggle_control_controller_test.js
View File

@@ -44,17 +44,17 @@ describe("ToggleControlController", () => {
});
it("Disables when input is filled", () => {
input.value = "test"
input.value = "test";
input.dispatchEvent(new Event("input"));
expect(control.disabled).toBe(true);
});
it("Enables when input is emptied", () => {
input.value = "test"
input.value = "test";
input.dispatchEvent(new Event("input"));
input.value = ""
input.value = "";
input.dispatchEvent(new Event("input"));
expect(control.disabled).toBe(false);
@@ -72,7 +72,7 @@ describe("ToggleControlController", () => {
});
it("Enables when input is filled and focuses the control", () => {
input.value = "a"
input.value = "a";
input.dispatchEvent(new Event("input"));
expect(control.disabled).toBe(false);
@@ -80,10 +80,10 @@ describe("ToggleControlController", () => {
});
it("Disables when input is emptied", () => {
input.value = "test"
input.value = "test";
input.dispatchEvent(new Event("input"));
input.value = ""
input.value = "";
input.dispatchEvent(new Event("input"));
expect(control.disabled).toBe(true);
@@ -100,7 +100,7 @@ describe("ToggleControlController", () => {
it("Enables the button control when input is filled, focus remains on input", () => {
// Simulating click on input to focus it
input.focus();
input.value = "test"
input.value = "test";
input.dispatchEvent(new Event("input"));
expect(control.disabled).toBe(false);
@@ -110,16 +110,16 @@ describe("ToggleControlController", () => {
it("Disables the button control when input is emptied, focus remains on input", () => {
// Simulating click on input to focus it
input.focus();
input.value = "test"
input.value = "test";
input.dispatchEvent(new Event("input"));
input.value = ""
input.value = "";
input.dispatchEvent(new Event("input"));
expect(control.disabled).toBe(true);
expect(document.activeElement).toBe(input);
});
})
});
});
describe("#displayIfMatch", () => {
@@ -135,14 +135,14 @@ describe("ToggleControlController", () => {
});
it("Shows when match is selected", () => {
select.value = "items"
select.value = "items";
select.dispatchEvent(new Event("change"));
expect(control.style.display).toBe("block");
});
it("Hides when match is not selected", () => {
select.value = "weight_1"
select.value = "weight_1";
select.dispatchEvent(new Event("change"));
expect(control.style.display).toBe("none");

212
spec/javascripts/stimulus/unsaved_changes_controller_test.js
View File

@@ -2,14 +2,14 @@
* @jest-environment jsdom
*/
import { Application } from "stimulus"
import unsaved_changes_controller from "../../../app/webpacker/controllers/unsaved_changes_controller"
import { Application } from "stimulus";
import unsaved_changes_controller from "../../../app/webpacker/controllers/unsaved_changes_controller";
describe("UnsavedChangesController", () => {
beforeAll(() => {
const application = Application.start()
application.register("unsaved-changes", unsaved_changes_controller)
})
const application = Application.start();
application.register("unsaved-changes", unsaved_changes_controller);
});
beforeEach(() => {
document.body.innerHTML = `
@@ -22,8 +22,8 @@ describe("UnsavedChangesController", () => {
<input id="test-checkbox" type="checkbox" />
<input id="test-submit" type="submit"/>
</form>
`
})
`;
});
describe("#connect", () => {
describe("when disable-submit-button is true", () => {
@@ -39,15 +39,15 @@ describe("UnsavedChangesController", () => {
<input id="test-checkbox" type="checkbox" />
<input id="test-submit" type="submit"/>
</form>
`
})
`;
});
it("disables any submit button", () => {
const submit = document.getElementById("test-submit")
const submit = document.getElementById("test-submit");
expect(submit.disabled).toBe(true)
})
})
expect(submit.disabled).toBe(true);
});
});
describe("when disable-submit-button is false", () => {
beforeEach(() => {
@@ -62,171 +62,171 @@ describe("UnsavedChangesController", () => {
<input id="test-checkbox" type="checkbox" />
<input id="test-submit" type="submit"/>
</form>
`
})
`;
});
it("doesn't disable any submit button", () => {
const submit = document.getElementById("test-submit")
const submit = document.getElementById("test-submit");
expect(submit.disabled).toBe(false)
})
})
expect(submit.disabled).toBe(false);
});
});
describe("when disable-submit-button is not set", () => {
it("doesn't disable any submit button", () => {
const submit = document.getElementById("test-submit")
const submit = document.getElementById("test-submit");
expect(submit.disabled).toBe(false)
})
})
})
expect(submit.disabled).toBe(false);
});
});
});
describe("#formIsChanged", () => {
let checkbox
let submit
let checkbox;
let submit;
beforeEach(() => {
checkbox = document.getElementById("test-checkbox")
submit = document.getElementById("test-submit")
})
checkbox = document.getElementById("test-checkbox");
submit = document.getElementById("test-submit");
});
it("changed is set to true", () => {
const form = document.getElementById("test-form")
const form = document.getElementById("test-form");
checkbox.click()
checkbox.click();
expect(form.dataset.unsavedChangesChanged).toBe("true")
})
expect(form.dataset.unsavedChangesChanged).toBe("true");
});
describe("when disable-submit-button is true", () => {
it("enables any submit button", () => {
checkbox.click()
checkbox.click();
expect(submit.disabled).toBe(false)
})
})
expect(submit.disabled).toBe(false);
});
});
describe("when disable-submit-button is false", () => {
it("does nothing", () => {
expect(submit.disabled).toBe(false)
expect(submit.disabled).toBe(false);
checkbox.click()
checkbox.click();
expect(submit.disabled).toBe(false)
})
})
})
expect(submit.disabled).toBe(false);
});
});
});
describe('#leavingPage', () => {
let checkbox
describe("#leavingPage", () => {
let checkbox;
beforeEach(() => {
// Add a mock I18n object to
const mockedT = jest.fn()
mockedT.mockImplementation((string) => (string))
const mockedT = jest.fn();
mockedT.mockImplementation((string) => string);
global.I18n = {
t: mockedT
}
global.I18n = {
t: mockedT,
};
checkbox = document.getElementById("test-checkbox")
})
checkbox = document.getElementById("test-checkbox");
});
afterEach(() => {
delete global.I18n
})
delete global.I18n;
});
describe('when triggering a beforeunload event', () => {
describe("when triggering a beforeunload event", () => {
it("triggers leave page pop up when leaving page and form has been interacted with", () => {
// interact with the form
checkbox.click()
checkbox.click();
// trigger beforeunload to simulate leaving the page
const beforeunloadEvent = new Event("beforeunload")
window.dispatchEvent(beforeunloadEvent)
const beforeunloadEvent = new Event("beforeunload");
window.dispatchEvent(beforeunloadEvent);
// Test the event returnValue has been set, we don't really care about the value as
// the brower will ignore it
expect(beforeunloadEvent.returnValue).toBeTruthy()
})
})
// the brower will ignore it
expect(beforeunloadEvent.returnValue).toBeTruthy();
});
});
describe('when triggering a turbolinks:before-visit event', () => {
let confirmSpy
describe("when triggering a turbolinks:before-visit event", () => {
let confirmSpy;
beforeEach(() => {
confirmSpy = jest.spyOn(window, 'confirm')
})
confirmSpy = jest.spyOn(window, "confirm");
});
afterEach(() => {
// cleanup
confirmSpy.mockRestore()
})
confirmSpy.mockRestore();
});
it("triggers a confirm popup up when leaving page and form has been interacted with", () => {
confirmSpy.mockImplementation((msg) => {})
confirmSpy.mockImplementation((msg) => {});
// interact with the form
checkbox.click()
checkbox.click();
// trigger turbolinks:before-visit to simulate leaving the page
const turbolinkEv = new Event("turbolinks:before-visit")
window.dispatchEvent(turbolinkEv)
const turbolinkEv = new Event("turbolinks:before-visit");
window.dispatchEvent(turbolinkEv);
expect(confirmSpy).toHaveBeenCalled()
})
expect(confirmSpy).toHaveBeenCalled();
});
it("stays on the page if user clicks cancel on the confirm popup", () => {
// return false to simulate a user clicking on cancel
confirmSpy.mockImplementation((msg) => (false))
confirmSpy.mockImplementation((msg) => false);
// interact with the form
checkbox.click()
checkbox.click();
// trigger turbolinks:before-visit to simulate leaving the page
const turbolinkEv = new Event("turbolinks:before-visit")
const preventDefaultSpy = jest.spyOn(turbolinkEv, 'preventDefault')
const turbolinkEv = new Event("turbolinks:before-visit");
const preventDefaultSpy = jest.spyOn(turbolinkEv, "preventDefault");
window.dispatchEvent(turbolinkEv)
window.dispatchEvent(turbolinkEv);
expect(confirmSpy).toHaveBeenCalled()
expect(preventDefaultSpy).toHaveBeenCalled()
})
})
})
expect(confirmSpy).toHaveBeenCalled();
expect(preventDefaultSpy).toHaveBeenCalled();
});
});
});
describe('#handleSubmit', () => {
let checkbox
describe("#handleSubmit", () => {
let checkbox;
beforeEach(() => {
// Add a mock I18n object to
const mockedT = jest.fn()
mockedT.mockImplementation((string) => (string))
const mockedT = jest.fn();
mockedT.mockImplementation((string) => string);
global.I18n = {
t: mockedT
}
global.I18n = {
t: mockedT,
};
checkbox = document.getElementById("test-checkbox")
})
checkbox = document.getElementById("test-checkbox");
});
afterEach(() => {
delete global.I18n
})
delete global.I18n;
});
describe('when submiting the form', () => {
describe("when submiting the form", () => {
it("changed is set to true", () => {
const form = document.getElementById("test-form")
const form = document.getElementById("test-form");
// interact with the form
checkbox.click()
checkbox.click();
// submit the form
const submitEvent = new Event("submit")
form.dispatchEvent(submitEvent)
// submit the form
const submitEvent = new Event("submit");
form.dispatchEvent(submitEvent);
expect(form.dataset.unsavedChangesChanged).toBe("false")
})
})
})
})
expect(form.dataset.unsavedChangesChanged).toBe("false");
});
});
});
});