diff --git a/src/layouts/vin-lookup/vin-lookup.spec.js b/src/layouts/vin-lookup/vin-lookup.spec.js index 1c580f4a6..e782f345e 100644 --- a/src/layouts/vin-lookup/vin-lookup.spec.js +++ b/src/layouts/vin-lookup/vin-lookup.spec.js @@ -69,9 +69,38 @@ describe("vin-lookup.vue", () => { expect(wrapper.vm.navigateForward).toHaveBeenCalled(); }); + it("Should do a VIN lookup if the user has clicked on the VIN field and entered a new VIN or changed a previously matched VIN.", async () => { + // Arrange + const { wrapper } = setupMocks({}); + wrapper.vm.vinTouched = true; + wrapper.vm.vin = "foo"; + wrapper.vm.initialVin = "!foo"; + + wrapper.vm.navigateForward = jest.fn(); + const vehicleLookupApiResponse = { + data: { + carId: 'new carId' // does not match the store value + } + }; + const vinPromise = Promise.resolve(vehicleLookupApiResponse); + + wrapper.vm.lookupVehicle = jest.fn().mockImplementation(() => vinPromise); + + // Act + await wrapper.vm.forwardButtonAction(); + + //Assert + expect(wrapper.vm.lookupVehicle).toHaveBeenCalled(); + }); + it("Should not call navigateForward() if the store carId does not match the vin response carId and forward button is clicked", async () => { // Arrange const { wrapper } = setupMocks({}); + // New lookup + wrapper.vm.vinTouched = true; + wrapper.vm.vin = ""; + wrapper.vm.initialVin = "foo"; + const vehicleLookupApiResponse = { data: { carId: 'new carId' // does not match the store value @@ -138,14 +167,21 @@ describe("vin-lookup.vue", () => { it("Should not call navigateForward() when forward button is clicked but lookupVehicle errors out.", async () => { // Arrange const { wrapper } = setupMocks({}); + wrapper.vm.vinTouched = true; + wrapper.vm.vin = "foo"; + wrapper.vm.initialVin = "!foo"; + const vehicleLookupApiResponse = { - data: { + status: { carId: 'new carId' // does not match the store value } }; const vinPromise = Promise.reject(vehicleLookupApiResponse); - wrapper.vm.lookupVehicle = jest.fn().mockImplementation(() => vinPromise); + const response = { + status: 404 + }; + wrapper.vm.lookupVehicle = jest.fn().mockImplementation((response) => vinPromise); wrapper.vm.navigateForward = jest.fn(); wrapper.vm.previouslyEnteredCarId = 'new carId'; diff --git a/src/layouts/vin-lookup/vin-lookup.vue b/src/layouts/vin-lookup/vin-lookup.vue index 33c192941..29aeda5e4 100644 --- a/src/layouts/vin-lookup/vin-lookup.vue +++ b/src/layouts/vin-lookup/vin-lookup.vue @@ -142,6 +142,7 @@ import { Form, defineRule } from "vee-validate"; import { navigateAfterSaveToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper"; import { getFunnelCookie } from "@/helpers/heritage-integration/cookie-helper"; import vinPagesMixin from "@/mixins/vin-pages-mixin"; +import { StatusCodes } from 'http-status-codes'; // DEFINE VALIDATION RULES defineRule("zip-required", required(errorMessages.SERVICE_ZIP_REQUIRED)); @@ -259,7 +260,7 @@ export default { }, setupVinMask() { const lastSixChars = this.initialVin.substring(11, this.initialVin.length); - this.vinMask = `!X!X!X!X!X!X!X!X!X!X!X${lastSixChars}`; + this.vinMask = `!X!X!X!X!X!X!X!X!X!X!X${lastSixChars}`; }, arePagePrerequisitesValid() { return store.getters.vehicle.carId !== null; @@ -304,26 +305,9 @@ export default { } }, async forwardButtonAction() { - // If there is no change to the VIN entered then navigate forward without performing lookup. - if (this.vinPopulatedOnPageLoad && this.vin == this.initialVin) { - this.navigateForward(); - return; - } const zipValidation = this.validateZip(this.zip); - const vehicleLookup = this.lookupVehicle(this.vin); - const zipValidationResponse = await zipValidation; - const vehicleLookupResponse = await vehicleLookup.catch(() => { - this.vinNotFound = true; - this.$refs.funnelFooter.removeLoader(); - this.noServiceZip = false; - return false; - }); - - if (!vehicleLookupResponse) { - return; - } if (!zipValidationResponse.data.isServiceable) { this.customAlertData.zip = this.zip; @@ -333,6 +317,29 @@ export default { return; } + // If the user has clicked on the VIN field, either they are doing a new VIN lookup or changing the VIN previously matched. + // Therefore we need to do a VIN Lookup + let vehicleLookupResponse; + if (this.vinTouched && this.vin != this.initialVin) { + const vinToLookup = this.vinTouched ? this.vin : this.initialVin; + const vehicleLookup = this.lookupVehicle(vinToLookup); + vehicleLookupResponse = await vehicleLookup.catch((response) => { + if (response.status == StatusCodes.NOT_FOUND) { + this.vinNotFound = true; + this.$refs.funnelFooter.removeLoader(); + this.noServiceZip = false; + return false; + } + }); + + if (!vehicleLookupResponse) { + return; + } + } else { + this.navigateForward(); + return; + } + this.isCarIdDifferent = vehicleLookupResponse.data.carId !== store.getters.vehicle.carId; if (this.isCarIdDifferent && (vehicleLookupResponse.data.carId !== this.previouslyEnteredCarId)) {