Merge pull request #99 from Safelite/feature/digital/SSR-178

Feature/digital/ssr 178

src/constants/application-config.js

@@ -8,6 +8,7 @@ const applicationConfig = {
     SITE_ENTRY_TRIGGER_VALUE: "SelfService",
     APPLICATION_ABBREVIATION: "iss",
     PAGE_QUERYSTRING: 'issPage',
+    ISS_DEV_CMS_DOMAIN: "https://digitalisscms.dev.safelite.io",
   };
   
   export { applicationConfig };

src/constants/endpoints.js

@@ -63,6 +63,10 @@ const endpoints = {
     url: "/vehicle/api/v1/vehicle/lookup",
     method: "POST",
   },
+  LookupVinByPlate: {
+    url: "/vehicle/api/v1/vehicle/lookup-vin-by-plate",
+    method: "POST",
+  },
   InitializeSession: {
       url: "/analytics/api/v1/analytics/initialize",
       method: "POST",

src/layouts/license-plate-lookup/license-plate-lookup-alerts.spec.js

@@ -0,0 +1,63 @@
+/* eslint-env jest */
+import { getDamageString } from '@/helpers/damage-helper';
+import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types';
+import { RouterLinkStub } from '@vue/test-utils';
+import { render } from '@testing-library/vue';
+import '@testing-library/jest-dom';
+import LicensePlateLookupAlertsComponent from './license-plate-lookup-alerts/license-plate-lookup-alerts.vue';
+
+jest.mock('@/helpers/damage-helper');
+
+const mountOptions = {
+    global: {
+        stubs: {
+            RouterLink: RouterLinkStub,
+        },
+        mixins: [
+            {
+                methods: {
+                    getCmsContent: jest.fn(() => ''),
+                    getFooterInfoBoxHeight: jest.fn(() => 80),
+                    cssClassNameForCmsWidget: jest.fn(() => 'widget-name-mock-class'),
+                },
+            },
+        ],
+    },
+};
+
+describe('license-plate-lookup-alerts.vue', () => {
+    test('VehicleNotFoundAlert is displayed on the screen', () => {
+        // Arrange
+        mountOptions.props = {
+            activeAlertType: vehicleLookupAlertTypes.NOT_FOUND,
+        };
+
+        // Act
+        const { queryByRole } = render(LicensePlateLookupAlertsComponent, mountOptions);
+        const VehicleNotFoundAlert = queryByRole('alert', { name: 'vehicle-not-found-alert' });
+        const VehicleNotMatchedAlert = queryByRole('alert', { name: 'vehicle-not-matched-alert'});
+
+        // Assert
+        expect(VehicleNotFoundAlert).toBeVisible();
+        expect(VehicleNotMatchedAlert).toEqual(null);
+    });
+
+    test('VehicleNotMatchedAlert is displayed on the screen', () => {
+        // Arrange
+        getDamageString.mockImplementation(() => 'Mock Damage String');
+        mountOptions.props = {
+            activeAlertType: vehicleLookupAlertTypes.NOT_MATCHED,
+        };
+
+        // Act
+        const { queryByRole } = render(LicensePlateLookupAlertsComponent, mountOptions);
+        const VehicleNotFoundAlert = queryByRole('alert', { name: 'vehicle-not-found-alert' });
+        const VehicleNotMatchedAlert = queryByRole('alert', { name: 'vehicle-not-matched-alert'});
+
+        // Assert
+        expect(VehicleNotMatchedAlert).toBeVisible();
+        expect(VehicleNotFoundAlert).toEqual(null);
+    });
+
+
+})

src/layouts/license-plate-lookup/license-plate-lookup-alerts/license-plate-lookup-alerts.vue

@@ -0,0 +1,49 @@
+<template>
+    <div
+      id="vin-lookup-alerts-wrapper"
+      :class="wrapperCssClass"
+    >
+      <vehicleNotFoundAlert
+        v-if="isVehicleNotFoundVisible"
+      />
+      <vehicleNotMatchedAlert
+        v-else-if="isVehicleNotMatchedVisible"
+      />
+    </div>
+  </template>
+  <script>
+  import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types';
+  import vehicleNotFoundAlert from '@/layouts/license-plate-lookup/license-plate-lookup-alerts/vehicle-not-found-alert/vehicle-not-found-alert.vue';
+  import vehicleNotMatchedAlert from '@/layouts/license-plate-lookup/license-plate-lookup-alerts/vehicle-not-matched-alert/vehicle-not-matched-alert.vue';
+  
+  export default {
+    name: 'license-plate-lookup-alerts',
+    components: {
+      vehicleNotFoundAlert,
+      vehicleNotMatchedAlert,
+    },
+    props: {
+      activeAlertType: {
+        type: String,
+        validator(value) {
+          const acceptedValues = [null];
+          acceptedValues.push(...Object.values(vehicleLookupAlertTypes));
+          return acceptedValues.includes(value);
+        },
+      },
+    },
+    computed: {
+      isVehicleNotFoundVisible() {
+        return this.activeAlertType === vehicleLookupAlertTypes.NOT_FOUND;
+      },
+      isVehicleNotMatchedVisible() {
+        return this.activeAlertType === vehicleLookupAlertTypes.NOT_MATCHED;
+      },
+      wrapperCssClass() {
+        return {
+          'mb-5': this.activeAlertType !== null,
+        };
+      },
+    },
+  };
+  </script>

src/layouts/license-plate-lookup/license-plate-lookup-alerts/vehicle-not-found-alert/vehicle-not-found-alert.vue

@@ -0,0 +1,27 @@
+<template>
+    <alert
+      alert-class="alert-danger"
+      cms-widget-name="AlertVinNotFoundWidget"
+      id="vehicle-not-found-alert"
+      aria-label="vehicle-not-found-alert"
+    />
+  </template>
+  <script>
+  import alert from '@/ux-components/alert/alert.vue';
+  
+  export default {
+    name: 'vehicle-not-found-alert',
+    components: {
+      alert,
+    },
+  };
+  </script>
+  <style>
+  /**
+    Override wrong margin-bottom rule in the Alert component.
+  */
+  #vehicle-not-found-alert p:last-of-type {
+    margin-bottom: 0 !important;
+  }
+  </style>
+  

