From 9a0f97bd0d301f34ba946c2e2d9924ce74d2ff6d Mon Sep 17 00:00:00 2001 From: Leah Schumann Date: Wed, 22 Feb 2023 15:13:37 -0500 Subject: [PATCH 1/4] Added removeLoader test for button-main --- .../button-main/button-main.spec.js | 25 +++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/src/ux-components/button-main/button-main.spec.js b/src/ux-components/button-main/button-main.spec.js index b7fe7df09..32686a70a 100644 --- a/src/ux-components/button-main/button-main.spec.js +++ b/src/ux-components/button-main/button-main.spec.js @@ -77,6 +77,31 @@ describe("buttonMain.vue", () => { const loader = wrapper.find("loader-stub"); expect(loader.attributes("class")).toContain("right"); }); + + it("Should set 'isLoaderDisplayed' to false when calling 'removeLoader'", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + }, + }) + ); + + wrapper.setData({ + isLoaderDisplayed: true + }); + + // Act + wrapper.vm.removeLoader(); + await nextTick(); + + // Assert + const loader = wrapper.find("loader-stub"); + expect(wrapper.vm.isLoaderDisplayed).toBe(false); + }); }); function setupMocks(mountOptionsMockData = {}) { From 0f9c76e8b7cf812e90cba9cc7c65b1e0a527ea50 Mon Sep 17 00:00:00 2001 From: Leah Schumann Date: Wed, 22 Feb 2023 15:46:34 -0500 Subject: [PATCH 2/4] button-main tests to 100% --- .../button-main/button-main.spec.js | 76 +++++++++++++++++++ src/ux-components/button-main/button-main.vue | 1 + 2 files changed, 77 insertions(+) diff --git a/src/ux-components/button-main/button-main.spec.js b/src/ux-components/button-main/button-main.spec.js index 32686a70a..c746bb24d 100644 --- a/src/ux-components/button-main/button-main.spec.js +++ b/src/ux-components/button-main/button-main.spec.js @@ -102,6 +102,82 @@ describe("buttonMain.vue", () => { const loader = wrapper.find("loader-stub"); expect(wrapper.vm.isLoaderDisplayed).toBe(false); }); + + it("Should set 'isLoaderDisplayed' to false when calling 'resetButtonStyle'", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + }, + }) + ); + + wrapper.setData({ + isLoaderDisplayed: true + }); + + // Act + wrapper.vm.resetButtonStyle(); + await nextTick(); + + // Assert + expect(wrapper.vm.isLoaderDisplayed).toBe(false); + + }); + + it("Should emit 'click-event' event when clicking if the button is enabled", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + isDisabled: false + }, + }) + ); + + + const buttonElement = wrapper.find("button"); + + // Act + buttonElement.trigger("click"); + + await nextTick(); + + // Assert + expect(wrapper.emitted("click-event")).toBeTruthy(); + + }); + + it("Should not emit 'click-event' event when clicking if the button is disabled", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + isDisabled: true + }, + }) + ); + + const buttonElement = wrapper.find("button"); + + // Act + buttonElement.trigger("click"); + + await nextTick(); + + // Assert + expect(wrapper.emitted("click-event")).toBeFalsy(); + + }); }); function setupMocks(mountOptionsMockData = {}) { diff --git a/src/ux-components/button-main/button-main.vue b/src/ux-components/button-main/button-main.vue index 18d7427c2..41edc21cb 100644 --- a/src/ux-components/button-main/button-main.vue +++ b/src/ux-components/button-main/button-main.vue @@ -47,6 +47,7 @@ export default { true ); if (!this.isDisabled) { + console.log("I'm here"); this.isLoaderDisplayed = true; this.$emit("click-event"); } From 07a54cbf291049cd43affe3d88708c08ffafe95a Mon Sep 17 00:00:00 2001 From: Leah Schumann Date: Thu, 23 Feb 2023 07:53:17 -0500 Subject: [PATCH 3/4] Added vehicle-protected-question unit tests --- src/digital-components/modal/modal.spec.js | 1 - .../text-block/text-block.spec.js | 5 +- .../vehicle-protected-question.spec.js | 72 +++++++++++++++++++ .../service-zip-question.spec.js | 7 +- .../button-main/button-main.spec.js | 16 ++--- 5 files changed, 83 insertions(+), 18 deletions(-) create mode 100644 src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.spec.js diff --git a/src/digital-components/modal/modal.spec.js b/src/digital-components/modal/modal.spec.js index bcd6303bd..b738ac6ae 100644 --- a/src/digital-components/modal/modal.spec.js +++ b/src/digital-components/modal/modal.spec.js @@ -196,5 +196,4 @@ describe("modal.vue", () => { // Assert expect(hideMock).toHaveBeenCalled(); }); - }); diff --git a/src/digital-components/text-block/text-block.spec.js b/src/digital-components/text-block/text-block.spec.js index 170a91876..89b2fdf36 100644 --- a/src/digital-components/text-block/text-block.spec.js +++ b/src/digital-components/text-block/text-block.spec.js @@ -15,8 +15,8 @@ describe("modal.vue", () => { const wrapper = shallowMount(TextBlock, { mixins: [mockMixin], props: { - customText: "customText" - } + customText: "customText", + }, }); expect(wrapper.html()).toEqual(expect.stringContaining("customText")); @@ -48,7 +48,6 @@ describe("modal.vue", () => { }); expect(wrapper.html()).toEqual(expect.stringContaining(mockProps["fontWeight"])); }); - }); /////////////// diff --git a/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.spec.js b/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.spec.js new file mode 100644 index 000000000..c1e246707 --- /dev/null +++ b/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.spec.js @@ -0,0 +1,72 @@ +import { shallowMount } from "@vue/test-utils"; +import vehicleProtectedQuestion from "./vehicle-protected-question"; + +jest.mock("@/digital-components/textbox-question/textbox-question", () => ({ + getCmsContent: jest.fn(), +})); + +const mockMixin = { + methods: { + getCmsContent: jest.fn((widgetName, cmsFieldName) => { + if (cmsFieldName === "Answers") { + return [ + { + "AnswerImageUrl": "", + "Name": "YesAnswer", + "SubText": "", + "SubWidgetName": "", + "Text": "Yes" + }, + { + "AnswerImageUrl": "", + "Name": "NoAnswer", + "SubText": "", + "SubWidgetName": "", + "Text": "No" + } + ] + } + return "QuestionText"; + }), + }, +}; + +describe("service-zip-question.vue", () => { + it("Should get the modelValue", async () => { + // Arrange + const answer = "YesAnswer"; + const wrapper = shallowMount(vehicleProtectedQuestion, { + mixins: [mockMixin], + props: { + modelValue: answer, + }, + attachTo: document.body, + }); + + // Act + const modelValueAnswer = wrapper.vm.selectedValue; + + // Assert + expect(modelValueAnswer).toEqual(answer); + + }); + + it("Should emit to set value", async () => { + // Arrange + const yesAnswer = "YesAnswer"; + const noAnswer = "NoAnswer" + const wrapper = shallowMount(vehicleProtectedQuestion, { + mixins: [mockMixin], + props: { + modelValue: yesAnswer, + }, + attachTo: document.body, + }); + + // Act + wrapper.vm.selectedValue = noAnswer; + + // Assert + expect(wrapper.emitted("update:modelValue")).toEqual([[noAnswer]]); + }); +}); diff --git a/src/layouts/service-location/service-zip-modal-question/service-zip-question/service-zip-question.spec.js b/src/layouts/service-location/service-zip-modal-question/service-zip-question/service-zip-question.spec.js index d6b861a75..b51ecc9d3 100644 --- a/src/layouts/service-location/service-zip-modal-question/service-zip-question/service-zip-question.spec.js +++ b/src/layouts/service-location/service-zip-modal-question/service-zip-question/service-zip-question.spec.js @@ -14,7 +14,7 @@ describe("service-zip-question.vue", () => { // Act const modelValueText = wrapper.vm.value; - wrapper.vm.value = "test also" + wrapper.vm.value = "test also"; // Assert expect(modelValueText).toEqual("test"); @@ -32,10 +32,9 @@ describe("service-zip-question.vue", () => { // Act const modelValueText = wrapper.vm.value; - wrapper.vm.value = "test also" + wrapper.vm.value = "test also"; // Assert expect(wrapper.emitted("update:modelValue")).toEqual([["test also"]]); - }) - + }); }); diff --git a/src/ux-components/button-main/button-main.spec.js b/src/ux-components/button-main/button-main.spec.js index c746bb24d..41e244a72 100644 --- a/src/ux-components/button-main/button-main.spec.js +++ b/src/ux-components/button-main/button-main.spec.js @@ -91,7 +91,7 @@ describe("buttonMain.vue", () => { ); wrapper.setData({ - isLoaderDisplayed: true + isLoaderDisplayed: true, }); // Act @@ -116,7 +116,7 @@ describe("buttonMain.vue", () => { ); wrapper.setData({ - isLoaderDisplayed: true + isLoaderDisplayed: true, }); // Act @@ -125,7 +125,6 @@ describe("buttonMain.vue", () => { // Assert expect(wrapper.vm.isLoaderDisplayed).toBe(false); - }); it("Should emit 'click-event' event when clicking if the button is enabled", async () => { @@ -136,22 +135,20 @@ describe("buttonMain.vue", () => { props: { loaderPosition: "right", loaderEnabled: true, - isDisabled: false + isDisabled: false, }, }) ); - const buttonElement = wrapper.find("button"); - // Act + // Act buttonElement.trigger("click"); await nextTick(); // Assert expect(wrapper.emitted("click-event")).toBeTruthy(); - }); it("Should not emit 'click-event' event when clicking if the button is disabled", async () => { @@ -162,21 +159,20 @@ describe("buttonMain.vue", () => { props: { loaderPosition: "right", loaderEnabled: true, - isDisabled: true + isDisabled: true, }, }) ); const buttonElement = wrapper.find("button"); - // Act + // Act buttonElement.trigger("click"); await nextTick(); // Assert expect(wrapper.emitted("click-event")).toBeFalsy(); - }); }); From fbbb92c855da40777f1a53aebd67340957ce7423 Mon Sep 17 00:00:00 2001 From: Leah Schumann Date: Thu, 23 Feb 2023 08:51:07 -0500 Subject: [PATCH 4/4] Added .spec file for mobile-location-question --- .../mobile-location-modal-questions.spec.js | 98 +++++++++++++++++++ .../vehicle-protected-question.spec.js | 27 +++-- 2 files changed, 111 insertions(+), 14 deletions(-) create mode 100644 src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.spec.js diff --git a/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.spec.js b/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.spec.js new file mode 100644 index 000000000..9dde622fe --- /dev/null +++ b/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.spec.js @@ -0,0 +1,98 @@ +import { mount, shallowMount } from "@vue/test-utils"; +import mobileLocationModalQuestions from "./mobile-location-modal-questions"; +import crypto from "crypto"; +global.crypto = crypto; + +// const linkWidgetName = "linkWidgetName"; +// const modalWidgetName = "modalWidgetName"; +// const mobileFeeDisclaimerWidgetName = "MobileFeeDisclaimerWidget"; +// const workspaceRequirementsWidgetName = "WorkspaceRequirementsWidget"; + +// const mockLinkCmsContent = { +// BodyText: "Sample link body text here.", +// }; + +// const mockModalCmsContent = { +// FooterText: "Sample modal footer text here.", +// }; + +// const mockMobileFeeCmsContent = { +// Text: "This is the price {custom:mobileFee}", +// }; + +const mockMixin = { + methods: { + getCmsContent: jest.fn((widgetName, cmsFieldName) => { + if (widgetName === linkWidgetName) { + return mockLinkCmsContent[cmsFieldName]; + } + + if (widgetName === modalWidgetName) { + return mockModalCmsContent[cmsFieldName]; + } + + if (widgetName === mobileFeeDisclaimerWidgetName) { + return mockMobileFeeCmsContent[cmsFieldName]; + } + + return null; + }), + + getZipCodeData: jest.fn((zip) => { + if (zip === "43235") { + return { + containsMilitaryBase: false, + isServiceable: true, + isValid: true, + state: "OH", + zipCodeCtu: "01820", + }; + } + + if (zip === "61606") { + return { + containsMilitaryBase: false, + isServiceable: true, + isValid: true, + state: "IL", + zipCodeCtu: "01526", + }; + } + + return { + containsMilitaryBase: false, + isServiceable: false, + isValid: false, + state: null, + zipCodeCtu: null, + }; + }), + }, +}; + +describe("mobile-location-modal-questions.vue", () => { + it("Initial state on load with no existing location info", async () => { + let mobileLocationQuestions = { + addressQuestions: { + streetAddress: "", + apartmentNumberOrBusinessName: "", + city: "", + state: "", + zipCode: "", + }, + isVehicleProtected: null, + }; + + // Arrange + const wrapper = shallowMount(mobileLocationModalQuestions, { + mixins: [mockMixin], + props: { + modelValue: mobileLocationQuestions, + }, + attachTo: document.body, + }); + + // Assert + //expect(wrapper.html()).toEqual(expect.stringContaining(mockLinkCmsContent["BodyText"])); + }); +}); diff --git a/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.spec.js b/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.spec.js index c1e246707..72d299198 100644 --- a/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.spec.js +++ b/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.spec.js @@ -11,20 +11,20 @@ const mockMixin = { if (cmsFieldName === "Answers") { return [ { - "AnswerImageUrl": "", - "Name": "YesAnswer", - "SubText": "", - "SubWidgetName": "", - "Text": "Yes" + AnswerImageUrl: "", + Name: "YesAnswer", + SubText: "", + SubWidgetName: "", + Text: "Yes", }, { - "AnswerImageUrl": "", - "Name": "NoAnswer", - "SubText": "", - "SubWidgetName": "", - "Text": "No" - } - ] + AnswerImageUrl: "", + Name: "NoAnswer", + SubText: "", + SubWidgetName: "", + Text: "No", + }, + ]; } return "QuestionText"; }), @@ -48,13 +48,12 @@ describe("service-zip-question.vue", () => { // Assert expect(modelValueAnswer).toEqual(answer); - }); it("Should emit to set value", async () => { // Arrange const yesAnswer = "YesAnswer"; - const noAnswer = "NoAnswer" + const noAnswer = "NoAnswer"; const wrapper = shallowMount(vehicleProtectedQuestion, { mixins: [mockMixin], props: {