+
+
+ Please wait...
+
+
+ This process can take up 20 seconds.
+
+
@@ -63,6 +71,7 @@ import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-he
import customerQuestions from "@/layouts/address-lookup/customer-questions/customer-questions";
import alert from "@/ux-components/alert/alert";
import textboxQuestion from "@/common-components/textbox-question/textbox-question";
+import loadingModal from '@/common-components/loading-modal/loading-modal.vue';
import { Form } from "vee-validate";
import { defineRule } from "vee-validate";
@@ -263,6 +272,7 @@ export default {
// if multiple cars were found
if (carsFound.find(car => car.carId === carEntered.carId)) {
// and one of them matches the car id entered
+ this.$refs.loadingModal.showModal();
navigateAfterSaveToHeritageFunnel(this.$route);
} else {
// and there is no match, navigate to "address-vehicles" page
@@ -371,6 +381,7 @@ export default {
customerQuestions,
textboxQuestion,
alert,
+ loadingModal,
Form
},
};
diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.spec.js b/src/layouts/license-plate-lookup/license-plate-lookup.spec.js
index 6e6de9349..9afd7e39a 100644
--- a/src/layouts/license-plate-lookup/license-plate-lookup.spec.js
+++ b/src/layouts/license-plate-lookup/license-plate-lookup.spec.js
@@ -1,17 +1,18 @@
// Components
-import vehicleDamage from "@/layouts/license-plate-lookup/license-plate-lookup.vue";
+import licensePlateLookup from "@/layouts/license-plate-lookup/license-plate-lookup.vue";
// Supporting Files
import { settleAllPromises } from "@/helpers/layout-helper.js";
+import * as navigateToHeritage from "@/helpers/heritage-integration/navigation-helper";
import baseMixin from "@/mixins/base-mixin";
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import { shallowMount, flushPromises } from "@vue/test-utils";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
import { nextTick } from "vue";
-import { storeActions } from "@/constants/store-actions";
-import { storeMutations } from "@/constants/store-mutations";
import store from "@/store";
-import { validate } from "vee-validate";
+
+jest.mock('@/assets/img/loader.gif', () => 'loader.gif')
+jest.mock('@/assets/img/windshield.png', () => 'windshield.png')
// Mock our module for promises.
jest.mock("@/helpers/layout-helper.js", () => ({
@@ -29,25 +30,15 @@ jest.mock("@/store", () => ({
dispatch: jest.fn(),
getters: {
order: {
- customer: {
- emailAddress: "test@test.com"
- },
- serviceLocation: {
- zipCode: "43443"
- }
+ customer: { emailAddress: "test@test.com"},
+ serviceLocation: {zip: "11111"},
},
vehicle: {
- carId: "C00000000",
- image: "test.jpg",
- payment: {
- insuranceCoverage: {
- isVerified: false
- }
- },
+ carId: "TESTID",
registration: {
- licensePlate: "HWV4445",
- zipCode: "43224"
- }
+ licensePlate: "TESTPLATE",
+ zipCode: "12345",
+ },
},
eventBusItem: jest.fn(),
damage: {
@@ -62,7 +53,7 @@ describe("license-plate-lookup.vue", () => {
const { wrapper } = setupMocks({});
//Act
- vehicleDamage.beforeRouteEnter.call(
+ licensePlateLookup.beforeRouteEnter.call(
wrapper.vm,
{ query: { fmgPage: "license-plate-lookup" } },
undefined,
@@ -84,7 +75,7 @@ describe("license-plate-lookup.vue", () => {
const { wrapper } = setupMocks({});
//Act
- vehicleDamage.beforeRouteEnter.call(
+ licensePlateLookup.beforeRouteEnter.call(
wrapper.vm,
{ query: { fmgPage: "license-plate-lookup" } },
undefined,
@@ -99,6 +90,340 @@ describe("license-plate-lookup.vue", () => {
});
});
+describe("license-plate-lookup.vue", () => {
+ test("getLicensePlateFromStore returns store license plate", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ // ACT
+ const licensePlate = wrapper.vm.getLicensePlateFromStore();
+
+ // Assert
+ expect(licensePlate).toEqual("TESTPLATE");
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("getRegistrationZipFromStore returns store registration zip", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ // ACT
+ const registrationZip = wrapper.vm.getRegistrationZipFromStore();
+
+ // Assert
+ expect(registrationZip).toEqual("12345");
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("getEmailFromStore returns store customer email", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ // ACT
+ const customerEmail = wrapper.vm.getEmailFromStore();
+
+ // Assert
+ expect(customerEmail).toEqual("test@test.com");
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("getServiceZipFromStore returns store service zip", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ // ACT
+ const serviceZip = wrapper.vm.getServiceZipFromStore();
+
+ // Assert
+ expect(serviceZip).toEqual("11111");
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("Navigate forward should be called and isCarId should be set to false when data entered matches store data on forwardButtonAction click", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ wrapper.vm.validateZip = jest.fn().mockImplementation(() => {
+ return {data: {isServiceable: true}};
+ });
+ wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => {
+ return '';
+ });
+ const vinLookup = {data: {vehicle: {carId: "TESTID"}}}
+ wrapper.vm.lookupVin = jest.fn().mockImplementation(() => {
+ return {catch: () => vinLookup};
+ });
+ wrapper.vm.navigateForward = jest.fn();
+
+ //Act
+ licensePlateLookup.beforeRouteEnter.call(
+ wrapper.vm,
+ { query: { fmgPage: "license-plate-lookup" } },
+ undefined,
+ (c) => c(wrapper.vm)
+ );
+
+ await wrapper.vm.forwardButtonAction();
+
+ //Assert
+ expect(wrapper.vm.navigateForward).toHaveBeenCalled();
+ expect(wrapper.vm.isCarIdDifferent).toEqual(false);
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("Function should stop and datam isRegistrationZipServicable should be set to false when service zip entered returns false on forwardButtonAction click", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ wrapper.vm.validateZip = jest.fn().mockImplementation(() => {
+ return {data: {isServiceable: false}};
+ });
+ wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => {
+ return '';
+ });
+ wrapper.vm.$refs.funnelFooter.removeLoader = jest.fn();
+ //Act
+ licensePlateLookup.beforeRouteEnter.call(
+ wrapper.vm,
+ { query: { fmgPage: "license-plate-lookup" } },
+ undefined,
+ (c) => c(wrapper.vm)
+ );
+
+ await wrapper.vm.forwardButtonAction();
+
+ //Assert
+ expect(wrapper.vm.isRegistrationZipServicable).toEqual(false);
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("Function should stop and datam isCarIdDifferent should be set to true when carId entered doesn't match store carId or previously entered carId on forwardButtonAction click", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ wrapper.vm.validateZip = jest.fn().mockImplementation(() => {
+ return {data: {isServiceable: true}};
+ });
+ wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => {
+ return '';
+ });
+ const vinLookup = {data: {vehicle: {carId: "TESTID1"}}}
+ wrapper.vm.lookupVin = jest.fn().mockImplementation(() => {
+ return {catch: () => vinLookup};
+ });
+ wrapper.vm.$refs.funnelFooter.removeLoader = jest.fn();
+ wrapper.vm.$refs.funnelFooter.updateButtonText = jest.fn();
+
+ //Act
+ licensePlateLookup.beforeRouteEnter.call(
+ wrapper.vm,
+ { query: { fmgPage: "license-plate-lookup" } },
+ undefined,
+ (c) => c(wrapper.vm)
+ );
+
+ await wrapper.vm.forwardButtonAction();
+
+ //Assert
+ expect(wrapper.vm.isCarIdDifferent).toEqual(true);
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("Navigate forward should be called and isCarId should be set to true when carId entered matches previously entered carId and rest of data entered matches store data on forwardButtonAction click", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ wrapper.vm.validateZip = jest.fn().mockImplementation(() => {
+ return {data: {isServiceable: true}};
+ });
+ wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => {
+ return '';
+ });
+ const vinLookup = {data: {vehicle: {carId: "TESTID1"}}}
+ wrapper.vm.lookupVin = jest.fn().mockImplementation(() => {
+ return {catch: () => vinLookup};
+ });
+ wrapper.vm.previouslyEnteredCarId = "TESTID1";
+ wrapper.vm.navigateForward = jest.fn();
+
+ //Act
+ licensePlateLookup.beforeRouteEnter.call(
+ wrapper.vm,
+ { query: { fmgPage: "license-plate-lookup" } },
+ undefined,
+ (c) => c(wrapper.vm)
+ );
+
+ await wrapper.vm.forwardButtonAction();
+
+ //Assert
+ expect(wrapper.vm.navigateForward).toHaveBeenCalled();
+ expect(wrapper.vm.isCarIdDifferent).toEqual(true);
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("Button Text should revert to initial value when licensePlate textfield has new text", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ //Act
+ wrapper.vm.licensePlate = "NEWPLATE";
+ wrapper.vm.getCmsContent = jest.fn();
+ wrapper.vm.$refs.funnelFooter.updateButtonText = jest.fn();
+ await wrapper.vm.$nextTick();
+
+ //Assert
+ expect(wrapper.vm.$refs.funnelFooter.updateButtonText).toHaveBeenCalled();
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("Button Text should revert to initial value when registrationZip textfield has new text", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ //Act
+ wrapper.vm.registrationZip = "55555";
+ wrapper.vm.getCmsContent = jest.fn();
+ wrapper.vm.$refs.funnelFooter.updateButtonText = jest.fn();
+ await wrapper.vm.$nextTick();
+
+ //Assert
+ expect(wrapper.vm.$refs.funnelFooter.updateButtonText).toHaveBeenCalled();
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("Button Text should revert to initial value when serviceZip textfield has new text", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ //Act
+ wrapper.vm.serviceZip = "55555";
+ wrapper.vm.getCmsContent = jest.fn();
+ wrapper.vm.$refs.funnelFooter.updateButtonText = jest.fn();
+ await wrapper.vm.$nextTick();
+
+ //Assert
+ expect(wrapper.vm.$refs.funnelFooter.updateButtonText).toHaveBeenCalled();
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("Dispatch reset damage and dependencies should be called if isCarIdDifferent is true and isSelectedGlassAvailableForVehicle is false when updateCustomerInfo is called", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ //Act
+ wrapper.vm.isCarIdDifferent = true;
+ wrapper.vm.isSelectedGlassAvailableForVehicle = false;
+ wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => {
+ return '';
+ });
+ store.commit = jest.fn();
+ store.dispatch = jest.fn();
+
+ const vehicleInfo = {year: "2020", make: "honda", model: "civic", style: "2 door", carId: "TestId", category: "testCat", imageUrl: "image.jpg", imageVifNumber: "123", imageColor: "blue"}
+ await wrapper.vm.updateCustomerInfo('vin', vehicleInfo, 'registrationState');
+
+ //Assert
+ expect(store.dispatch).toHaveBeenCalled();
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("NavigateAfterSave should be called if isCarIdDifferent is true and isSelectedGlassAvailableForVehicle is false when navigateForward is called", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ //Act
+ wrapper.vm.isCarIdDifferent = true;
+ wrapper.vm.isSelectedGlassAvailableForVehicle = false;
+ wrapper.vm.$router.navigateAfterSave = jest.fn();
+ wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => {
+ return '';
+ });
+ store.dispatch = jest.fn();
+
+ await wrapper.vm.navigateForward();
+
+ //Assert
+ expect(wrapper.vm.$router.navigateAfterSave).toHaveBeenCalled();
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("navigateAfterSaveToHeritageFunnel should be called if isCarIdDifferent is false or isSelectedGlassAvailableForVehicle is true when navigateForward is called", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ //Act
+ wrapper.vm.isCarIdDifferent = false;
+ wrapper.vm.$refs.loadingModal.showModal = jest.fn();
+ wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => {
+ return '';
+ });
+ navigateToHeritage.navigateAfterSaveToHeritageFunnel = jest.fn();
+ await wrapper.vm.navigateForward();
+
+ //Assert
+ expect(navigateToHeritage.navigateAfterSaveToHeritageFunnel).toHaveBeenCalled();
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("dispatch non blocking store action called on validate zip", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ //Act
+ await wrapper.vm.validateZip("12345");
+
+
+ //Assert
+ expect(baseMixin.methods.dispatchStoreAction).toHaveBeenCalled();
+ });
+});
+
+describe("license-plate-lookup.vue", () => {
+ test("dispatch non blocking store action called on lookup vin", async () => {
+
+ // Arrange
+ const { wrapper } = setupMocks({});
+
+ //Act
+ await wrapper.vm.lookupVin("zzz123fqsfwg");
+
+
+ //Assert
+ expect(baseMixin.methods.dispatchStoreAction).toHaveBeenCalled();
+ });
+});
+
+
function setupMocks({
pageHeaderWidgetHeaderText = {},
@@ -106,12 +431,8 @@ function setupMocks({
router: {
navigate: jest.fn(),
},
- store: {
- getters: {
- vehicle: {},
- payment: { insuranceCoverage: { isVerified: false } },
- },
- },
+ licensePlate: "TESTPLATE",
+ registrationZip: "12345"
},
}) {
//Mock api responses
@@ -139,7 +460,7 @@ function setupMocks({
const mountOptions = getMountOptions(mountOptionsMockData);
mountOptions['attachTo'] = document.body; // append wrapper to document.body to test DOM methods
- const wrapper = shallowMount(vehicleDamage, mountOptions);
+ const wrapper = shallowMount(licensePlateLookup, mountOptions);
wrapper.vm.setCmsContent = baseMixin.methods.setCmsContent;
diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.vue b/src/layouts/license-plate-lookup/license-plate-lookup.vue
index cce368d5c..22eec59a3 100644
--- a/src/layouts/license-plate-lookup/license-plate-lookup.vue
+++ b/src/layouts/license-plate-lookup/license-plate-lookup.vue
@@ -1,95 +1,48 @@
- 
+ 
+