Merge pull request #301 from Safelite/feature/Digital/SSR-462

Feature/digital/ssr 462

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

@@ -26,6 +26,14 @@ const lookupVehicleByVin = {
     },
   },
 };
+const lookupVehicleByVinError = {
+  methodName: 'lookupVehicleByVin',
+  mockResponse: {
+    data: {
+      error: true,
+    },
+  },
+};
 const getPartsOrQuestions = {
   methodName: 'getPartsOrQuestions',
   mockResponse: null,
@@ -457,6 +465,34 @@ describe('vin-lookup.vue', () => {
             );
         });
       });
+
+      test("Selected vehicle VIN do not match vehicles (CarIDs) in our system then navigate forward to bailout page.", async () => {
+        //Arrange
+        const user = userEvent.setup();
+        lookupVehicleByVin.mockResponse.data.error = true;
+
+        jest.spyOn(VinLookupComponent.methods, lookupVehicleByVin.methodName)
+        .mockResolvedValue(lookupVehicleByVinError.mockResponse);
+
+        mountOptions.data = () => ({
+          needToLookupVehicle: true,
+          bailout: true,
+          vin: mockValidVin,
+        });
+
+        const { container } = render(VinLookupComponent, mountOptions);
+        const continueButton = container.querySelector(continueButtonQuerySelector);
+      await user.click(continueButton);
+
+      await flushPromises();
+      await waitFor(() => {
+        expect(mockRouter.navigate).toHaveBeenCalledTimes(1);
+        expect(mockRouter.navigate).toHaveBeenCalledWith(
+          navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
+          mockRoute
+        );
+      });
+    });
     });
   });
 });

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

@@ -71,6 +71,7 @@ export default {
             vin: this.getVinFromStore(),
             forwardButtonCarStyle:"",
             vinPopulatedOnPageLoad: this.getVinFromStore()?.length > 0,
+            bailout: false,
         };
     },
     provide() {
@@ -147,10 +148,15 @@ export default {
                     // Temp solution to turn on 'disabled' style on the Continue button
                     //  because the form itself actually passes its client-side validation.
                     //  SSR-189 Scenario #4.
-                    this.$refs.siteFooter.disableForwardButton();
-                    return;
+                    this.$refs.siteFooter.enableForwardAction();
+                    this.bailout=true
                 }
 
+                if(this.bailout){                
+                    return this.$router.navigate(
+                    this.navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
+                    this.$route);
+                }
                 // Add vin bcs the response from the service doesn't contain vin
                 this.vehicleFromLookup = Object.assign(vehicleLookupResponse.data, { vin: this.vin });
             }

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

@@ -141,6 +141,10 @@ const routingTable = function(store) {
           {
             scenario: navigationScenarios.CLICKED_FORWARD_WITH_NO_MORE_QUESTIONS,
             destinationIssPageValue: issPageValues.COVERAGE_STATEMENT
+          },
+          {
+            scenario: navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
+            destinationIssPageValue: issPageValues.BAILOUT_PAGE
           }
       ]
     },