src/layouts/license-plate-lookup/license-plate-lookup-alerts/vehicle-not-matched-alert/vehicle-not-matched-alert.vue

@@ -0,0 +1,50 @@
+<template>
+    <alert
+      alert-class="alert-warning"
+      cms-widget-name="AlertMatchedDifferentVehicleWidget"
+      :manual-copy="body"
+      :manual-headline="header"
+      aria-label="vehicle-not-matched-alert"
+    />
+  </template>
+  <script>
+  import { getDamageString } from '@/helpers/damage-helper';
+  
+  import alert from '@/ux-components/alert/alert.vue';
+  
+  export default {
+    name: 'vehicle-not-matched-alert',
+    components: {
+      alert,
+    },
+    inject: ['vehicleFromLookup'],
+    computed: {
+      header() {
+        return (
+          this.getCmsContent('AlertMatchedDifferentVehicleWidget', 'HeadlineText')
+            .replaceAll('{custom:damage}', getDamageString())
+        );
+      },
+      body() {
+        let year = '';
+        let make = '';
+        let model = '';
+  
+        if (this.vehicleFromLookup) {
+          year = this.vehicleFromLookup.year;
+          make = this.vehicleFromLookup.make;
+          model = this.vehicleFromLookup.model;
+        }
+  
+        return (
+          this.getCmsContent('AlertMatchedDifferentVehicleWidget', 'BodyText')
+            .replaceAll('{custom:damage}', getDamageString())
+            .replaceAll('{custom:vinlookupYear}', year)
+            .replaceAll('{custom:vinlookupMake}', make)
+            .replaceAll('{custom:vinlookupModel}', model)
+        );
+      },
+    },
+  };
+  </script>
+  

src/layouts/license-plate-lookup/license-plate-lookup.spec.js

