116 lines
4.5 KiB
JavaScript
116 lines
4.5 KiB
JavaScript
import { shallowMount } from "@vue/test-utils";
|
|
import saveProgressPopupSmsConsentQuestion from "./save-progress-popup-sms-consent-question";
|
|
import {
|
|
defaultSaveProgressSmsConsent,
|
|
getSaveProgressSmsConsentFallbackCopy,
|
|
} from "@/helpers/save-progress-sms-consent/save-progress-sms-consent-helper";
|
|
import { errorMessages } from "@/constants/error-messages";
|
|
|
|
describe("save-progress-popup-sms-consent-question", () => {
|
|
it("should render two consent checkboxes with default copy", () => {
|
|
const wrapper = shallowMount(saveProgressPopupSmsConsentQuestion);
|
|
const fallbackCopy = getSaveProgressSmsConsentFallbackCopy();
|
|
|
|
const checkboxes = wrapper.findAllComponents({ name: "checkboxQuestion" });
|
|
|
|
expect(checkboxes).toHaveLength(2);
|
|
expect(checkboxes.at(0).props("labelText")).toBe(fallbackCopy.transactional);
|
|
expect(checkboxes.at(1).props("labelText")).toBe(fallbackCopy.marketing);
|
|
});
|
|
|
|
it("should emit updated consent when a checkbox changes", async () => {
|
|
const wrapper = shallowMount(saveProgressPopupSmsConsentQuestion, {
|
|
propsData: {
|
|
modelValue: defaultSaveProgressSmsConsent(),
|
|
},
|
|
});
|
|
|
|
wrapper.vm.transactionalConsent = true;
|
|
await wrapper.vm.$nextTick();
|
|
|
|
expect(wrapper.emitted("update:modelValue")).toEqual([
|
|
[{ transactional: true, marketing: false }],
|
|
]);
|
|
});
|
|
|
|
it("should accept API-ready consent copy via prop", () => {
|
|
const apiCopy = {
|
|
transactional: "API transactional copy",
|
|
marketing: "API marketing copy",
|
|
};
|
|
|
|
const wrapper = shallowMount(saveProgressPopupSmsConsentQuestion, {
|
|
propsData: {
|
|
consentCopy: apiCopy,
|
|
},
|
|
});
|
|
|
|
const checkboxes = wrapper.findAllComponents({ name: "checkboxQuestion" });
|
|
|
|
expect(checkboxes.at(0).props("labelText")).toBe("API transactional copy");
|
|
expect(checkboxes.at(1).props("labelText")).toBe("API marketing copy");
|
|
});
|
|
|
|
it("should disable consent checkboxes when isDisabled is true", () => {
|
|
const wrapper = shallowMount(saveProgressPopupSmsConsentQuestion, {
|
|
propsData: {
|
|
isDisabled: true,
|
|
},
|
|
});
|
|
|
|
const checkboxes = wrapper.findAllComponents({ name: "checkboxQuestion" });
|
|
|
|
expect(checkboxes.at(0).props("isDisabled")).toBe(true);
|
|
expect(checkboxes.at(1).props("isDisabled")).toBe(true);
|
|
expect(wrapper.find("fieldset").attributes("disabled")).toBe("");
|
|
});
|
|
|
|
it("should not show consent errors before showConsentErrors is true", () => {
|
|
const wrapper = shallowMount(saveProgressPopupSmsConsentQuestion, {
|
|
propsData: {
|
|
modelValue: defaultSaveProgressSmsConsent(),
|
|
showConsentErrors: false,
|
|
},
|
|
});
|
|
|
|
const checkboxes = wrapper.findAllComponents({ name: "checkboxQuestion" });
|
|
|
|
expect(checkboxes.at(0).props("hasError")).toBe(false);
|
|
expect(checkboxes.at(1).props("hasError")).toBe(false);
|
|
expect(wrapper.text()).not.toContain(errorMessages.SMS_CONSENT_REQUIRED);
|
|
});
|
|
|
|
it("should show consent errors when showConsentErrors is true and nothing is selected", async () => {
|
|
const wrapper = shallowMount(saveProgressPopupSmsConsentQuestion, {
|
|
propsData: {
|
|
modelValue: defaultSaveProgressSmsConsent(),
|
|
showConsentErrors: false,
|
|
},
|
|
});
|
|
|
|
await wrapper.setProps({ showConsentErrors: true });
|
|
|
|
expect(wrapper.text()).toContain(errorMessages.SMS_CONSENT_REQUIRED);
|
|
|
|
const checkboxes = wrapper.findAllComponents({ name: "checkboxQuestion" });
|
|
expect(checkboxes.at(0).props("hasError")).toBe(true);
|
|
expect(checkboxes.at(1).props("hasError")).toBe(true);
|
|
});
|
|
|
|
it("should clear consent errors when a selection is made while showConsentErrors is true", async () => {
|
|
const wrapper = shallowMount(saveProgressPopupSmsConsentQuestion, {
|
|
propsData: {
|
|
modelValue: defaultSaveProgressSmsConsent(),
|
|
showConsentErrors: true,
|
|
},
|
|
});
|
|
|
|
await wrapper.setProps({
|
|
modelValue: { transactional: true, marketing: false },
|
|
});
|
|
|
|
const checkboxes = wrapper.findAllComponents({ name: "checkboxQuestion" });
|
|
expect(checkboxes.at(0).props("hasError")).toBe(false);
|
|
expect(checkboxes.at(1).props("hasError")).toBe(false);
|
|
});
|
|
});
|