99 lines
3.3 KiB
JavaScript
99 lines
3.3 KiB
JavaScript
// @vitest-environment jsdom
|
|
import { describe, expect, it } from "vitest";
|
|
import { mount } from "@vue/test-utils";
|
|
import SelfServeLaneStep from "@/components/displays/selfServe/SelfServeLaneStep.vue";
|
|
|
|
const RadioButtonStub = {
|
|
props: ["modelValue", "nativeValue", "disabled"],
|
|
emits: ["update:modelValue", "input"],
|
|
template: `
|
|
<button
|
|
v-bind="$attrs"
|
|
type="button"
|
|
:disabled="disabled"
|
|
@click="!disabled && ($emit('update:modelValue', nativeValue), $emit('input', nativeValue))"
|
|
>
|
|
<slot />
|
|
</button>
|
|
`,
|
|
};
|
|
|
|
const mountLaneStep = (props = {}) =>
|
|
mount(SelfServeLaneStep, {
|
|
props: {
|
|
lanes: [
|
|
{ id: 7, name: "7", status: "OCCUPIED" },
|
|
{ id: 8, name: "8", status: "AVAILABLE" },
|
|
],
|
|
selectedLaneId: 8,
|
|
washType: "Manual",
|
|
departmentName: "Roskilde",
|
|
isLaneAvailable: (lane) => lane.status === "AVAILABLE",
|
|
isMachineAvailable: () => true,
|
|
...props,
|
|
},
|
|
global: {
|
|
mocks: {
|
|
$t: (value) => value,
|
|
},
|
|
stubs: {
|
|
BField: {
|
|
template: "<div><slot /></div>",
|
|
},
|
|
BIcon: {
|
|
template: "<i />",
|
|
},
|
|
BMessage: {
|
|
template: "<div v-bind='$attrs'><slot /></div>",
|
|
},
|
|
BRadioButton: RadioButtonStub,
|
|
},
|
|
},
|
|
});
|
|
|
|
describe("SelfServeLaneStep", () => {
|
|
it("keeps unavailable lanes visible but disabled", async () => {
|
|
const wrapper = mountLaneStep();
|
|
|
|
const unavailableLane = wrapper.get('[data-testid="self-serve-lane-option-7"]');
|
|
const availableLane = wrapper.get('[data-testid="self-serve-lane-option-8"]');
|
|
|
|
expect(unavailableLane.attributes("disabled")).toBeDefined();
|
|
expect(unavailableLane.text()).toContain("self_wash.lane_unavailable");
|
|
expect(availableLane.attributes("disabled")).toBeUndefined();
|
|
|
|
await unavailableLane.trigger("click");
|
|
expect(wrapper.emitted("update:selectedLaneId")).toBeUndefined();
|
|
});
|
|
|
|
it("renders hardcoded lane availability copy in Danish", () => {
|
|
const wrapper = mountLaneStep({
|
|
lanes: [],
|
|
selectedLaneId: null,
|
|
departmentName: "Roskilde",
|
|
});
|
|
|
|
expect(wrapper.text()).toContain("Ingen vaskebaner tilgængelige for selvvask");
|
|
expect(wrapper.text()).toContain("Roskilde");
|
|
expect(wrapper.text()).toContain("Tilgængelig");
|
|
});
|
|
|
|
it("shows machine unavailable guidance for the selected lane", () => {
|
|
const wrapper = mountLaneStep({
|
|
isMachineAvailable: () => false,
|
|
});
|
|
|
|
const machineButton = wrapper.get('[data-testid="self-serve-wash-type-machine"]');
|
|
const washTypeGroup = wrapper.get('[data-testid="self-serve-wash-type-group"]');
|
|
const washTypeOptions = wrapper.get('[data-testid="self-serve-wash-type-options"]');
|
|
const guidance = wrapper.get('[data-testid="self-serve-machine-unavailable-guidance"]');
|
|
expect(machineButton.attributes("disabled")).toBeDefined();
|
|
expect(machineButton.attributes("title")).toBe("self_wash.machine_unavailable_for_lane");
|
|
expect(guidance.text()).toContain("self_wash.machine_unavailable_for_lane");
|
|
expect(washTypeOptions.find('[data-testid="self-serve-machine-unavailable-guidance"]').exists()).toBe(false);
|
|
expect(Array.from(washTypeGroup.element.children).indexOf(washTypeOptions.element)).toBeLessThan(
|
|
Array.from(washTypeGroup.element.children).indexOf(guidance.element)
|
|
);
|
|
});
|
|
});
|