@@ -0,0 +1,172 @@
+// Components
+import licensePlateLookup from "@/layouts/license-plate-lookup/license-plate-lookup.vue";
+import licensePlateQuestion from "@/layouts/license-plate-lookup/license-plate-question/license-plate-question.vue";
+
+// Supporting files
+import { shallowMount } from '@vue/test-utils';
+import { settleAllPromises } from "@/helpers/layout-helper.js";
+import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
+import baseMixin from "@/mixins/base-mixin.js";
+import { getMountOptions } from "@/helpers/unit-test-helper.js";
+import { nextTick } from "vue";
+import { useMainStore } from "@/store";
+import { applicationConfig } from "@/constants/application-config";
+
+// 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 damage helper
+jest.mock("@/helpers/damage-helper", () => ({
+    isGlassAvailableForCarId: () => {
+        return false;
+    },
+    getDamageString: () => {
+        return "damage string";
+    },
+}));
+
+describe("license-plate-lookup.vue", () => {
+    test("Vehicle make set, arePagePrerequisitesValid should be true", () => {
+        //Arrange
+        const { wrapper } = setupMocks({});
+        useMainStore().order.vehicle.carId = "CR00000395";
+
+        //Act
+        licensePlateLookup.beforeRouteEnter.call(
+        wrapper.vm,
+        { query: { issPage: "license-plate-lookup" } },
+        undefined,
+        (c) => c(wrapper.vm)
+        );
+
+        let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
+
+        //Assert
+        expect(arePagePrerequisitesValid).toBe(true);
+    });
+});
+
+describe("navigation", () => {
+    test("BackButtonAction triggers a router.navigate change", async () => {
+      //Arrange
+      const { wrapper, apiPromise } = setupMocks({
+        mountOptionsMockData: {
+          router: {
+            navigate: jest.fn(),
+          },
+        },
+      });
+      //Act
+      licensePlateLookup.beforeRouteEnter.call(
+        wrapper.vm,
+        { query: { issPage: "license-plate-lookup" } },
+        undefined,
+        (c) => c(wrapper.vm)
+      );
+      wrapper.vm.backButtonAction();
+      await nextTick();
+  
+      //Assert
+      return apiPromise.finally(() => {
+        try {
+            expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
+        }
+        catch (e) {
+            throw e
+        }
+      });
+    });
+
+    // TODO: Create test for navigating forward when user clicks Continue
+    // and information entered is correct (no alerts)
+    
+    // TODO: Create test for license-plate-question component emitting value when user clicks Continue
+    // and information entered is correct (no alerts)
+
+    // TODO: Create test for zip-question component emitting value when user clicks Continue
+    // and information entered is correct (no alerts)
+  
+    // *The above will be completed when navigation from page is complete (SSR-179)
+  });
+
+function setupMocks({
+    licensePlateQuestionCmsContent = {},
+    licensePlateQuestionInitialData = {},
+    pageHeaderWidgetHeaderText = {},
+    pageFooterWidgetCmsContent = {},
+    mountOptionsMockData = {},
+    //Values to set in the state store
+    carId = null,
+    registrationZipCode = null, //"55555",
+    licensePlate = null, //"TESTPLATE",
+}) {
+    //Mock api responses
+    const apiResponses = {
+      cmsContent: {
+        SiteSubHeaderWidget: pageHeaderWidgetHeaderText,
+        LicensePlateQuestion: licensePlateQuestionCmsContent,
+        VehicleBannerWidget: {
+          GenericVehicleImage:
+            `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`,
+        },
+        SiteHeaderWidget: {
+          LogoImage:
+            `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`,
+        },
+        SiteFooterWidget: pageFooterWidgetCmsContent,
+        
+      },
+      licensePlateQuestionInitialData: licensePlateQuestionInitialData,
+    };
+  
+    mountOptionsMockData = {
+        ...mountOptionsMockData,
+        router: {
+            navigate: jest.fn(),
+            navigateWithoutSaving: jest.fn(),
+            navigateWithSaving: jest.fn(),
+        },
+        store: {
+            getters: {
+                vehicle: {
+                    registration: {
+                        licensePlate: licensePlate,
+                        zipCode: registrationZipCode,
+                    },
+                    carId: carId,
+                },
+            },
+        },
+    };
+
+    
+    const apiPromise = Promise.resolve(apiResponses);
+  
+    settleAllPromises.mockImplementation(() => apiPromise);
+    fetchCmsContentForPage.mockImplementation(() => Promise.resolve());
+  
+    //Mock make question methods
+    licensePlateQuestion.methods = {
+      loadInitialData: jest.fn(),
+      initializeComponent: jest.fn(),
+    };
+  
+    const mountOptions = getMountOptions(mountOptionsMockData);
+    
+    const wrapper = shallowMount(licensePlateLookup, mountOptions);
+  
+    const licensePlateQuestionWrapper = wrapper.findComponent({ name: "licensePlateQuestion" });
+    licensePlateQuestionWrapper.vm.initializeComponent =
+      licensePlateQuestion.methods.initializeComponent;
+    
+    wrapper.vm.setCmsContent = baseMixin.methods.setCmsContent;
+    
+    return { wrapper, apiPromise };
+  }  

