DigitalConsumer.FixMyGlass/src/layouts/vehicle-year/vehicle-year.spec.js
2021-12-17 18:56:14 -05:00

94 lines
No EOL
3.2 KiB
JavaScript

import { shallowMount, flushPromises } from "@vue/test-utils";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
import vehicleYear from "@/layouts/vehicle-year/vehicle-year.vue";
import yearQuestion from "@/layouts/vehicle-year/year-question/year-question";
import { settleAllPromises } from "@/helpers/layout-helper.js";
import { nextTick } from "vue";
// Mock our module for promises.
jest.mock("@/helpers/layout-helper.js", () => ({
settleAllPromises: jest.fn(),
}));
describe("vehicle-year.vue", () => {
test("Year question component is initized with api data", async (done) => {
//Arrange
const radioQuestionCmsContent = { QuestionText: "What year is your vehicle?" };
const yearQuestionInitialData = ["2023", "2022", "2021"];
const { wrapper, apiPromise } = setupMocks( {
radioQuestionCmsContent: radioQuestionCmsContent,
yearQuestionInitialData: yearQuestionInitialData,
} );
//Act
vehicleYear.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-year" } }, undefined, (c) => c(wrapper.vm));
//Assert
apiPromise.finally(() => {
expect(yearQuestion.methods.initializeComponent).toHaveBeenCalledWith(radioQuestionCmsContent, yearQuestionInitialData);
done();
});
});
});
describe("vehicle-year.vue", () => {
test("Page header is passed data from CMS", async (done) => {
//Arrange
const { wrapper, apiPromise } = setupMocks( { pageHeaderWidgetHeaderText: "Select a year to get started" });
//Act
vehicleYear.beforeRouteEnter.call(wrapper.vm, { query: { fmgPage: "vehicle-year" } }, undefined, (c) => c(wrapper.vm));
//Assert
const header = await wrapper.find(".Header");
apiPromise.finally(() => {
expect(header.attributes("text")).toEqual("Select a year to get started");
done();
});
});
});
function setupMocks({
radioQuestionCmsContent = {},
yearQuestionInitialData = {},
pageHeaderWidgetHeaderText = {},
mountOptionsMockData = {},
}) {
//Mock api responses
const apiResponses = {
cmsContent: {
PageHeaderWidget: [{ HeaderText: pageHeaderWidgetHeaderText }],
RadioQuestionWidget: [radioQuestionCmsContent],
VehicleBannerWidget: [
{
GenericVehicleImage:
"https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3",
},
],
SiteHeaderWidget: [
{
LogoImage:
"https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3",
},
],
},
yearQuestionInitialData: yearQuestionInitialData,
};
const apiPromise = Promise.resolve(apiResponses);
settleAllPromises.mockImplementation(() => apiPromise);
//Mock year question methods
yearQuestion.methods = {
loadInitialData: jest.fn(),
initializeComponent: jest.fn(),
};
const mountOptions = getMountOptions(mountOptionsMockData);
const wrapper = shallowMount(vehicleYear, mountOptions);
const yearQuestionWrapper = wrapper.findComponent({ name: "yearQuestion" });
yearQuestionWrapper.vm.initializeComponent = yearQuestion.methods.initializeComponent;
return { wrapper, apiPromise };
}