Update unit test.

src/layouts/vin-lookup/vin-lookup.spec.js

@@ -1 +1,167 @@
-test.todo("some test to be written in the future");
+// Components
+import vinLookup from "@/layouts/vin-lookup/vin-lookup.vue";
+import vehicleDamage from "@/layouts/vehicle-damage/vehicle-damage.vue";
+import funnelHeader from "@/common-components/funnel-header/funnel-header";
+import funnelFooter from "@/common-components/funnel-footer/funnel-footer";
+import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
+import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header";
+import sideDoorOptions from "@/layouts/vehicle-damage/side-door-options/side-door-options";
+import damageLocationQuestion from "@/layouts/vehicle-damage/damage-location-question/damage-location-question";
+import windshieldOptions from "@/layouts/vehicle-damage/windshield-options/windshield-options";
+import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-question/replace-options-question";
+
+// Supporting Files
+import { settleAllPromises } from "@/helpers/layout-helper.js";
+import baseMixin from "@/mixins/base-mixin";
+import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
+import { mount, 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";
+import { damageLocationsSelected } from "@/constants/damage-locations-selected.js";
+
+// 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(),
+}));
+
+// Mock Store
+jest.mock("@/store", () => ({
+  commit: jest.fn(),
+  dispatch: jest.fn(),
+  getters: {
+    vehicle: {
+      carId: "C00000000",
+      image: "test.jpg",
+    },
+    eventBusItem: jest.fn(),
+    damage: {
+      glassToReplace: []
+    },
+  },
+}));
+
+describe("vin-lookup.vue", () => {
+
+  test("Call resetDependentState", async() => {
+    const {wrapper} = setupMocks({});
+    wrapper.vm.resetDependentState();
+    expect(store.dispatch).toBeCalledWith(storeActions.RESET_REGISTRATION_STATE_AND_DEPENDENCIES);
+  });
+
+});
+
+// TEMP
+function setupMocks({
+  pageHeaderWidgetHeaderText = {},
+  mountOptionsMockData = {
+    router: {
+      navigate: jest.fn(),
+    },
+    store: {
+      getters: {
+        vehicle: {},
+      },
+    },
+  },
+}) {
+  //Mock api responses
+  baseMixin.methods.dispatchNonBlockingStoreAction = jest.fn();
+  const apiResponses = {
+    cmsContent: {
+      FunnelSubHeaderWidget: pageHeaderWidgetHeaderText,
+      VehicleBannerWidget: {
+        GenericVehicleImage:
+          "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3",
+      },
+      FunnelHeaderWidget: {
+        LogoImage:
+          "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3",
+      },
+    },
+    damageOptions: {
+      driverSideOptions: {
+        availableReplacementOptions: ["Front", "Back", "Side"],
+      },
+      passengerSideOptions: {
+        availableReplacementOptions: ["Front", "Back", "Side"],
+      },
+      windshieldOptions: {
+        availableReplacementOptions: ["Single", "Driver", "Passenger"],
+      },
+      backGlassOptions: {
+        availableReplacementOptions: ["Front", "Back", "Side"],
+      },
+    },
+  };
+
+  const apiPromise = Promise.resolve(apiResponses);
+
+  settleAllPromises.mockImplementation(() => apiPromise);
+  fetchCmsContentForPage.mockImplementation(() => Promise.resolve());
+
+  //Mock damage initialize methods
+  funnelHeader.methods = {
+    initializeComponent: jest.fn(),
+  };
+
+  vehicleBanner.methods = {
+    initializeComponent: jest.fn(),
+  };
+
+  funnelSubHeader.methods = {
+    initializeComponent: jest.fn(),
+  };
+
+  damageLocationQuestion.methods = {
+    initializeComponent: jest.fn(),
+  };
+
+  sideDoorOptions.methods = {
+    initializeComponent: jest.fn(),
+  };
+
+  windshieldOptions.methods = {
+    initializeComponent: jest.fn(),
+  };
+
+  replaceOptionsQuestion.methods = {
+    initializeComponent: jest.fn(),
+    updateSelectedValues: jest.fn(),
+  };
+
+  funnelFooter.methods = {
+    initializeComponent: jest.fn(),
+  }
+
+  const mountOptions = getMountOptions(mountOptionsMockData);
+  mountOptions['attachTo'] = document.body; // append wrapper to document.body to test DOM methods
+
+  const wrapper = mount(vinLookup, mountOptions);
+
+  const funnelHeaderWrapper = wrapper.findComponent({ name: "funnelHeader" });
+  funnelHeaderWrapper.vm.initializeComponent =
+    funnelHeader.methods.initializeComponent;
+
+  const vehicleBannerWrapper = wrapper.findComponent({ name: "vehicleBanner" });
+  vehicleBannerWrapper.vm.initializeComponent =
+    vehicleBanner.methods.initializeComponent;
+
+  const funnelSubHeaderWrapper = wrapper.findComponent({ name: "funnelSubHeader" });
+  funnelSubHeaderWrapper.vm.initializeComponent =
+    funnelSubHeader.methods.initializeComponent;
+
+  const funnelFooterWrapper = wrapper.findComponent({ name: "funnelFooter" });
+  funnelFooterWrapper.vm.initializeComponent =
+    funnelFooter.methods.initializeComponent;
+
+  return { wrapper, apiPromise };
+}