src/layouts/license-plate-lookup/license-plate-lookup.vue

@@ -1,53 +1,86 @@
 <template>  
-  <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit">
+  <Form 
+      @submit="onSubmit"
+      @invalid-submit="onInvalidSubmit"
+      v-slot="{ meta }">
     <div class="page-container-grouped-styles overflow-auto">
-      <SiteHeader
+      <siteHeader cms-widget-name="SiteHeaderWidget" />
-        cms-widget-name="SiteHeaderWidget"
+      <vehicleBanner
-      />
-      <VehicleBanner
         cms-widget-name="VehicleBannerWidget"
-        :display-generic-vehicle-image="false"
+        :display-generic-vehicle-image="false" />
-      />
+      <siteSubHeader cms-widget-name="SiteSubHeaderWidget" />
-      <SiteSubHeader
+      <div class="fade-on-route-transition sub-container make-tall mt-5">
-        cms-widget-name="SiteSubHeaderWidget"
+        <licensePlateLookupAlerts
-      />
+          :activeAlertType="activeVehicleLookupAlertType"
-      <div class="fade-on-route-transition sub-container make-tall">
+        />
-        <p>License Plate Lookup Page Placeholder</p>
+        <licensePlateQuestion
-        <SiteFooter
+          v-model="licensePlate"/>
+        <zipQuestion
+          v-model="registrationZipCode"
+          class="mt-4" />
+        <siteFooter
+          :isForwardActionDisabled="!meta.valid"
           cms-widget-name="SiteFooterWidget"
-          :is-forward-action-disabled="isForwardActionDisabled"
           @back-clicked="backButtonAction"
           @forward-clicked="forwardButtonAction"
-        />
+          ref="siteFooter" />
       </div>
     </div>
   </Form>
 </template>
 <script>
 // Import Supporting Files
+import { computed } from 'vue';
+import { endpoints } from '@/constants/endpoints';
+import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types';
+import globalMethods from '@/global-methods';
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
 import { settleAllPromises } from '@/helpers/layout-helper';
-import { Form } from 'vee-validate';
+import { useMainStore } from '@/store';
-import BaseFormMixin from '@/mixins/base-form-mixin.js';
 
 // Import Component
