CSR-869 Reset alerts when continue is clicked, add test

This commit is contained in:
Katie 2022-10-27 15:23:48 -04:00
parent 61ecd7cf9f
commit b63f77a7fc
3 changed files with 83 additions and 47 deletions

View file

@ -84,6 +84,7 @@ export const cookies = {
"skey": "12345"
};
// Removes test cookies for testing cookie-helper and order-helper
export function removeAllTestCookies() {
Object.keys(cookies).forEach(key => {
document.cookie = `${key}=;Max-Age=0;`;

View file

@ -12,24 +12,24 @@ jest.mock("@/store", () => ({
getters: {
vehicle: {
year: 2019,
carId: 'C00000'
carId: "C00000",
},
order: {
serviceLocation: {
zipCode: "45253"
zipCode: "45253",
},
customer: {
emailAddress: "builddigitaltest@safelite.com"
}
emailAddress: "builddigitaltest@safelite.com",
},
},
payment: {
insuranceCoverage: {
isVerified: true
}
isVerified: true,
},
},
damage: {
glassToReplace: "windshield"
}
glassToReplace: "windshield",
},
},
}));
@ -38,7 +38,6 @@ jest.mock("@/helpers/layout-helper.js", () => ({
settleAllPromises: jest.fn(),
}));
jest.mock("@/helpers/damage-helper", () => ({
isGlassAvailableForCarId: jest.fn(() => {
return Promise.resolve();
@ -47,7 +46,6 @@ jest.mock("@/helpers/damage-helper", () => ({
getDamageString: jest.fn(),
}));
describe("vin-lookup.vue", () => {
it("Should update the funnel-footer forward button when VIN is changed", (done) => {
//Arrange
@ -59,7 +57,6 @@ describe("vin-lookup.vue", () => {
expect(wrapper.vm.$refs.funnelFooter.updateButtonText).toBeCalled();
done();
});
});
it("Should call navigateForward() if the store carId matches the vin response carId and forward button is clicked", async () => {
@ -68,7 +65,7 @@ describe("vin-lookup.vue", () => {
mockOutPromises({ carId: "C00000" });
wrapper.vm.navigateForward = jest.fn();
// Act
// Act
await wrapper.vm.forwardButtonAction();
//Assert
@ -78,14 +75,14 @@ describe("vin-lookup.vue", () => {
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({});
mockOutPromises({ carId: 'C11111' });
mockOutPromises({ carId: "C11111" });
wrapper.vm.vinTouched = true;
wrapper.vm.vin = "";
wrapper.vm.initialVin = "foo";
wrapper.vm.navigateForward = jest.fn();
// Act
// Act
await wrapper.vm.forwardButtonAction();
//Assert
@ -95,13 +92,13 @@ describe("vin-lookup.vue", () => {
it("Should call navigateForward() if the store carId does not match the vin response carId but does match previously enterted carId and forward button is clicked", async () => {
// Arrange
const { wrapper } = setupMocks({});
mockOutPromises({ carId: 'C11111' });
mockOutPromises({ carId: "C11111" });
wrapper.vm.lookupVehicle = jest.fn().mockImplementation(() => vinPromise);
wrapper.vm.navigateForward = jest.fn();
wrapper.vm.previouslyEnteredCarId = 'C11111';
wrapper.vm.previouslyEnteredCarId = "C11111";
// Act
// Act
await wrapper.vm.forwardButtonAction();
//Assert
@ -113,8 +110,8 @@ describe("vin-lookup.vue", () => {
const { wrapper } = setupMocks({});
const zipValidationApiResponse = {
data: {
isServiceable: false
}
isServiceable: false,
},
};
const zipPromise = Promise.resolve(zipValidationApiResponse);
@ -123,9 +120,9 @@ describe("vin-lookup.vue", () => {
wrapper.vm.setupUiForNonServiceableZip = jest.fn();
wrapper.vm.navigateForward = jest.fn();
wrapper.vm.previouslyEnteredCarId = 'new carId';
wrapper.vm.previouslyEnteredCarId = "new carId";
// Act
// Act
await wrapper.vm.forwardButtonAction();
//Assert
@ -140,9 +137,9 @@ describe("vin-lookup.vue", () => {
wrapper.vm.initialVin = "!foo";
wrapper.vm.navigateForward = jest.fn();
wrapper.vm.previouslyEnteredCarId = 'new carId';
wrapper.vm.previouslyEnteredCarId = "new carId";
// Act
// Act
await wrapper.vm.forwardButtonAction();
//Assert
@ -155,14 +152,14 @@ describe("vin-lookup.vue", () => {
const { wrapper } = setupMocks({
customMountOptions: {
router: {
navigateWithSaving: jest.fn()
}
}
navigateWithSaving: jest.fn(),
},
},
});
wrapper.vm.navigateForwardWithSingleCarMatch = jest.fn();
wrapper.setData({
isCarIdDifferent: true,
isSelectedGlassAvailableForVehicle: false
isSelectedGlassAvailableForVehicle: false,
});
// Act
@ -170,8 +167,13 @@ describe("vin-lookup.vue", () => {
//Assert
expect(wrapper.vm.$router.navigateWithSaving).toBeCalledTimes(1);
expect(wrapper.vm.$router.navigateWithSaving).toHaveBeenCalledWith(navigationScenarios.SELECTED_VIN_HAS_MISMATCHED_GLASS, wrapper.vm.$route, expect.anything(), expect.anything());
})
expect(wrapper.vm.$router.navigateWithSaving).toHaveBeenCalledWith(
navigationScenarios.SELECTED_VIN_HAS_MISMATCHED_GLASS,
wrapper.vm.$route,
expect.anything(),
expect.anything()
);
});
test("carId matches => navigateForwardWithSingleCarMatch", async () => {
// Arrange
@ -186,7 +188,7 @@ describe("vin-lookup.vue", () => {
//Assert
expect(wrapper.vm.navigateForwardWithSingleCarMatch).toBeCalledTimes(1);
})
});
test("selected glass is available for returned vehicle => navigateForwardWithSingleCarMatch", async () => {
// Arrange
@ -201,50 +203,73 @@ describe("vin-lookup.vue", () => {
//Assert
expect(wrapper.vm.navigateForwardWithSingleCarMatch).toBeCalledTimes(1);
})
})
});
});
describe("alerts", () => {
test("Zip is invalid => show AlertInvalidZipWidget", async () => {
// Arrange
const { wrapper } = setupMocks({});
mockOutPromises({ isZipValid: false });
await wrapper.setData({serviceZipCode: "11111"})
await wrapper.setData({ serviceZipCode: "11111" });
// Act
await wrapper.vm.forwardButtonAction();
// Assert
expect(wrapper.vm.displayInvalidZipAlert).toEqual(true);
expect(wrapper.findComponent({ref: "alertInvalidZip"}).exists()).toBe(true);
})
})
});
expect(wrapper.findComponent({ ref: "alertInvalidZip" }).exists()).toBe(true);
});
test("alerts are displayed and continue button is clicked with issues fixed => alerts are reset", async () => {
// Arrange
const { wrapper } = setupMocks({});
mockOutPromises({ isZipValid: true, isZipServiceable: true, carId: "CARID" });
await wrapper.setData({
displayInvalidZipAlert: true,
displayMatchedDifferentVehicleAlert: true,
displayNonServiceableZipAlert: true,
displayVinNotFoundAlert: true
});
// sanity check that there are alerts
expect(wrapper.findAllComponents({ name: "alert" }).length).toBe(4);
// Act
wrapper.vm.forwardButtonAction();
await wrapper.vm.$nextTick();
// Assert
expect(wrapper.findAllComponents({ name: "alert" }).length).toBe(0);
});
});
});
function setupMocks({ customMountOptions }) {
const mountOptions = getMountOptions({
...customMountOptions
...customMountOptions,
});
// Modify/augment default mount options
mountOptions.global.mocks["$store"] = store;
mountOptions.global.mixins = [mockMixin];
mountOptions['attachTo'] = document.body; // append wrapper to document.body to test DOM methods
mountOptions["attachTo"] = document.body; // append wrapper to document.body to test DOM methods
const wrapper = shallowMount(vinLookup, mountOptions);
mockOutStubFunctions(wrapper);
return { wrapper };
}
function mockOutPromises({carId, isZipValid = true, isZipServiceable = true}) {
function mockOutPromises({ carId, isZipValid = true, isZipServiceable = true }) {
const apiResponses = {
vehicleLookupResponse: {
carId: carId
carId: carId,
},
zipCodeData: {
isValid: true, isServiceable: true, state: "OH"
}
isValid: isZipValid,
isServiceable: isZipServiceable,
state: "OH",
},
};
settleAllPromises.mockImplementation(() => apiResponses);
@ -253,11 +278,13 @@ function mockOutPromises({carId, isZipValid = true, isZipServiceable = true}) {
function mockOutStubFunctions(wrapper) {
wrapper.vm.$refs.funnelFooter.updateButtonText = jest.fn();
wrapper.vm.$refs.funnelFooter.removeLoader = jest.fn();
wrapper.vm.getZipCodeData = jest.fn().mockReturnValue({ isValid: true, isServiceable: true, state: "OH" });
wrapper.vm.getZipCodeData = jest
.fn()
.mockReturnValue({ isValid: true, isServiceable: true, state: "OH" });
}
const mockMixin = {
methods: {
getCmsContent: jest.fn(() => "placeholder CMS content"),
}
}
},
};

View file

@ -228,6 +228,8 @@ export default {
},
async forwardButtonAction() {
this.resetAlerts();
// If this is a new VIN Lookup, do both a Vehicle Lookup and a Zip Validation
if (!this.vinPopulatedOnPageLoad) {
const vehicleLookupResponse = this.dispatchStoreAction(storeActions.LOOKUP_VEHICLE_BY_VIN, { vin: this.vin });
@ -337,6 +339,12 @@ export default {
return this.$refs.funnelFooter.removeLoader();
},
resetAlerts() {
this.displayMatchedDifferentVehicleAlert = false;
this.displayNonServiceableZipAlert = false;
this.displayInvalidZipAlert = false;
this.displayVinNotFoundAlert = false;
},
async navigateForward(){
if (this.isCarIdDifferent && !this.isSelectedGlassAvailableForVehicle) {
this.$router.navigateWithSaving(this.navigationScenarios.SELECTED_VIN_HAS_MISMATCHED_GLASS, this.$route, {}, { [routerParams.DISPLAY_VEHICLE_CHANGE_ALERT]: true });