src/layouts/vin-lookup/vin-lookup.vue

@@ -5,17 +5,17 @@
     <funnelSubHeader ref="funnelSubHeader" />
     <h1>VIN Lookup Placeholder Page</h1>
     <Form
-    @submit="onSubmit"
-    @invalid-submit="onInvalidSubmit"
-    ref="theForm"
-    v-slot="{ meta }"
-    class="d-flex flex-column h-100"
+      @submit="onSubmit"
+      @invalid-submit="onInvalidSubmit"
+      ref="theForm"
+      v-slot="{ meta }"
+      class="d-flex flex-column h-100"
     >
     <funnel-footer
-    ref="funnelFooter"
-    :isDisabled="!meta.valid"
-    @back-clicked="backButtonAction"
-    @ForwardClicked="forwardButtonAction"
+      ref="funnelFooter"
+      :isDisabled="!meta.valid"
+      @back-clicked="backButtonAction"
+      @ForwardClicked="forwardButtonAction"
     />
   </Form>
 </div>
@@ -88,13 +88,7 @@ export default {
       return true;
     },
     resetDependentState() {
-      store.commit(storeMutations.UPDATE_REGISTRATION_ADDRESS, null);
-      store.commit(storeMutations.UPDATE_REGISTRATION_CITY, null);
-      store.commit(storeMutations.UPDATE_REGISTRATION_STATE, null);
-      store.commit(storeMutations.UPDATE_REGISTRATION_ZIP_CODE, null);
-      store.commit(storeMutations.UPDATE_REGISTRATION_FIRST_NAME, null);
-      store.commit(storeMutations.UPDATE_REGISTRATION_LAST_NAME, null);
-      store.commit(storeMutations.UPDATE_REGISTRATION_LICENSE_PLATE, null);
+      store.dispatch(storeActions.RESET_REGISTRATION_STATE_AND_DEPENDENCIES);
     },
     backButtonAction() {
       // route to move backwards

src/store/index.js

@@ -151,7 +151,13 @@ export const mutations = {
     state.order.damage.glassToReplace = null;
   },
   resetRegistrationState(state) {
-
+    state.order.vehicle.registration.licensePlate = null;
+    state.order.vehicle.registration.address = null;
+    state.order.vehicle.registration.city = null;
+    state.order.vehicle.registration.state = null;
+    state.order.vehicle.registration.zipCode = null;
+    state.order.vehicle.registration.firstName = null;
+    state.order.vehicle.registration.lastName = null;
   },
   resetPartsState(state) {
     state.order.lineItems.glassParts = null;