-import SiteFooter from '@/common-components/site-footer/site-footer.vue';
+import baseFormMixin from '@/mixins/base-form-mixin';
-import SiteHeader from '@/common-components/site-header/site-header.vue';
+import { Form } from 'vee-validate';
-import SiteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
+import siteFooter from '@/common-components/site-footer/site-footer.vue';
-import VehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
+import siteHeader from '@/common-components/site-header/site-header.vue';
+import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
+import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
+import textboxQuestion from '@/common-components/textbox-question/textbox-question.vue';
+import licensePlateQuestion from '@/layouts/license-plate-lookup/license-plate-question/license-plate-question.vue';
+import zipQuestion from '@/layouts/license-plate-lookup/zip-question/zip-question.vue';
+import licensePlateLookupAlerts from '@/layouts/license-plate-lookup/license-plate-lookup-alerts/license-plate-lookup-alerts.vue';
 
 export default {
   name: 'license-plate-lookup',
-  mixins: [BaseFormMixin],
+  mixins: [baseFormMixin],
   components: {
     Form,
-    SiteFooter,
+    siteFooter,
-    SiteHeader,
+    siteHeader,
-    SiteSubHeader,
+    siteSubHeader,
-    VehicleBanner,    
+    vehicleBanner,
+    textboxQuestion,
+    licensePlateQuestion,
+    zipQuestion,
+    licensePlateLookupAlerts
+  },
+  setup() {
+    const mainStore = useMainStore();
+
+    return { mainStore };
   },
   data() {
-    return {};
+    return {
+      activeVehicleLookupAlertType: null,
+      vehicleFromLookup: null,
+      licensePlate: null, 
+      registrationZipCode: null,
+   };
+  },
+  provide() {
+    return {
+      vehicleFromLookup: computed(() => this.vehicleFromLookup),
+    };
   },
   async beforeRouteEnter(to, from, next) {
     const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
@@ -66,14 +99,12 @@ export default {
       vm.setCmsContent(resultMap.cmsContent);      
     });
   },
-  computed: {
-    isForwardActionDisabled() {
-      return true;
-    }
-  },
   methods: {
-    arePagePrerequisiteValid() {      
+    arePagePrerequisitesValid() {      
-      return true;
+      if (this.mainStore.order.vehicle.carId) {
+          return true;
+      }
+      return false;
     },
     backButtonAction() {
       /**
@@ -81,8 +112,56 @@ export default {
        */
       this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
     },
-    forwardButtonAction() {
+    async forwardButtonAction() {
-      return true;
+      this.resetActiveAlert();
+
+      // NOTE: If form is not valid, this method is not called when 'Continue' button is clicked
+      const vehicleLookupResponse = await this.lookupVinByPlate(this.licensePlate);
+
+      if (vehicleLookupResponse.error) {
+        this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NOT_FOUND;
+        this.resetVehicleFromLookup();
+        this.$refs.siteFooter.removeLoader();
+        return;
+      }
+
+      this.vehicleFromLookup = vehicleLookupResponse.data.vehicle;
+      if (this.vehicleFromLookup.carId !== this.mainStore.vehicle.carId) {
+        this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NOT_MATCHED;
+
+        const vehicleYearMakeModel = `${this.vehicleFromLookup.year} ${this.vehicleFromLookup.make} ${this.vehicleFromLookup.model}`;
+
+        this.$refs.siteFooter.updateButtonText(`Continue with ${vehicleYearMakeModel}`);
+        this.$refs.siteFooter.removeLoader();
+      }
+
+      // Continue
+    },
+    async lookupVinByPlate(licensePlate) {
+      try {
+        const response = await globalMethods.callHttpClient({
+          method: endpoints.LookupVinByPlate.method,
+          endpoint: endpoints.LookupVinByPlate.url,
+          payload: {
+            licensePlate,
+            licenseState: "IL" // hard coded until Welcome Page is complete and license state can be pulled from store
+          },
+        });
+
+        return response;
+      } catch (responseError) {
+        return {
+          error: {
+            status: responseError.status,
+          },
+        };
+      }
+    },
+    resetActiveAlert() {
+      this.activeVehicleLookupAlertType = null;
+    },
+    resetVehicleFromLookup() {
+      this.vehicleFromLookup = null;
     },
     resetDependentState() {},
   },

src/layouts/license-plate-lookup/license-plate-question/license-plate-question.vue

@@ -0,0 +1,43 @@
+<template>
+    <textboxQuestion
+        inputId="license-plate-question"
+        cmsWidgetName="LicensePlateNumberQuestionWidget"
+        v-model="licensePlate"
+        isRequired 
+        disableAutoFill
+        validationRules="license-plate-required"
+    />
+</template>
+<script>
+  // Import Other Supporting File(s)
+  import { defineRule } from 'vee-validate';
+  import { required } from '@/helpers/validation-rules';
+  import { errorMessages } from '@/constants/error-messages';
+  
+  // Import Component(s)
+  import textboxQuestion from '@/common-components/textbox-question/textbox-question.vue';
+  
+defineRule("license-plate-required", required(errorMessages.LICENSE_PLATE_REQUIRED));
+  
+export default {
+    name: 'license-plate-question',
+    props: {
+      modelValue: String,
+    },
+    emits: ['update:modelValue'],
+    components: {
+      textboxQuestion,
+    },
+    computed: {
+      licensePlate: {
+        get() {
+          return this.modelValue;
+        },
+        set(newValue) {
+          this.$emit('update:modelValue', newValue);
+        },
+      },
+    },
+  };
+  </script>
+  

src/layouts/license-plate-lookup/zip-question/zip-question.vue

@@ -0,0 +1,44 @@
+<template>
+    <textboxQuestion
+        inputId="zip"
+        cmsWidgetName="RegistrationZipQuestionWidget"
+        v-model="registrationZipCode"
+        isRequired
+        disableAutoFill
+        validationRules="zip-required|zip-format"
+    />
+</template>
+<script>
+// Import Other Supporting File(s)
+import { defineRule } from 'vee-validate';
+import { regex, required } from '@/helpers/validation-rules';
+import { errorMessages } from '@/constants/error-messages';
+  
+// Import Component(s)
+import textboxQuestion from '@/common-components/textbox-question/textbox-question.vue';
+  
+defineRule("zip-required", required(errorMessages.REGISTRATION_ZIP_REQUIRED));
+defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.ZIP_FORMAT));
+  
+export default {
+    name: 'zip-question',
+    props: {
+      modelValue: String,
+    },
+    emits: ['update:modelValue'],
+    components: {
+      textboxQuestion,
+    },
+    computed: {
+      registrationZipCode: {
+        get() {
+          return this.modelValue;
+        },
+        set(newValue) {
+          this.$emit('update:modelValue', newValue);
+        },
+      },
+    },
+  };
+  </script>
+  

