diff --git a/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.spec.js b/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.spec.js new file mode 100644 index 00000000..7dd36b04 --- /dev/null +++ b/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.spec.js @@ -0,0 +1,78 @@ +import addressVehiclesQuestion from "@/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.vue"; +import { shallowMount } from "@vue/test-utils"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; + +describe("address-vehicles-question.vue", () => { + test("Selected vehicle is emitted upon selection", async () => { + //Arrange + const { wrapper } = setupMocks({ modelValueProp: "2020 Audi A6" }); + const vehicleToSelect = "2016 Jaguar F-Type"; + + //Act + wrapper.setValue({ selectedVehicle: vehicleToSelect }); + await wrapper.vm.$nextTick(); + + //Assert + expect(wrapper.emitted()["update:modelValue"][0]).toEqual([ + { selectedVehicle: "2016 Jaguar F-Type" }, + ]); + }); + test("Should return content for differentVehicleAlertHeader", () => { + // Arrange + const wrapper = shallowMount(addressVehiclesQuestion, { + mixins: [mockMixin], + }); + + // Assert + expect(wrapper.vm.differentVehicleAlertHeader).toEqual("FoundWindshieldTestReturn"); + }); + test("Should return content for differentVehicleAlertBody", () => { + // Arrange + const wrapper = shallowMount(addressVehiclesQuestion, { + mixins: [mockMixin], + propsData: { + vehicles: ["1", "2"], + modelValue: ["1", "2"], + }, + }); + + // Assert + expect(wrapper.vm.differentVehicleAlertBody).toEqual("FoundWindshieldTestReturn"); + }); +}); + +const mockMixin = { + methods: { + getCmsContent: jest.fn((contentName) => { + if (contentName === "FoundWindshield") { + return "FoundWindshieldTestReturn"; + } + return null; + }), + vehicles: jest.fn(() => { + return [{ vehicle: "test" }]; + }), + }, +}; + +function setupMocks({ + modelValueProp = "TESTCAR", + cmsQuestionText = "CMS text goes here", + dataFromStoreApi = [], +}) { + + const mountOptions = getMountOptions(); + + //Mock props + mountOptions.propsData = { + modelValue: modelValueProp, + }; + + const wrapper = shallowMount(addressVehiclesQuestion, mountOptions); + + //Mock CMS content + const cmsContent = { + QuestionText: cmsQuestionText, + }; + return { wrapper, cmsContent }; +} \ No newline at end of file