diff --git a/src/layouts/service-location/service-location.spec.js b/src/layouts/service-location/service-location.spec.js index 6f2443a49..95842e0c2 100644 --- a/src/layouts/service-location/service-location.spec.js +++ b/src/layouts/service-location/service-location.spec.js @@ -190,6 +190,8 @@ describe("service-location.vue", () => { // Arrange const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + const mobileFeePart = { partNumber: "MOBILE FEE", description: "MOBILE FEE", @@ -584,6 +586,8 @@ describe("service-location.vue", () => { ); const { wrapper } = setupMocks({}); + + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); // Act await serviceLocation.beforeRouteEnter.call( @@ -611,6 +615,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -637,6 +643,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -663,6 +671,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -689,6 +699,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -716,6 +728,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -743,6 +757,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -770,6 +786,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -797,6 +815,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -824,6 +844,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -851,6 +873,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -878,6 +902,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -905,6 +931,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -932,6 +960,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -959,6 +989,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -989,6 +1021,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1015,6 +1049,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1041,6 +1077,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1068,6 +1106,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1095,6 +1135,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1122,6 +1164,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1151,6 +1195,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1178,6 +1224,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1205,6 +1253,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1232,6 +1282,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1259,6 +1311,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1286,6 +1340,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1313,6 +1369,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, @@ -1342,6 +1400,8 @@ describe("service-location.vue", () => { const { wrapper } = setupMocks({}); + wrapper.vm.$refs.shopQuestion.initializeComponent = jest.fn(); + // Act await serviceLocation.beforeRouteEnter.call( wrapper.vm, diff --git a/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue b/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue index 45a18280f..b8003148f 100644 --- a/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue +++ b/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue @@ -8,7 +8,9 @@ :aria-label="buttonLabel" class="button-content list-button-content d-flex flex-column justify-content-center py-3 px-4">
- {{ buttonLabel }} + {{ + buttonLabel + }} {{ buttonLabelSubCopy }} diff --git a/src/layouts/service-location/shop-question/shop-question.vue b/src/layouts/service-location/shop-question/shop-question.vue index 96d7debd8..c7dba4a5d 100644 --- a/src/layouts/service-location/shop-question/shop-question.vue +++ b/src/layouts/service-location/shop-question/shop-question.vue @@ -17,8 +17,9 @@ groupName="ChooseShop" textPosition="text-start" v-model="selectedValue" - isRequired /> - + + :aria-label="showMoreShopsLinkText" />
@@ -59,6 +60,7 @@ export default { availability: "high", answers: [], shopIndex: 0, + displaySeeMoreLocationsLink: true, }; }, props: { @@ -107,6 +109,9 @@ export default { const result = await this.dispatchStoreAction(storeActions.GET_PROVIDER_LOCATIONS, { serviceZipCode: this.serviceZipCode, }); + + this.resetShopList(); + return result.data; }, shopIterator(array, n) { @@ -114,7 +119,7 @@ export default { return () => { var end = this.shopIndex + n; var part = array.slice(this.shopIndex, end); - this.shopIndex = end < l ? end : this.shopIndex.length - 1; + this.shopIndex = end < l ? end : this.shops.length; return part; }; }, @@ -145,6 +150,18 @@ export default { const container = document.getElementsByClassName("page-container-grouped-styles")[0]; container.scrollTo({ top: container.scrollHeight, left: 0, behavior: "smooth" }); + + if (this.shopIndex == this.shops.length) { + this.displaySeeMoreLocationsLink = false; + } + }, + resetShopList() { + this.answers = []; + this.shopIndex = 0; + this.getNextShopsFromList(); + + this.displaySeeMoreLocationsLink = true; + }, }, watch: { @@ -160,8 +177,9 @@ export default { const container = document.getElementsByClassName( "page-container-grouped-styles" )[0]; - console.log(container.scrollHeight + 200); container.scrollTo({ top: container.scrollHeight, left: 0, behavior: "smooth" }); + + this.resetShopList(); }, }, },