DigitalConsumer.FixMyGlass/src/layouts/vehicle-style/style-question/style-question.spec.js
2021-12-21 11:54:22 -05:00

82 lines
No EOL
2.5 KiB
JavaScript
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import styleQuestion from "@/layouts/vehicle-style/style-question/style-question";
import { shallowMount } from "@vue/test-utils";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
import store from "@/store";
jest.mock("@/store", () => { return {}; }, {virtual: true});
describe("style-question.vue", () => {
test("Selected style is emitted upon selection.", async () => {
//Arrange
const { wrapper } = setupMocks({ modelValueProp: "2 Door" });
const styleToSelect = "4 Door";
//Act
wrapper.setData({ selectedStyle: styleToSelect });
await wrapper.vm.$nextTick();
//Assert
expect(wrapper.emitted()["update:modelValue"][0]).toEqual(["4 Door"]);
});
});
describe("style-question.vue", () => {
test("CMS question text is used as radio question text.", async () => {
//Arrange
const { wrapper, cmsContent } = setupMocks({ cmsQuestionText: "What style is your vehicle?" });
//Act
styleQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, null);
//Assert
const buttonQuestionComponent = await wrapper.findComponent({ name: "buttonQuestion" });
expect(buttonQuestionComponent.attributes("questiontext")).toBe("What style is your vehicle?");
});
});
describe("style-question.vue", () => {
test("Data from store api are used as radio question answers.", async () => {
//Arrange
const { wrapper, cmsContent } = setupMocks({ dataFromStoreApi: ["2 Door", "4 Door"] });
//Act
const initialData = styleQuestion.methods.loadInitialData.call(wrapper.vm);
styleQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, initialData);
//Assert
const buttonQuestionComponent = await wrapper.findComponent({ name: "buttonQuestion" });
expect(buttonQuestionComponent.attributes("answers")).toBe("2 Door,4 Door");
});
});
function setupMocks({
modelValueProp = "1900",
cmsQuestionText = "CMS text goes here",
dataFromStoreApi = [],
}) {
//Mock store
store.dispatch = jest.fn(() => dataFromStoreApi);
store.getters = { vehicle: {year: 2019, make: 'honda', model: 'civc'} };
const mountOptions = getMountOptions({
store: {
dispatch: store.dispatch,
getters: store.getters,
},
});
//Mock props
mountOptions.propsData = {
modelValue: modelValueProp,
};
const wrapper = shallowMount(styleQuestion, mountOptions);
//Mock CMS content
const cmsContent = {
QuestionText: cmsQuestionText
};
return { wrapper, cmsContent };
}