src/layouts/vehicle-make/vehicle-make.spec.js

@@ -6,6 +6,7 @@ import baseMixin from "@/mixins/base-mixin.js";
 import { getMountOptions } from "@/helpers/unit-test-helper.js";
 import { nextTick } from "vue";
 import { useMainStore } from "@/store";
+import { applicationConfig } from "@/constants/application-config";
 
 // Components
 import vehicleMake from "@/layouts/vehicle-make/vehicle-make.vue";
@@ -119,12 +120,12 @@ function setupMocks({
       VehicleMakeQuestion: vehicleMakeQuestionCmsContent,
       VehicleBannerWidget: {
         GenericVehicleImage:
-          "https://digitalisscms.dev.safelite.io/images/default-source/default-album/blurred-image.jpg",
+          `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`,
-      },
+        },
       SiteHeaderWidget: {
         LogoImage:
-          "https://digitalisscms.dev.safelite.io/images/default-source/default-album/logos/insuranceLogo.jpg",
+          `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`,
-      },
+        },
     },
     makeQuestionInitialData: makeQuestionInitialData,
   };

src/layouts/vehicle-model/vehicle-model.spec.js

@@ -11,6 +11,7 @@ import baseMixin from "@/mixins/base-mixin.js";
 import { getMountOptions } from "@/helpers/unit-test-helper.js";
 import { nextTick } from "vue";
 import { useMainStore } from "@/store";
