jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Minor treak and unit tests

Browse source
This commit is contained in:
Leah Schumann 2023-10-17 08:30:56 -04:00
parent b4531bed88
commit 29b7a4fb45
5 changed files with 173 additions and 132 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
jest.config.js
View file

@ -31,5 +31,5 @@ module.exports = {
},
},
// Uncomment this to avoid the massive amount of warnings we are getting for onSubmit and onInvalidSubmit
silent: true,
//silent: true,
};

98
src/layouts/service-location/service-location.spec.js
View file

@ -7,10 +7,7 @@ import { getMountOptions } from "@/helpers/unit-test-helper";
import store from "@/store";
import baseMixin from "@/mixins/base-mixin";
import {
getServiceabilityDetails,
Provider,
} from "@/layouts/service-location/helpers/service-location-helper/service-location-helper";
import { getServiceabilityDetails } from "@/layouts/service-location/helpers/service-location-helper/service-location-helper";
// Define Mocks
jest.mock("@/helpers/cms-content-helper", () => ({
@ -21,7 +18,7 @@ jest.mock("@/helpers/cms-content-helper", () => ({
jest.mock("./classes/provider");
const mockGetPricedMobileFeePart = (mockServiceZipCode) => {
let mockGetPricedMobileFeePart = (mockServiceZipCode) => {
let mobileFeePart = {};
if (mockServiceZipCode === "43235") {
@ -38,7 +35,7 @@ const mockGetPricedMobileFeePart = (mockServiceZipCode) => {
return Promise.resolve(mobileFeePart);
};
const mockGetServiceabilityDetails = (mockServiceZipCode) => {
let mockGetServiceabilityDetails = (mockServiceZipCode) => {
const serviceabilityDetails = {
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: true,
@ -49,6 +46,17 @@ const mockGetServiceabilityDetails = (mockServiceZipCode) => {
return Promise.resolve(serviceabilityDetails);
};
let mockGetShopProviderData = (mockServiceZipCode) => {
const result = {
data: {
mobileProviderNumber: "001820",
shopProviders: [{}],
},
};
return Promise.resolve(result);
};
jest.mock(
"@/layouts/service-location/helpers/service-location-helper/service-location-helper",
() => ({
@ -58,6 +66,9 @@ jest.mock(
getServiceabilityDetails: jest.fn((mockServiceZipCode) => {
return mockGetServiceabilityDetails(mockServiceZipCode);
}),
getShopProviderData: jest.fn((mockServiceZipCode) => {
return mockGetShopProviderData(mockServiceZipCode);
}),
})
);
@ -554,14 +565,13 @@ describe("service-location.vue", () => {
describe("should be logical AND when recalibration is defined.", () => {
test("T & T => T", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: true,
isGlassServiceableMobile: true,
isRecalibrationServiceableMobile: true,
})
);
});
const { wrapper } = setupMocks({});
@ -582,14 +592,13 @@ describe("service-location.vue", () => {
test("T & F => F", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: false,
isGlassServiceableMobile: true,
isRecalibrationServiceableMobile: false,
})
);
});
const { wrapper } = setupMocks({});
@ -610,14 +619,13 @@ describe("service-location.vue", () => {
test("F & T => F", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: false,
isRecalibrationServiceableInshop: true,
isGlassServiceableMobile: false,
isRecalibrationServiceableMobile: true,
})
);
});
const { wrapper } = setupMocks({});
@ -638,14 +646,13 @@ describe("service-location.vue", () => {
test("F & F => F", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: false,
isRecalibrationServiceableInshop: false,
isGlassServiceableMobile: false,
isRecalibrationServiceableMobile: false,
})
);
});
const { wrapper } = setupMocks({});
@ -666,14 +673,13 @@ describe("service-location.vue", () => {
test("displayServiceableMobileOnly should be true if mobile is true and inshop is false.", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: false,
isRecalibrationServiceableInshop: false,
isGlassServiceableMobile: true,
isRecalibrationServiceableMobile: true,
})
);
});
const { wrapper } = setupMocks({});
@ -695,14 +701,13 @@ describe("service-location.vue", () => {
test("displayServiceableMobileOnly should be false if mobile is false.", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: false,
isRecalibrationServiceableInshop: false,
isGlassServiceableMobile: false,
isRecalibrationServiceableMobile: false,
})
);
});
const { wrapper } = setupMocks({});
@ -724,14 +729,13 @@ describe("service-location.vue", () => {
test("displayServiceableMobileOnly should be false if inShop is true", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: true,
isGlassServiceableMobile: true,
isRecalibrationServiceableMobile: true,
})
);
});
const { wrapper } = setupMocks({});
@ -753,14 +757,13 @@ describe("service-location.vue", () => {
test("displayNoShopsAlert should be true if inShop is false and mobile is false", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: false,
isRecalibrationServiceableInshop: false,
isGlassServiceableMobile: false,
isRecalibrationServiceableMobile: false,
})
);
});
const { wrapper } = setupMocks({});
@ -782,14 +785,13 @@ describe("service-location.vue", () => {
test("displayNoShopsAlert should be false if inShop is true and mobile is true", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: true,
isGlassServiceableMobile: true,
isRecalibrationServiceableMobile: true,
})
);
});
const { wrapper } = setupMocks({});
@ -811,14 +813,13 @@ describe("service-location.vue", () => {
test("displayNoShopsAlert should be false if inShop is true", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: true,
isGlassServiceableMobile: false,
isRecalibrationServiceableMobile: false,
})
);
});
const { wrapper } = setupMocks({});
@ -840,14 +841,13 @@ describe("service-location.vue", () => {
test("displayNoShopsAlert should be false if mobile is true", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: false,
isRecalibrationServiceableInshop: false,
isGlassServiceableMobile: true,
isRecalibrationServiceableMobile: true,
})
);
});
const { wrapper } = setupMocks({});
@ -869,14 +869,13 @@ describe("service-location.vue", () => {
test("displayServiceableInshopOnly should be true if inshop is true and mobile is false", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: true,
isGlassServiceableMobile: false,
isRecalibrationServiceableMobile: false,
})
);
});
const { wrapper } = setupMocks({});
@ -898,14 +897,13 @@ describe("service-location.vue", () => {
test("displayServiceableInshopOnly should be false if inshop is false", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: false,
isRecalibrationServiceableInshop: false,
isGlassServiceableMobile: false,
isRecalibrationServiceableMobile: false,
})
);
});
const { wrapper } = setupMocks({});
@ -927,14 +925,13 @@ describe("service-location.vue", () => {
test("displayServiceableInshopOnly should be false if mobile is true", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: true,
isGlassServiceableMobile: true,
isRecalibrationServiceableMobile: true,
})
);
});
const { wrapper } = setupMocks({});
@ -956,14 +953,13 @@ describe("service-location.vue", () => {
test("displayServiceableInshopOnly should be false in the dual/static recalibration scenario", async () => {
// Arrange
getServiceabilityDetails.mockImplementation(() =>
mockGetServiceabilityDetails = () =>
Promise.resolve({
isGlassServiceableInshop: true,
isRecalibrationServiceableInshop: true,
isGlassServiceableMobile: true,
isRecalibrationServiceableMobile: false,
})
);
});
const { wrapper } = setupMocks({});

23
src/layouts/service-location/service-location.vue
View file

@ -19,8 +19,7 @@
@updated-serviceability="setServiceabilityDetails"
@updated-contains-military-base="setContainsMilitaryBase"
linkWidgetName="ServiceZipLinkWidget"
modalWidgetName="ServiceZipModalWidget"
/>
modalWidgetName="ServiceZipModalWidget" />
<alert
ref="alertMilitaryBaseZip"
@ -86,8 +85,7 @@
validationRules="mobile-location-required"
ref="mobileLocationQuestions"
linkWidgetName="MobileLocationLinkWidget"
modalWidgetName="MobileLocationModalWidget"
/>
modalWidgetName="MobileLocationModalWidget" />
<shopQuestion
ref="shopQuestion"
@ -189,7 +187,10 @@ export default {
const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
const serviceZipCode = store.getters.order.serviceLocation.zipCode;
const zipCodeDataPromise = baseMixin.methods.getZipCodeData(serviceZipCode, "service-location");
const zipCodeDataPromise = baseMixin.methods.getZipCodeData(
serviceZipCode,
"service-location"
);
const serviceabilityDetailsPromise = getServiceabilityDetails(
serviceZipCode,
@ -276,8 +277,10 @@ export default {
if (newValue.addressQuestions.zipCode !== this.zipCode) {
getShopProviderData(newValue.addressQuestions.zipCode).then((result) => {
this.shopProviderData = result.data;
this.selectedProvider = new Provider(this.shopProviderData.mobileProviderNumber);
});
this.selectedProvider = new Provider(
this.shopProviderData.mobileProviderNumber
);
});
}
this.setMobileLocation(newValue);
@ -504,8 +507,10 @@ export default {
if (newValue === "Mobile") {
getShopProviderData(this.zipCode).then(async (result) => {
this.shopProviderData = result.data;
this.selectedProvider = new Provider(this.shopProviderData.mobileProviderNumber);
});
this.selectedProvider = new Provider(
this.shopProviderData.mobileProviderNumber
);
});
} else {
this.selectedProvider = new Provider();
}

159
src/layouts/service-location/shop-question/shop-question.spec.js
View file

@ -61,6 +61,7 @@ const mockCmsContent = {
const cmsWidgetName = "ShopQuestionWidget";
const shopQuestionInitialData = {
mobileProviderNumber: "001820",
shopProviders: [
{
address: {
@ -162,15 +163,18 @@ describe("shop-question.vue", () => {
selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName,
isDisplayed: true,
shopProviderData: null,
},
mountOptions: {
attachTo: document.body,
},
});
// Act
wrapper.vm.initializeComponent(shopQuestionInitialData);
await wrapper.setProps({
shopProviderData: shopQuestionInitialData,
});
// Act
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
@ -199,47 +203,6 @@ describe("shop-question.vue", () => {
});
it("Should display the 'Show more locations' link when there are more than three locations to chose from", async () => {
// Arrange
const { wrapper } = setupMocks({
mixins: [mockMixin],
props: {
modelValue: {
address: {
city: "POWELL",
country: "US",
state: "OH",
streetAddress: "3938 POWELL RD",
zipCode: "43065",
},
distanceInMiles: 16.2690495685233,
providerNumber: "003341",
},
serviceZipCode: "43081",
selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName,
isDisplayed: true,
},
mountOptions: {
attachTo: document.body,
},
});
// Act
wrapper.vm.initializeComponent(shopQuestionInitialData);
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" });
// Assert
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 () => {
// Arrange
const alsoShopQuestionInitialData = {
shopProviders: [
@ -276,6 +239,17 @@ describe("shop-question.vue", () => {
distanceInMiles: 11.738869544543,
providerNumber: "003343",
},
{
address: {
city: "COLUMBUS",
country: "US",
state: "OH",
streetAddress: "1670 HARMON AVE",
zipCode: "43223",
},
distanceInMiles: 15.9727889297435,
providerNumber: "006747",
},
],
};
@ -297,6 +271,7 @@ describe("shop-question.vue", () => {
selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName,
isDisplayed: true,
shopProviderData: null,
},
mountOptions: {
attachTo: document.body,
@ -304,14 +279,89 @@ describe("shop-question.vue", () => {
});
// Act
wrapper.vm.initializeComponent(alsoShopQuestionInitialData);
await wrapper.setProps({
shopProviderData: shopQuestionInitialData,
});
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" });
// Assert
expect(showMoreShopsLink.exists()).toBe(false);
expect(showMoreShopsLink.exists()).toBeTruthy();
expect(showMoreShopsLink.isVisible()).toBeTruthy();
});
it("Should not display the 'Show more locations' link when there are fewer than three locations to chose from", async () => {
// Arrange
const alsoShopQuestionInitialData = {
shopProviders: [
{
address: {
city: "WESTERVILLE",
country: "US",
state: "OH",
streetAddress: "4403 EXECUTIVE PKWY",
zipCode: "43081",
},
distanceInMiles: 5.16769294095201,
providerNumber: "003335",
},
{
address: {
city: "WORTHINGTON",
country: "US",
state: "OH",
streetAddress: "760 DEARBORN PARK LN",
zipCode: "43085",
},
distanceInMiles: 10.5865432478478,
providerNumber: "001820",
},
],
};
const { wrapper } = setupMocks({
mixins: [mockMixin],
props: {
modelValue: {
address: {
city: "POWELL",
country: "US",
state: "OH",
streetAddress: "3938 POWELL RD",
zipCode: "43065",
},
distanceInMiles: 16.2690495685233,
providerNumber: "003341",
},
serviceZipCode: "43081",
selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName,
isDisplayed: true,
shopProviderData: null,
},
mountOptions: {
attachTo: document.body,
},
});
// Act
await wrapper.setProps({
shopProviderData: alsoShopQuestionInitialData,
});
await wrapper.vm.$nextTick();
const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" });
await wrapper.vm.$nextTick();
// Assert
expect(showMoreShopsLink.exists()).toBeFalsy();
});
it("Should display the next three shops when the 'Show more location' link is clicked", async () => {
@ -355,6 +405,7 @@ describe("shop-question.vue", () => {
selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName,
isDisplayed: true,
shopProviderData: null,
},
mountOptions: {
attachTo: document.body,
@ -362,7 +413,9 @@ describe("shop-question.vue", () => {
});
// Act
wrapper.vm.initializeComponent(shopQuestionInitialData);
await wrapper.setProps({
shopProviderData: shopQuestionInitialData,
});
await wrapper.vm.$nextTick();
@ -384,7 +437,7 @@ describe("shop-question.vue", () => {
await wrapper.vm.$nextTick();
showMoreShopsLink.trigger("click");
showMoreShopsLink.trigger("click-event");
await wrapper.vm.$nextTick();
@ -443,6 +496,7 @@ describe("shop-question.vue", () => {
serviceZipCode: "43081",
selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName,
shopProviderData: null,
},
mountOptions: {
attachTo: document.body,
@ -450,7 +504,9 @@ describe("shop-question.vue", () => {
});
// Act
wrapper.vm.initializeComponent(shopQuestionInitialData);
await wrapper.setProps({
shopProviderData: shopQuestionInitialData,
});
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
@ -468,15 +524,18 @@ describe("shop-question.vue", () => {
modelValue: null,
selectedAppointmentType: "Dropoff",
cmsWidgetName: cmsWidgetName,
shopProviderData: null,
},
mountOptions: {
attachTo: document.body,
},
});
// Act
await wrapper.vm.initializeComponent(shopQuestionInitialData);
await wrapper.setProps({
shopProviderData: shopQuestionInitialData,
});
// Act
await wrapper.vm.$nextTick();
expect(wrapper.vm.answers.length).toEqual(3);

23
src/layouts/service-location/shop-question/shop-question.vue
View file

@ -30,7 +30,7 @@
linkType="text"
:text="showMoreShopsLinkText"
href="#!"
@click-event="getNextShopsFromList"
@click-event="getNextShopsFromList(3)"
:aria-label="showMoreShopsLinkText" />
</div>
</transition>
@ -43,8 +43,6 @@ import buttonQuestion from "@/digital-components/button-question/button-question
import shopListButton from "./shop-list-button/shop-list-button";
import textLink from "@/ux-components/text-link/text-link";
import { storeActions } from "@/constants/store-actions.js";
// Supporting files
import { defineRule } from "vee-validate";
import { required } from "@/helpers/validation-rules";
@ -75,7 +73,7 @@ export default {
default: () => null,
},
selectedAppointmentType: String,
shopProviderData: Array,
shopProviderData: Object,
cmsWidgetName: String,
validationRules: String,
isDisplayed: Boolean,
@ -127,23 +125,6 @@ export default {
},
},
methods: {
// loadInitialData(serviceZipCode) {
// return this.loadData(serviceZipCode);
// },
// loadData(serviceZipCode) {
// return getShopProviders(serviceZipCode);
// // return baseMixin.methods.dispatchStoreActionWithLogging(
// // storeActions.GET_PROVIDERS,
// // {
// // serviceZipCode: serviceZipCode,
// // },
// // "service-location"
// // );
// },
// initializeComponent(shopQuestionInitialData) {
// this.shopProviders = shopQuestionInitialData.shopProviders;
// this.$emit("updated-shop-list", shopQuestionInitialData);
// },
async getNextShopsFromList(numberToGet = 3) {
const shopIterator = (array, n) => {
const l = array.length;