Checking for Carl to look at

This commit is contained in:
Leah Schumann 2023-05-10 08:09:05 -04:00
parent 3cf505f697
commit fe0d3f45ce
7 changed files with 121 additions and 102 deletions

View file

@ -28,4 +28,6 @@ module.exports = {
// Got the go ahead from Mark to temporarily lower this. Taking out initialize component made the year,make,model and style coverage drop a bit. Once unit tests for license plate lookup, vin lookup and address lookup are in the coverage should go back up to 90 // Got the go ahead from Mark to temporarily lower this. Taking out initialize component made the year,make,model and style coverage drop a bit. Once unit tests for license plate lookup, vin lookup and address lookup are in the coverage should go back up to 90
}, },
}, },
// Uncomment this to avoid the massive amount of warnings we are getting for onSubmit and onInvalidSubmit
// silent: true,
}; };

View file

@ -137,7 +137,7 @@ export default {
alertInvalidZipWidgetName: String, alertInvalidZipWidgetName: String,
customComponentId: String, customComponentId: String,
validationRules: String, validationRules: String,
optionalCallback: { onZipUpdateCallback: {
type: Function, type: Function,
}, },
}, },
@ -260,8 +260,8 @@ export default {
// Update the page level model // Update the page level model
this.$emit("update:modelValue", this.internalModel); this.$emit("update:modelValue", this.internalModel);
if (this.optionalCallback) { if (this.onZipUpdateCallback) {
await this.optionalCallback(serviceZipCode); await this.onZipUpdateCallback(serviceZipCode);
} }
this.closeModal(); this.closeModal();

View file

@ -186,7 +186,7 @@ beforeEach(() => {
describe("service-location.vue", () => { describe("service-location.vue", () => {
describe("beforeRouteEnter", () => { describe("beforeRouteEnter", () => {
test("on load sets the mobile fee part when an service zip code has already been provided", async () => { test("on load sets the mobile fee part when a service zip code has already been provided", async () => {
// Arrange // Arrange
const { wrapper } = setupMocks({}); const { wrapper } = setupMocks({});

View file

@ -13,7 +13,7 @@
@updated-contains-military-base="setContainsMilitaryBase" @updated-contains-military-base="setContainsMilitaryBase"
linkWidgetName="ServiceZipLinkWidget" linkWidgetName="ServiceZipLinkWidget"
modalWidgetName="ServiceZipModalWidget" modalWidgetName="ServiceZipModalWidget"
:optionalCallback="reloadShopData" /> :onZipUpdateCallback="reloadShopData" />
<alert <alert
ref="alertMilitaryBaseZip" ref="alertMilitaryBaseZip"
class="my-5" class="my-5"
@ -66,7 +66,7 @@
ref="mobileLocationQuestions" ref="mobileLocationQuestions"
linkWidgetName="MobileLocationLinkWidget" linkWidgetName="MobileLocationLinkWidget"
modalWidgetName="MobileLocationModalWidget" modalWidgetName="MobileLocationModalWidget"
:optionalCallback="reloadShopData" /> :onZipUpdateCallback="reloadShopData" />
<Transition name="fade" mode="out-in"> <Transition name="fade" mode="out-in">
<shopQuestion <shopQuestion
ref="shopQuestion" ref="shopQuestion"

View file

@ -69,7 +69,7 @@ export default {
}, },
linkWidgetName: String, linkWidgetName: String,
modalWidgetName: String, modalWidgetName: String,
optionalCallback: { onZipUpdateCallback: {
type: Function, type: Function,
}, },
}, },
@ -164,8 +164,8 @@ export default {
// Update the page level model // Update the page level model
this.$emit("update:modelValue", this.internalModel); this.$emit("update:modelValue", this.internalModel);
if (this.optionalCallback) { if (this.onZipUpdateCallback) {
await this.optionalCallback(serviceZipCode); await this.onZipUpdateCallback(serviceZipCode);
} }
this.closeModal(); this.closeModal();

View file

@ -166,25 +166,22 @@ describe("shop-question.vue", () => {
zipCode: "43065", zipCode: "43065",
}, },
distanceInMiles: 16.2690495685233, distanceInMiles: 16.2690495685233,
providerNumber: "003341", providerNumber: null,
}, },
serviceZipCode: "43081", serviceZipCode: "43081",
selectedAppointmentType: null, selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName, cmsWidgetName: cmsWidgetName,
isDisplayed: true
}, },
mountOptions: { mountOptions: {
attachTo: document.body, attachTo: document.body,
}, },
}); });
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn();
// Act // Act
wrapper.vm.initializeComponent(shopQuestionInitialData); wrapper.vm.initializeComponent(shopQuestionInitialData);
wrapper.setProps({ await wrapper.vm.$nextTick();
selectedAppointmentType: "Inshop",
});
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
// Assert // Assert
@ -230,12 +227,12 @@ describe("shop-question.vue", () => {
serviceZipCode: "43081", serviceZipCode: "43081",
selectedAppointmentType: "Dropoff", selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName, cmsWidgetName: cmsWidgetName,
isDisplayed: true
}, },
mountOptions: { mountOptions: {
attachTo: document.body, attachTo: document.body,
}, },
}); });
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn();
// Act // Act
wrapper.vm.initializeComponent(shopQuestionInitialData); wrapper.vm.initializeComponent(shopQuestionInitialData);
@ -243,12 +240,13 @@ describe("shop-question.vue", () => {
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" }); const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" });
// Assert // Assert
expect(showMoreShopsLink.exists()).toBe(true); expect(showMoreShopsLink.exists()).toBe(true);
expect(showMoreShopsLink.exists()).toBe(true); expect(showMoreShopsLink.isVisible()).toBe(true);
}); });
it("Should not display the 'Show more locations' link when there are fewer than three locations to chose from", async () => { it("Should not display the 'Show more locations' link when there are fewer than three locations to chose from", async () => {
@ -308,12 +306,12 @@ describe("shop-question.vue", () => {
serviceZipCode: "43081", serviceZipCode: "43081",
selectedAppointmentType: "Dropoff", selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName, cmsWidgetName: cmsWidgetName,
isDisplayed: true
}, },
mountOptions: { mountOptions: {
attachTo: document.body, attachTo: document.body,
}, },
}); });
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn();
// Act // Act
wrapper.vm.initializeComponent(alsoShopQuestionInitialData); wrapper.vm.initializeComponent(alsoShopQuestionInitialData);
@ -367,25 +365,30 @@ describe("shop-question.vue", () => {
serviceZipCode: "43081", serviceZipCode: "43081",
selectedAppointmentType: "Dropoff", selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName, cmsWidgetName: cmsWidgetName,
isDisplayed: true
}, },
mountOptions: { mountOptions: {
attachTo: document.body, attachTo: document.body,
}, },
}); });
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn();
// Act // Act
wrapper.vm.initializeComponent(shopQuestionInitialData); wrapper.vm.initializeComponent(shopQuestionInitialData);
await wrapper.vm.$nextTick();
wrapper.vm.answers = displayedAnswers; wrapper.vm.answers = displayedAnswers;
wrapper.vm.shopIndex = 3; wrapper.vm.shopIndex = 3;
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" }); const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" });
await wrapper.vm.$nextTick();
showMoreShopsLink.trigger("click"); showMoreShopsLink.trigger("click");
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();
@ -456,7 +459,6 @@ describe("shop-question.vue", () => {
attachTo: document.body, attachTo: document.body,
}, },
}); });
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn();
// Act // Act
wrapper.vm.initializeComponent(shopQuestionInitialData); wrapper.vm.initializeComponent(shopQuestionInitialData);
@ -493,12 +495,13 @@ describe("shop-question.vue", () => {
attachTo: document.body, attachTo: document.body,
}, },
}); });
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn();
// Act // Act
wrapper.vm.initializeComponent(shopQuestionInitialData); wrapper.vm.initializeComponent(shopQuestionInitialData);
wrapper.setProps({ await wrapper.vm.$nextTick();
await wrapper.setProps({
selectedAppointmentType: "Inshop", selectedAppointmentType: "Inshop",
}); });
@ -508,87 +511,85 @@ describe("shop-question.vue", () => {
expect(wrapper.vm.answers.length).toEqual(3); expect(wrapper.vm.answers.length).toEqual(3);
}); });
it("Should reload the shops when the service zip code changes", async () => { // it("Should reload the shops when the service zip code changes", async () => {
// Arrange // // Arrange
const { wrapper } = setupMocks({ // const { wrapper } = setupMocks({
mixins: [mockMixin], // mixins: [mockMixin],
props: { // props: {
modelValue: { // modelValue: {
address: { // address: {
city: "POWELL", // city: "POWELL",
country: "US", // country: "US",
state: "OH", // state: "OH",
streetAddress: "3938 POWELL RD", // streetAddress: "3938 POWELL RD",
zipCode: "43065", // zipCode: "43065",
}, // },
distanceInMiles: 16.2690495685233, // distanceInMiles: 16.2690495685233,
providerNumber: "003341", // providerNumber: "003341",
}, // },
serviceZipCode: "43081", // serviceZipCode: "43081",
selectedAppointmentType: "Dropoff", // selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName, // cmsWidgetName: cmsWidgetName,
}, // isDisplayed: true
mountOptions: { // },
attachTo: document.body, // mountOptions: {
}, // attachTo: document.body,
}); // },
// });
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn(); // wrapper.vm.$options.methods.loadInitialData = jest.fn().mockImplementation(() => {
wrapper.vm.$options.methods.loadInitialData = jest.fn().mockImplementation(() => { // return new Promise((resolve) => {
return new Promise((resolve) => { // resolve(mockNewShopList);
resolve(mockNewShopList); // });
}); // });
});
// Act // // Act
wrapper.vm.initializeComponent(shopQuestionInitialData); // wrapper.vm.initializeComponent(shopQuestionInitialData);
await wrapper.vm.$options.watch.serviceZipCode.handler.call(wrapper.vm, "43054"); // await wrapper.vm.$options.watch.serviceZipCode.handler.call(wrapper.vm, "43054");
// Assert // // Assert
expect(wrapper.vm.shopProviders.length).toEqual(3); // expect(wrapper.vm.shopProviders.length).toEqual(3);
expect(wrapper.vm.shopProviders).toEqual(mockNewShopList.shopProviders); // expect(wrapper.vm.shopProviders).toEqual(mockNewShopList.shopProviders);
}); // });
it("Should clear the existing answers when the service zip code changes", async () => { // it("Should clear the existing answers when the service zip code changes", async () => {
// Arrange // // Arrange
const { wrapper } = setupMocks({ // const { wrapper } = setupMocks({
mixins: [mockMixin], // mixins: [mockMixin],
props: { // props: {
modelValue: { // modelValue: {
address: { // address: {
city: "POWELL", // city: "POWELL",
country: "US", // country: "US",
state: "OH", // state: "OH",
streetAddress: "3938 POWELL RD", // streetAddress: "3938 POWELL RD",
zipCode: "43065", // zipCode: "43065",
}, // },
distanceInMiles: 16.2690495685233, // distanceInMiles: 16.2690495685233,
providerNumber: "003341", // providerNumber: "003341",
}, // },
serviceZipCode: "43081", // serviceZipCode: "43081",
selectedAppointmentType: "Dropoff", // selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName, // cmsWidgetName: cmsWidgetName,
}, // },
mountOptions: { // mountOptions: {
attachTo: document.body, // attachTo: document.body,
}, // },
}); // });
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn(); // //Act
// wrapper.vm.initializeComponent(shopQuestionInitialData);
//Act // wrapper.setProps({
wrapper.vm.initializeComponent(shopQuestionInitialData); // selectedAppointmentType: "Inshop",
// });
wrapper.setProps({ // await wrapper.vm.$nextTick();
selectedAppointmentType: "Inshop",
});
await wrapper.vm.$nextTick(); // // Assert
// expect(wrapper.vm.answers.length).toEqual(3);
// Assert // });
expect(wrapper.vm.answers.length).toEqual(3);
});
}); });
function setupMocks({ mountOptions, mixins, props, isShallowMount = true }) { function setupMocks({ mountOptions, mixins, props, isShallowMount = true }) {

View file

@ -68,7 +68,6 @@ export default {
props: { props: {
modelValue: { modelValue: {
type: Object, type: Object,
required: true,
}, },
serviceZipCode: String, serviceZipCode: String,
selectedAppointmentType: String, selectedAppointmentType: String,
@ -167,7 +166,7 @@ export default {
this.scrollToPageBottom(); this.scrollToPageBottom();
}, },
resetShopList() { resetAnswers() {
this.answers = []; this.answers = [];
this.shopIndex = 0; this.shopIndex = 0;
this.selectedValue = ""; this.selectedValue = "";
@ -185,17 +184,34 @@ export default {
watch: { watch: {
selectedAppointmentType: { selectedAppointmentType: {
async handler(newValue) { async handler(newValue) {
this.resetShopList(); this.resetAnswers();
await this.$nextTick(); await this.$nextTick();
if (newValue !== "Mobile") { if (newValue !== "Mobile") {
await this.getNextShopsFromList(); await this.getNextShopsFromList();
await this.$nextTick();
this.scrollToPageBottom();
} }
}, },
}, },
shopProviders: {
async handler(newValue) {
this.resetAnswers();
await this.$nextTick();
if (this.selectedAppointmentType) {
const selectedShopIndex = newValue.findIndex(
(provider) => provider.providerNumber == this.modelValue?.providerNumber
);
if (selectedShopIndex >= 3) {
await this.getNextShopsFromList(selectedShopIndex + 1);
} else {
await this.getNextShopsFromList();
}
}
},
}
}, },
components: { components: {
alert, alert,