From 2fd0ce5f211698226b88b2c3a03cf0c26408c727 Mon Sep 17 00:00:00 2001 From: Leah Schumann Date: Mon, 27 Mar 2023 09:47:30 -0400 Subject: [PATCH] Before merging from develop --- src/constants/endpoints.js | 2 +- src/digital-components/modal/modal.vue | 14 +- .../service-location/service-location.vue | 15 +- .../service-type-question.vue | 39 +--- .../service-zip-modal-question.vue | 2 + src/store/index.js | 22 ++- .../modal-button-main.spec.js | 187 ++++++++++++++++++ .../modal-button-main/modal-button-main.vue | 153 ++++++++++++++ 8 files changed, 379 insertions(+), 55 deletions(-) create mode 100644 src/ux-components/modal-button-main/modal-button-main.spec.js create mode 100644 src/ux-components/modal-button-main/modal-button-main.vue diff --git a/src/constants/endpoints.js b/src/constants/endpoints.js index fc94132d9..aaf221bd2 100644 --- a/src/constants/endpoints.js +++ b/src/constants/endpoints.js @@ -79,7 +79,7 @@ const endpoints = { method: "GET", }, GetServiceabilityDetails: { - url: "/location/serviceability-details", + url: "/location/api/v1/location/serviceability-details", method: "GET", }, GetSupportingItems: { diff --git a/src/digital-components/modal/modal.vue b/src/digital-components/modal/modal.vue index a18881796..7217e7478 100644 --- a/src/digital-components/modal/modal.vue +++ b/src/digital-components/modal/modal.vue @@ -26,7 +26,7 @@
- diff --git a/src/layouts/service-location/service-location.vue b/src/layouts/service-location/service-location.vue index 3e8f506d5..cb22c5844 100644 --- a/src/layouts/service-location/service-location.vue +++ b/src/layouts/service-location/service-location.vue @@ -24,7 +24,7 @@ :isGlassServiceableMobile="isGlassServiceableMobile" :isRecalibrationServiceableMobile="isRecalibrationServiceableMobile" ref="serviceTypeQuestion" - groupName="ServiceTypeQuestion" + groupName="serviceTypeQuestion" cmsWidgetName="ServiceTypeQuestionWidget" validationRules="option-required" /> @@ -49,6 +50,7 @@ export default { internalModel: this.copyModel(this.modelValue), serviceZipCodeTextInputId: "", displayInvalidZipAlert: false, + }; }, props: { diff --git a/src/store/index.js b/src/store/index.js index 5a0e86846..a64c279b6 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -926,14 +926,13 @@ export const actions = { }); }, - getServiceabilityDetails(context, { serviceZipCode, lineItems }) { - return globalMethods.callMockHttpClient({ + getServiceabilityDetails(context, { serviceZipCode }) { + const lineItems = context.getters.order.lineItems; + const lineItemsToSend = [...lineItems.supportingItems]; + const encodedLineItems = encodeURIComponent(JSON.stringify(lineItemsToSend)) + return globalMethods.callHttpClient({ method: endpoints.GetServiceabilityDetails.method, - //TODO: Remove Mocky Endpoints - //endpoint: "https://run.mocky.io/v3/59e1a644-cf16-4f08-8069-1ab2a1e38f79", // NoShopsAvailable - //endpoint: "https://run.mocky.io/v3/4fe1fb89-dd56-4e4a-9af2-96bd1ab77847", // ForcedInshop - //endpoint: "https://run.mocky.io/v3/e2eaa097-6ea5-4906-af53-901edaa94939", // ForcedMobile - endpoint: "https://run.mocky.io/v3/1811a1fe-12a7-48f3-939e-d10a9b77dd25", // All Options + endpoint: `${endpoints.GetServiceabilityDetails.url}?zip=${serviceZipCode}&lineItems=${encodedLineItems}`, }); }, @@ -1664,3 +1663,12 @@ function getLineItemQueryStringForPricing(lineItems) { }) .join(""); } + +function getLineItemQueryStringForServiceability(lineItems) { + return lineItems + .map((lineItem) => { + let queryStringSnippet = `&lineItems=${lineItem.partNumber}`; + return queryStringSnippet; + }) + .join(""); +} diff --git a/src/ux-components/modal-button-main/modal-button-main.spec.js b/src/ux-components/modal-button-main/modal-button-main.spec.js new file mode 100644 index 000000000..41e244a72 --- /dev/null +++ b/src/ux-components/modal-button-main/modal-button-main.spec.js @@ -0,0 +1,187 @@ +import { shallowMount } from "@vue/test-utils"; +import buttonMain from "./button-main"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; +import { nextTick } from "vue"; + +describe("buttonMain.vue", () => { + it("Should return btn-primary class", () => { + // Arrange/Act + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + isPrimary: true, + }, + }) + ); + const button = wrapper.find("button"); + + // Assert + expect(button.attributes("class")).toContain("btn-primary"); + }); + + it("Should return aria-disabled state", () => { + // Arrange/Act + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + isDisabled: true, + }, + }) + ); + const button = wrapper.find("button"); + + // Assert + expect(button.attributes()["aria-disabled"]).toEqual("true"); + }); + + it("Should return loader color", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderColor: "blue", + loaderEnabled: true, + }, + }) + ); + + // Act + wrapper.vm.clicked(); + await nextTick(); + + // Assert + const loader = wrapper.find("loader-stub"); + expect(loader.attributes("class")).toContain("blue"); + }); + + it("Should return loader position", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + }, + }) + ); + + // Act + wrapper.vm.clicked(); + await nextTick(); + + // Assert + const loader = wrapper.find("loader-stub"); + expect(loader.attributes("class")).toContain("right"); + }); + + it("Should set 'isLoaderDisplayed' to false when calling 'removeLoader'", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + }, + }) + ); + + wrapper.setData({ + isLoaderDisplayed: true, + }); + + // Act + wrapper.vm.removeLoader(); + await nextTick(); + + // Assert + const loader = wrapper.find("loader-stub"); + expect(wrapper.vm.isLoaderDisplayed).toBe(false); + }); + + it("Should set 'isLoaderDisplayed' to false when calling 'resetButtonStyle'", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + }, + }) + ); + + wrapper.setData({ + isLoaderDisplayed: true, + }); + + // Act + wrapper.vm.resetButtonStyle(); + await nextTick(); + + // Assert + expect(wrapper.vm.isLoaderDisplayed).toBe(false); + }); + + it("Should emit 'click-event' event when clicking if the button is enabled", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + isDisabled: false, + }, + }) + ); + + const buttonElement = wrapper.find("button"); + + // Act + buttonElement.trigger("click"); + + await nextTick(); + + // Assert + expect(wrapper.emitted("click-event")).toBeTruthy(); + }); + + it("Should not emit 'click-event' event when clicking if the button is disabled", async () => { + // Arrange + const wrapper = shallowMount( + buttonMain, + setupMocks({ + props: { + loaderPosition: "right", + loaderEnabled: true, + isDisabled: true, + }, + }) + ); + + const buttonElement = wrapper.find("button"); + + // Act + buttonElement.trigger("click"); + + await nextTick(); + + // Assert + expect(wrapper.emitted("click-event")).toBeFalsy(); + }); +}); + +function setupMocks(mountOptionsMockData = {}) { + const defaultMountOptions = { route: { query: { fmgPage: "page-name" } } }; + const baseMountOptions = getMountOptions( + Object.assign(defaultMountOptions, mountOptionsMockData) + ); + const allMountOptions = Object.assign(defaultMountOptions, baseMountOptions); + + return allMountOptions; +} diff --git a/src/ux-components/modal-button-main/modal-button-main.vue b/src/ux-components/modal-button-main/modal-button-main.vue new file mode 100644 index 000000000..eaffdf2d0 --- /dev/null +++ b/src/ux-components/modal-button-main/modal-button-main.vue @@ -0,0 +1,153 @@ + + + + +