Merge branch 'develop' into feature/CSR-1392

This commit is contained in:
CarlNation 2023-09-29 10:25:26 -04:00
commit 06b130e8ae
29 changed files with 268 additions and 69 deletions

View file

@ -7,7 +7,7 @@
</div>
<alert
v-if="displayGlobalAlert"
class="position-absolute rounded-0 w-100 border-0 shadow-sm"
class="rounded-0 w-100 border-0 shadow-sm"
cmsWidgetName="GlobalAlert"
:manualHeadline="globalAlertMessage.messageHeadline"
:manualCopy="globalAlertMessage.messageCopy"
@ -63,14 +63,11 @@ export default {
<style lang="scss" scoped>
.funnel-header {
position: relative;
padding: 0.97rem 0;
}
.logo-image {
max-width: 78px;
}
.alert {
left: 0;
top: 72px;
}
</style>

View file

@ -1,4 +1,16 @@
<template>
<div class="menu-modal-container">
<button
class="menu-button"
type="button"
:class="[isActive ? 'active' : '']"
@click="toggleModal"
aria-label="Hamburger Menu (modal window)">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</button>
</div>
<div class="menu-modal-container">
<button
class="menu-button"
@ -20,18 +32,6 @@
aria-labelledby="footerModalLabel"
aria-hidden="true"
v-on="{ 'show.bs.modal': show, 'hide.bs.modal': hide }">
<div class="menu-modal-container">
<button
class="menu-button"
type="button"
:class="[isActive ? 'active' : '']"
@click="toggleModal"
aria-label="Hamburger Menu (modal window)">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</button>
</div>
<div class="modal-dialog modal-fullscreen">
<div class="modal-content">
<div class="modal-header visually-hidden">

View file

@ -2,8 +2,8 @@
<div :class="`questions-page`">
<loadingModal ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -72,6 +72,13 @@ export async function saveSession({ pageNameToLog, shouldAwaitSaveSessionQueue =
}
}
export async function submitWorkOrder({ pageNameToLog }) {
await saveSession({
pageNameToLog: pageNameToLog,
shouldAwaitSaveSessionQueue: true,
});
}
// PRIVATE FUNCTIONS //
/*

View file

@ -1,5 +1,9 @@
import * as cookieHelper from "@/helpers/heritage-integration/cookie-helper";
import { loadSessionIfPresent, saveSession } from "@/helpers/heritage-integration/order-helper";
import {
loadSessionIfPresent,
saveSession,
submitWorkOrder,
} from "@/helpers/heritage-integration/order-helper";
import { cookieNames } from "@/constants/cookie-names";
import {
setupMocksForJsFiles,
@ -239,3 +243,111 @@ describe("saveSession", () => {
expect(cookieHelper.getFunnelCookie().DidHeritageFunnelUpdateLast).toEqual(false);
});
});
describe("submitWorkOrder", () => {
afterEach(() => {
removeAllTestCookies();
});
test("submitWorkOrder => should set state order values", async () => {
// Arrange
const mockReferralNumber = "2";
const mockCorrelationId = "55";
const mockReferralDate = "2022";
const mockParentAccountNumber = "167132";
const mockSavedSessionId = "xxx-xxx-xxx";
const mockCrmCustomerId = "xxx-xxx-xxx";
const mockOrderInfo = getMockOrderInfo(
mockReferralNumber,
mockCorrelationId,
mockReferralDate,
mockParentAccountNumber,
mockSavedSessionId,
mockCrmCustomerId
);
const mockData = {
actionList: [
{
actionName: storeActions.SAVE_SESSION,
data: mockOrderInfo,
},
{
actionName: storeActions.UPDATE_STORE_WITH_SAVE_SESSION_RESPONSE,
},
],
};
const mocks = setupMocksForJsFiles(mockData);
// Act
await submitWorkOrder({ pageNameToLog: "test" });
// Assert
expect(mocks.baseMixin.methods.dispatchStoreActionWithLogging).toHaveBeenCalledWith(
storeActions.SAVE_SESSION,
null,
"test"
);
expect(mocks.baseMixin.methods.dispatchStoreAction).toHaveBeenCalledWith(
storeActions.UPDATE_STORE_WITH_SAVE_SESSION_RESPONSE,
{
referralNumber: mockReferralNumber,
referralDate: mockReferralDate,
referralCorrelationId: mockCorrelationId,
parentAccountNumber: mockParentAccountNumber,
savedSessionId: mockSavedSessionId,
crmCustomerId: mockCrmCustomerId,
},
false
);
});
test("submitWorkOrder => should update DidHeritageFunnelUpdateLast cookie value to false", async () => {
// Arrange
const mockReferralNumber = 1566818;
const mockReferralDate = "2022-03-15T10:56:24.597";
const mockReferralCorrelationId = "404d2b04-f86e-45c3-b373-127b6217b060";
const mockParentAccountNumber = "167132";
const mockSavedSessionId = "xxx-xxx-xxx";
const mockCrmCustomerId = "xxx-xxx-xxx";
const mockOrderInfo = getMockOrderInfo(
mockReferralNumber,
mockReferralCorrelationId,
mockReferralDate,
mockParentAccountNumber,
mockSavedSessionId,
mockCrmCustomerId
);
const mockData = {
actionList: [
{
actionName: storeActions.SAVE_SESSION,
data: mockOrderInfo,
},
],
router: router,
};
setupMocksForJsFiles(mockData);
const testCookieValue = {
ReferralNumber: mockReferralNumber,
ReferralDate: mockReferralDate,
ReferralCorrelationId: mockReferralCorrelationId,
ShouldResetState: false,
DidHeritageFunnelUpdateLast: true,
};
setupCookies({ funnelCookieValue: JSON.stringify(testCookieValue) });
// Act
await submitWorkOrder({ pageNameToLog: "test" });
// Assert
expect(cookieHelper.getFunnelCookie().DidHeritageFunnelUpdateLast).toEqual(false);
});
});

View file

@ -6,8 +6,8 @@
v-slot="{ meta }"
autocomplete="off">
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
</div>
</div>

View file

@ -1,8 +1,8 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -77,7 +77,9 @@ export default {
return serviceLocationReqs && scheduleReqs;
},
forwardButtonAction() {},
forwardButtonAction() {
window.location.replace("https://safelite.com");
},
},
components: {
funnelHeader,

View file

@ -82,7 +82,6 @@ import { routerParams } from "@/router/router-constants/router-params";
import { required, regex } from "@/helpers/validation-rules";
import { Form, defineRule } from "vee-validate";
import { useField, validate } from "vee-validate";
import { navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
import store from "@/store";
// DEFINE VALIDATION RULES
@ -178,7 +177,6 @@ export default {
false
);
this.dispatchStoreAction(this.storeActions.SAVE_WORK_ORDER_FLAG, true, false);
this.$router.navigateWithSaving(this.navigationScenarios.CLICKED_FORWARD, this.$route);
},
},

View file

@ -2,8 +2,8 @@
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<loadingModal ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -1,8 +1,8 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -1 +1,57 @@
test.todo("some test to be written in the future");
// Components
import customerDetails from "@/layouts/payment-method/payment-method.vue";
// Supporting Files
import { shallowMount } from "@vue/test-utils";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
// Mock our module for promises.
jest.mock("@/helpers/layout-helper.js", () => ({
settleAllPromises: jest.fn(),
}));
jest.mock("@/helpers/heritage-integration/order-helper.js", () => ({
submitWorkOrder: jest.fn(),
}));
describe("payment-method.vue", () => {
describe("navigation", () => {
test("if the back button is clicked, navigate back", async () => {
// Arrange
const { wrapper } = setupMocks();
// Act
await wrapper.vm.backButtonAction();
// Assert
expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalled();
});
test("if the continue button is clicked, navigate forward", async () => {
// Arrange
const { wrapper } = setupMocks();
// Act
await wrapper.vm.forwardButtonAction();
// Assert
expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalled();
});
});
});
function setupMocks() {
const wrapper = shallowMount(
customerDetails,
getMountOptions({
router: {
navigate: jest.fn(),
navigate: jest.fn(),
navigateWithSaving: jest.fn(),
navigateWithoutSaving: jest.fn(),
},
})
);
return { wrapper };
}

View file

@ -22,6 +22,7 @@
import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import { submitWorkOrder } from "@/helpers/heritage-integration/order-helper.js";
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import { settleAllPromises } from "@/helpers/layout-helper";
@ -58,9 +59,16 @@ export default {
// TODO
return true;
},
backButtonAction() {},
forwardButtonAction() {
this.$router.navigateWithSaving(this.navigationScenarios.CLICKED_FORWARD, this.$route);
backButtonAction() {
this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);
},
async forwardButtonAction() {
this.dispatchStoreAction(this.storeActions.SAVE_WORK_ORDER_FLAG, true, false);
await submitWorkOrder({ pageNameToLog: "payment-method" });
this.$router.navigateWithoutSaving(
this.navigationScenarios.CLICKED_FORWARD,
this.$route
);
},
},
components: {

View file

@ -2,8 +2,8 @@
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<loadingModal ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -125,6 +125,9 @@ import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import { settleAllPromises } from "@/helpers/layout-helper";
import store from "@/store";
// Validation
import { Form } from "vee-validate";
export default {
name: "review",
async beforeRouteEnter(to, from, next) {
@ -231,7 +234,12 @@ export default {
backButtonAction() {
this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);
},
forwardButtonAction() {},
forwardButtonAction() {
this.$router.navigateWithoutSaving(
this.navigationScenarios.CLICKED_FORWARD,
this.$route
);
},
editVehicle() {
this.$router.navigateWithoutSaving(
this.navigationScenarios.CLICKED_VEHICLE_EDIT,
@ -310,6 +318,7 @@ export default {
serviceLocationReview,
scheduleReview,
customerReview,
Form,
},
};
</script>

View file

@ -2,8 +2,8 @@
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<loadingModal ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -2,8 +2,8 @@
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<loadingModal ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -311,8 +311,7 @@ describe("shop-question.vue", () => {
const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" });
// Assert
expect(showMoreShopsLink.exists()).toBe(true);
expect(showMoreShopsLink.isVisible()).toBe(false);
expect(showMoreShopsLink.exists()).toBe(false);
});
it("Should display the next three shops when the 'Show more location' link is clicked", async () => {
@ -375,6 +374,12 @@ describe("shop-question.vue", () => {
await wrapper.vm.$nextTick();
await wrapper.vm.$nextTick();
await wrapper.setData({
displaySeeMoreLocationsLink: true,
});
await wrapper.vm.$nextTick();
const showMoreShopsLink = wrapper.findComponent({ ref: "showMoreShopsLink" });
await wrapper.vm.$nextTick();

View file

@ -22,7 +22,7 @@
validationRules="option-required"
:additionalButtonData="additionalButtonData" />
<textLink
v-show="displaySeeMoreLocationsLink"
v-if="displaySeeMoreLocationsLink"
ref="showMoreShopsLink"
class="show-more-shops-link"
id="showMoreShopsId"

View file

@ -1,8 +1,8 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<div class="container-fluid page-container-grouped-styles vehicle-damage">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -3,8 +3,8 @@
<div class="vehicle-parts small-question-text">
<loadingModal ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -1,8 +1,8 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<div class="container-fluid">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>
@ -48,7 +48,6 @@
validationRules="style-required"
placeHolderText="Select style"
inputId="styleQuestionField" />
<div class="col-md-3">&nbsp;</div>
<vehicleBanner
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="displayGeneric"

View file

@ -2,8 +2,8 @@
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<loadingModal ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles">
<div class="row">
<div class="col">
<div class="row justify-content-center">
<div class="col-md-6">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" />
</div>
</div>

View file

@ -91,7 +91,6 @@ export default {
lineItem.partType != partTypeStrings.RAIN_DEFENSE
);
});
console.log("step one", lineItemsToPrice);
let totalPrice = this.getTotalPriceOfAllLineItemsAndChildParts(lineItemsToPrice);
return totalPrice;
},
@ -113,14 +112,7 @@ export default {
lineItem.childParts
);
}
console.log(
"step two, lineItem name: ",
lineItem.partNumber,
" / totalPrice: ",
totalPrice
);
});
console.log("step three", totalPrice);
return totalPrice;
},
getTotalLineItemPrice(lineItem) {

View file

@ -29,14 +29,7 @@ import analyticsMixin from "@/mixins/analytics-mixin";
import { experimentTriggers } from "../constants/experiments";
import { applicationConfig } from "../constants/application-config";
import review from "@/layouts/review/review";
import paymentMethod from "@/layouts/payment-method/payment-method";
const routes = [
{
path: "/payment-method", // This is a temporary route for testing.
name: "payment-method",
component: paymentMethod,
},
{
path: "/",
name: "root",

View file

@ -465,11 +465,19 @@ const routingTable = function (store) {
scenario: navigationScenarios.CLICKED_CUSTOMER_EDIT,
destinationFmgPageValue: fmgPageValues.CUSTOMER_DETAILS,
},
{
scenario: navigationScenarios.CLICKED_FORWARD,
destinationFmgPageValue: fmgPageValues.PAYMENT_METHOD,
},
],
},
{
fmgPageValue: fmgPageValues.PAYMENT_METHOD,
maps: [
{
scenario: navigationScenarios.CLICKED_BACK,
destinationFmgPageValue: fmgPageValues.REVIEW,
},
{
scenario: navigationScenarios.CLICKED_FORWARD,
destinationFmgPageValue: fmgPageValues.CONFIRMATION,

View file

@ -504,6 +504,7 @@ export const mutations = {
// Export Getters
export const getters = {
submitAfterSave: (state) => state.submitAfterSave,
vehicle: (state) => state.order.vehicle,
eventBusItem: (state) => (eventCategory, eventSubCategory) => {
const matchedEvent = state.applicationUser.eventBus.find(

View file

@ -2767,6 +2767,17 @@ describe("Actions", () => {
});
describe("Getters", () => {
it("submitAfterSave, should return true", () => {
// Arrange
const storeState = state;
// Act
mutations.updateWorkOrderFlag(storeState, true);
// Assert
expect(getters.submitAfterSave(storeState)).toEqual(true);
});
it("Vehicle getter, should return vehicle data", () => {
// Arrange
const storeState = state;

View file

@ -7,6 +7,7 @@ body {
.container-fluid {
max-width: 1400px;
padding: 0 1.5rem;
position: relative;
.prevent-squish {
overflow-x: unset;
}