+import { applicationConfig } from "@/constants/application-config";
 
 // Mock our module for promises.
 jest.mock("@/helpers/layout-helper.js", () => ({
@@ -120,12 +121,12 @@ function setupMocks({
       VehicleModelQuestion: buttonQuestionContent,
       VehicleBannerWidget: {
         GenericVehicleImage:
-        "https://digitalisscms.dev.safelite.io/images/default-source/default-album/blurred-image.jpg",
+          `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`,
-      },
+        },
       SiteHeaderWidget: {
         LogoImage:
-        "https://digitalisscms.dev.safelite.io/images/default-source/default-album/logos/insuranceLogo.jpg",
+          `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`,
-      },
+        },
     },
     modelQuestionInitialData: modelQuestionInitialData,
   };

src/layouts/vehicle-parts/vehicle-parts.spec.js

@@ -11,7 +11,7 @@ import { nextTick } from "vue";
 import baseMixin from "@/mixins/base-mixin.js";
 import { useMainStore } from "@/store";
 import { navigationScenarios } from "@/router/router-constants/navigation-scenarios";
-
+import { applicationConfig } from "@/constants/application-config";
 
 // Mock our module for promises.
 jest.mock("@/helpers/layout-helper.js", () => ({
@@ -387,11 +387,11 @@ function setupMocks({ pageHeaderWidgetHeaderText = {}, mountOptionsMockData = {}
             SiteSubHeaderWidget: pageHeaderWidgetHeaderText,
             VehicleBannerWidget: {
                 GenericVehicleImage:
-                    "https://digitalisscms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3",
+                    `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`,
             },
             FunnelHeaderWidget: {
                 LogoImage:
-                    "https://digitalisscms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3",
+                    `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`,
             },
             ColorQuestionWidget: "Please choose your rear window tint color",
             FeatureQuestionWidget: "Ok no choose features",

src/layouts/vehicle-style/vehicle-style.spec.js

@@ -7,6 +7,7 @@ import { getMountOptions } from "@/helpers/unit-test-helper.js";
 import { nextTick } from "vue";
 import { useMainStore } from "@/store";
 import router from "@/router";
+import { applicationConfig } from "@/constants/application-config";
 
 // Components
 import vehicleStyle from "@/layouts/vehicle-style/vehicle-style.vue";
@@ -175,12 +176,12 @@ function setupMocks({
             VehicleStyleQuestion: vehicleStyleQuestionCmsContent,
             VehicleBannerWidget: {
                 GenericVehicleImage:
-                    "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3",
+                    `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`,
-            },
+                },
             SiteHeaderWidget: {
                 LogoImage:
-                    "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3",
+                    `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`,
-            },
+        },
         },
         styleQuestionInitialData: styleQuestionInitialData,
     };

src/layouts/vehicle-year/vehicle-year.spec.js

@@ -6,6 +6,7 @@ import yearQuestion from "@/layouts/vehicle-year/year-question/year-question";
 import baseMixin from "@/mixins/base-mixin.js";
 import { getMountOptions } from "@/helpers/unit-test-helper.js";
 import { nextTick } from "vue";
+import { applicationConfig } from "@/constants/application-config";
 
 
 // Mock our module for promises.
@@ -83,12 +84,12 @@ function setupMocks({
       VehicleYearQuestion: vehicleYearQuestionCmsContent,
       VehicleBannerWidget: {
         GenericVehicleImage:
-          "https://digitalisscms.dev.safelite.io/images/default-source/default-album/blurred-image.jpg",
+          `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`,
-      },
+        },
       SiteHeaderWidget: {
         LogoImage:
-          "https://digitalisscms.dev.safelite.io/images/default-source/default-album/logos/insuranceLogo.jpg",
+          `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`,
-      },
+        },
     },
     yearQuestionInitialData: yearQuestionInitialData,
   };

src/router/router-constants/routing-table.js

@@ -103,6 +103,15 @@ const routingTable = function(store) {
           },          
       ],
     },
+    {
+      issPageValue: issPageValues.LICENSE_PLATE_LOOKUP,
+      maps: [
+          {
+              scenario: navigationScenarios.CLICKED_BACK,
+              destinationIssPageValue: issPageValues.VEHICLE_LOOKUP,
+          },          
+      ],
+    },
     {
       issPageValue: issPageValues.PART_QUESTIONS,
       maps: [