// Components import capabilityQuestions from "@/layouts/capability-questions/capability-questions"; // Supporting Files import { shallowMount } from "@vue/test-utils"; import { getMountOptions } from "@/helpers/unit-test-helper.js"; import store from "@/store"; import baseMixin from "../../mixins/base-mixin"; import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin"; import { nextTick } from "vue"; // Mock our module for promises. jest.mock("@/helpers/layout-helper.js", () => ({ settleAllPromises: jest.fn(), })); // Mock fetchCmsContentForPage jest.mock("@/helpers/cms-content-helper", () => ({ fetchCmsContentForPage: jest.fn(), })); jest.mock( "@/store", () => { return {}; }, { virtual: true } ); jest.mock("@/helpers/heritage-integration/navigation-helper", () => ({ navigateToHeritageFunnel: jest.fn(), })); const baseStoreGettersPageData = () => { return { partsOrQuestions: [ { parts: [ { childPartQuestions: [], }, ], capabilityQuestions: [ { questionSequence: 1, questionText: "Is your vehicle equipped with the optional Lane-Keeping System which tugs on the steering wheel and/or beeps to alert you if you drift too close to the edge of the lane?", answers: [ { answerResult1: "DYNAMIC", answerResult2: "1", answerText: "Yes", nextQuestionSequence: null, answerResult: "DYNAMIC", }, { answerResult1: "Unknown", answerResult2: "0", answerText: "No", nextQuestionSequence: null, answerResult: "Unknown", }, ], }, ], partQuestions: [], questions: [], glassLocation: "Windshield", glassName: "Single", answerKey: "Windshield-Single", answerData: null, }, ], }; }; const baseStoreGettersDamage = () => { return { partsQuestionAnswers: [ { glassLocation: "Windshield", glassName: "Single", result: "FW04848", answeredQuestions: [ { questionText: "Is your vehicle equipped with the Panoramic Sunroof which can be identified by having a glass panel over the rear seats?", selectedAnswer: "1|nextQuestion|3|Yes", selectedAnswerText: "Yes", questionNum: 1, }, { questionText: "Is your vehicle equipped with a heated windshield that melts snow and ice from underneath the windshield wiper blades?", selectedAnswer: "2|nextQuestion|3|Yes", selectedAnswerText: "Yes", questionNum: 2, }, ], }, ], }; }; store.getters = { pageData: baseStoreGettersPageData, damage: baseStoreGettersDamage, payment: { insuranceCoverage: {} }, }; store.commit = jest.fn(); afterEach(() => { // reset store after each test store.getters = { pageData: baseStoreGettersPageData, damage: baseStoreGettersDamage, payment: { insuranceCoverage: {} }, order: {}, }; }); describe("capabilityQuestions.vue", () => { describe("method arePagePrerequisitesValid...", () => { test("Should return true for valid page requisites if pageData exists", () => { // Arrange const { wrapper } = setupMocks({}); // Act const result = wrapper.vm.arePagePrerequisitesValid(); //Assert expect(result).toBe(true); wrapper.unmount(); }); test("Should return false for valid page requisites if partsOrQuestions in pageData is missing", () => { // Arrange const { wrapper } = setupMocks({}); store.getters.pageData = jest.fn(() => { return undefined; }); // Act const result = wrapper.vm.arePagePrerequisitesValid(); //Assert expect(result).toBeFalsy(); wrapper.unmount(); }); test("Should be at least one item in partsOrQuestions", () => { // Arrange store.getters = { pageData: jest.fn(() => { return { partsOrQuestions: [], }; }), damage: baseStoreGettersDamage, }; const { wrapper } = setupMocks({}); // Act const result = wrapper.vm.arePagePrerequisitesValid(); //Assert expect(result).toBeFalsy(); wrapper.unmount(); }); }); describe("watch on selectedAnswers should be set up...", () => { test("Should trigger handleCompletedQuestionChainAnswers if watched data changes", async () => { // Arrange const { wrapper } = setupMocks({}); const spy = jest.spyOn(wrapper.vm, "handleCompletedQuestionChainAnswers"); // Act wrapper.setData({ selectedAnswers: { "Windshield-Single": { answerResult: "FW04848", answeredQuestions: [ { questionText: "Is your vehicle equipped with the Panoramic Sunroof which can be identified by having a glass panel over the rear seats?", selectedAnswer: "1|nextQuestion|3|Yes", selectedAnswerText: "Yes", questionNum: 1, }, { questionText: "Is your vehicle equipped with a heated windshield that melts snow and ice from underneath the windshield wiper blades?", selectedAnswer: "2|nextQuestion|3|Yes", selectedAnswerText: "Yes", questionNum: 2, }, ], index: 0, }, }, }); await nextTick(); //Assert expect(spy).toHaveBeenCalled(); wrapper.unmount(); }); }); describe("forwardButtonAction", () => { test("Should clear out answerData", () => { // Arrange const { wrapper } = setupMocks({}); wrapper.vm.questionsData = [ { glassLocation: "Windshield", glassName: "Single", answerData: { answerResult: "FW04848", answeredQuestions: [], }, questions: [], parts: [ { childPartQuestions: [{}], }, ], }, ]; wrapper.vm.dispatchStoreAction = jest.fn(() => { return { data: [], }; }); wrapper.vm.dispatchStoreActionWithLogging = jest.fn(() => { return { data: [], }; }); // Act wrapper.vm.forwardButtonAction(); //Assert expect(wrapper.vm.questionsData[0].answerData).toEqual({}); wrapper.unmount(); }); test("Should save to Vuex store", async () => { // Arrange const { wrapper } = setupMocks({}); wrapper.vm.questionsData = [ { glassLocation: "Windshield", glassName: "Single", answerData: { answerResult: "FW04848", answeredQuestions: [], }, questions: [], parts: [ { childPartQuestions: [], }, ], }, ]; wrapper.vm.dispatchStoreAction = jest.fn(() => { return { data: [], }; }); wrapper.vm.dispatchStoreActionWithLogging = jest.fn(() => { return { data: [], }; }); const spy = jest.spyOn(wrapper.vm, "dispatchStoreAction"); // Act wrapper.vm.forwardButtonAction(); await nextTick(); //Assert expect(spy).toHaveBeenNthCalledWith( 1, "saveCapabilityQuestionAnswers", [ { answeredQuestions: [], glassLocation: "Windshield", glassName: "Single", isSuppressedPart: undefined, result: "FW04848", result1: "FW04848", result2: undefined, }, ], false ); wrapper.unmount(); }); test("Should call GET_PART_FROM_CAPABILITY_QUESTION_ANSWER API", async () => { // Arrange const { wrapper } = setupMocks({}); wrapper.vm.questionsData = [ { glassLocation: "Windshield", glassName: "Single", answerData: { answerResult: "FW04848", answeredQuestions: [], }, questions: [], parts: [ { childPartQuestions: [], }, ], }, ]; wrapper.vm.dispatchStoreAction = jest.fn(() => { return { data: [], }; }); wrapper.vm.dispatchStoreActionWithLogging = jest.fn(() => { return { data: [], }; }); const spy = jest.spyOn(wrapper.vm, "dispatchStoreActionWithLogging"); // Act wrapper.vm.forwardButtonAction(); await nextTick(); //Assert expect(spy).toHaveBeenNthCalledWith( 1, "getPartFromCapabilityQuestionAnswer", "Windshield", "capability-questions", false ); wrapper.unmount(); }); test("Should trigger navigateForward", async () => { // Arrange const { wrapper } = setupMocks({}); wrapper.vm.questionsData = [ { glassLocation: "Windshield", glassName: "Single", answerData: { answerResult: "FW04848", answeredQuestions: [], }, questions: [], parts: [ { childPartQuestions: [], }, ], }, ]; wrapper.vm.dispatchStoreAction = jest.fn(() => { return { data: [], }; }); wrapper.vm.dispatchStoreActionWithLogging = jest.fn(() => { return { data: [], }; }); wrapper.vm.navigateForward = jest.fn(); // Act await wrapper.vm.forwardButtonAction(); //Assert expect(wrapper.vm.navigateForward).toHaveBeenCalled(); wrapper.unmount(); }); }); }); function setupMocks({ mountOptionsMockData = { router: { navigate: jest.fn(), navigateWithSaving: jest.fn(), navigateWithoutSaving: jest.fn(), }, store: { getters: store.getters, commit: store.commit, }, route: { query: { fmgPage: "capability-questions", }, }, }, }) { const mountOptions = getMountOptions({ ...mountOptionsMockData, mixins: [baseMixin, vehicleQuestionsMixin], }); mountOptions["attachTo"] = document.body; const wrapper = shallowMount(capabilityQuestions, mountOptions); return { wrapper }; }