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

Merge remote-tracking branch 'origin/release/2022.09.15' into feature/parts-pages-cleanup-KO

Browse source
This commit is contained in:
Katie 2022-09-09 13:34:58 -04:00
commit f51135b030
8 changed files with 144 additions and 238 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/layouts/test-one.vue
View file

@ -1,15 +0,0 @@
<template>
Test1
</template>
<script>
export default {
name: "test1",
methods: {
arePagePrerequisitesValid() {
return true;
}
}
}
</script>

15
src/layouts/test-two.vue
View file

@ -1,15 +0,0 @@
<template>
Test2
</template>
<script>
export default {
name: "test2",
methods: {
arePagePrerequisitesValid() {
return true;
}
}
}
</script>

141
src/layouts/vehicle-make/vehicle-make.spec.js
View file

@ -5,7 +5,7 @@ import { settleAllPromises } from "@/helpers/layout-helper.js";
import { nextTick } from "vue"; import { nextTick } from "vue";
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import baseMixin from "@/mixins/base-mixin.js"; import baseMixin from "@/mixins/base-mixin.js";
import analyticsMixIn from "@/mixins/analytics-mixin.js";
// Components // Components
import vehicleMake from "@/layouts/vehicle-make/vehicle-make.vue"; import vehicleMake from "@/layouts/vehicle-make/vehicle-make.vue";
import makeQuestion from "@/layouts/vehicle-make/make-question/make-question"; import makeQuestion from "@/layouts/vehicle-make/make-question/make-question";
@ -30,88 +30,83 @@ jest.mock("@/helpers/layout-helper.js", () => ({
settleAllPromises: jest.fn(), settleAllPromises: jest.fn(),
})); }));
test.todo("Removed for merging")
// describe("vehicle-make.vue", () => { describe("vehicle-make.vue", () => {
// // test("Make question component is initized with api data", async (done) => { test("Make question component is initized with api data", async (done) => {
// // //Arrange //Arrange
// // const makeQuestionInitialData = ["honda", "ford", "dodge"]; const makeQuestionInitialData = ["honda", "ford", "dodge"];
// // const { wrapper, apiPromise } = setupMocks({ const { wrapper, apiPromise } = setupMocks({
// // makeQuestionInitialData: makeQuestionInitialData, makeQuestionInitialData: makeQuestionInitialData,
// // }); });
// // //Act //Act
// // vehicleMake.beforeRouteEnter.call( vehicleMake.beforeRouteEnter.call(
// // wrapper.vm, wrapper.vm,
// // { query: { fmgPage: "vehicle-make" } }, { query: { fmgPage: "vehicle-make" } },
// // undefined, undefined,
// // (c) => c(wrapper.vm) (c) => c(wrapper.vm)
// // ); );
// // //Assert //Assert
// // apiPromise.finally(() => { apiPromise.finally(() => {
// // expect(makeQuestion.methods.initializeComponent).toHaveBeenCalledWith( expect(makeQuestion.methods.initializeComponent).toHaveBeenCalledWith(
// // makeQuestionInitialData makeQuestionInitialData
// // ); );
// // done(); done();
// // }); });
// // }); });
// }); });
// describe("vehicle-make.vue", () => { describe("vehicle-make.vue", () => {
// // test("BackButtonAction triggers a router.navigateWithoutSaving change", async (done) => { test("BackButtonAction triggers a router.navigateWithoutSaving change", async (done) => {
// // //Arrange //Arrange
// // const { wrapper, apiPromise } = setupMocks({ const { wrapper, apiPromise } = setupMocks({
// // pageHeaderWidgetHeaderText: "Select a make to get started", pageHeaderWidgetHeaderText: "Select a make to get started",
// // mountOptionsMockData: { mountOptionsMockData: {
// // router: { router: {
// // navigate: jest.fn(), navigate: jest.fn(),
// // navigateWithoutSaving: jest.fn(), navigateWithoutSaving: jest.fn(),
// // }, },
// // }, },
// // }); });
// // //Act //Act
// // vehicleMake.beforeRouteEnter.call( vehicleMake.beforeRouteEnter.call(
// // wrapper.vm, wrapper.vm,
// // { query: { fmgPage: "vehicle-make" } }, { query: { fmgPage: "vehicle-make" } },
// // undefined, undefined,
// // (c) => c(wrapper.vm) (c) => c(wrapper.vm)
// // ); );
// // wrapper.vm.backButtonAction(); wrapper.vm.backButtonAction();
// // await nextTick(); await nextTick();
// // //Assert //Assert
// // apiPromise.finally(() => { apiPromise.finally(() => {
// // expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalled(); expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalled();
// // done(); done();
// // }); });
// // }); });
// }); });
// describe("vehicle-make.vue", () => { describe("vehicle-make.vue", () => {
// // test("Year set, arePagePrerequisitesValid should be true ", async () => { test("Year set, arePagePrerequisitesValid should be true ", async () => {
// // //Arrange //Arrange
// // const { wrapper } = setupMocks({ const { wrapper } = setupMocks({});
// // mountOptionsMockData: {
// // mixins: analyticsMixIn
// // }
// // });
// // //Act //Act
// // vehicleMake.beforeRouteEnter.call( vehicleMake.beforeRouteEnter.call(
// // wrapper.vm, wrapper.vm,
// // { query: { fmgPage: "vehicle-make" } }, { query: { fmgPage: "vehicle-make" } },
// // undefined, undefined,
// // (c) => c(wrapper.vm) (c) => c(wrapper.vm)
// // ); );
// // let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
// // //Assert //Assert
// // expect(arePagePrerequisitesValid).toBe(true); expect(arePagePrerequisitesValid).toBe(true);
// // }); });
// }); });
function setupMocks({ function setupMocks({

177
src/layouts/vehicle-make/vehicle-make.vue
View file

@ -1,23 +1,20 @@
<template> <template>
<div class="page-container-grouped-styles"> <div class="page-container-grouped-styles">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" /> <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
<div class="select-car"> <div class="select-car">
<div class="select-car-form rounded text-center"> <div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" displayGenericVehicleImage /> <vehicleBanner cmsWidgetName="VehicleBannerWidget" displayGenericVehicleImage />
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" :hasBackButton="true" <funnelSubHeader
@click-event="backButtonAction" /> cmsWidgetName="FunnelSubHeaderWidget"
<div v-if="shouldShowText"> :hasBackButton="true"
{{ textToShow }} @click-event="backButtonAction"
</div> />
<button @click="logCustomExposureTest"> <div class="fade-on-route-transition">
Click me to log exposure! <makeQuestion v-model="selectedMake" ref="makeQuestion" cmsWidgetName="VehicleMakeQuestion" />
</button>
<div class="fade-on-route-transition">
<makeQuestion v-model="selectedMake" ref="makeQuestion" cmsWidgetName="VehicleMakeQuestion" />
</div>
</div>
</div> </div>
</div>
</div> </div>
</div>
</template> </template>
<script> <script>
@ -29,103 +26,77 @@ import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-he
// Supporting files // Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import { settleAllPromises } from "@/helpers/layout-helper"; import { settleAllPromises } from "@/helpers/layout-helper";
import { storeMutations } from "@/constants/store-mutations";
import { storeActions } from "@/constants/store-actions"; import { storeActions } from "@/constants/store-actions";
import store from "@/store"; import store from "@/store";
import { getDeviceIdValue, getSessionKeyValue } from "@/helpers/heritage-integration/cookie-helper";
export default { export default {
name: "vehicle-make", name: "vehicle-make",
data() { data() {
return { return {
selectedMake: null, selectedMake: null,
}; };
}, },
computed: { computed: {},
shouldShowText() {
return this.hasSettingEqualTo("someKey", "true");
},
textToShow() {
return store.getters.experimentSettings.sampleSetting
}
},
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
// Call APIs // Call APIs
const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage); const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
const makeQuestionInitialDataPromise = const makeQuestionInitialDataPromise =
makeQuestion.methods.loadInitialData(); makeQuestion.methods.loadInitialData();
// Settle promises and get results // Settle promises and get results
const promiseResultMap = [ const promiseResultMap = [
{ {
resultKey: "cmsContent", resultKey: "cmsContent",
promise: cmsContentPromise, promise: cmsContentPromise,
}, },
{ {
resultKey: "makeQuestionInitialData", resultKey: "makeQuestionInitialData",
promise: makeQuestionInitialDataPromise, promise: makeQuestionInitialDataPromise,
}, },
]; ];
const resultMap = await settleAllPromises(promiseResultMap); const resultMap = await settleAllPromises(promiseResultMap);
// Call the "next" function to complete the transition to this page. // Call the "next" function to complete the transition to this page.
next((vm) => { next((vm) => {
vm.setCmsContent(resultMap.cmsContent); vm.setCmsContent(resultMap.cmsContent);
vm.$refs.makeQuestion.initializeComponent( vm.$refs.makeQuestion.initializeComponent(
resultMap.makeQuestionInitialData resultMap.makeQuestionInitialData
); );
}); });
},
methods: {
backButtonAction() {
// route to move backwards
this.$router.navigateWithoutSaving(
this.navigationScenarios.CLICKED_BACK,
this.$route
);
}, },
arePagePrerequisitesValid() {
methods: { if (store.getters.vehicle.year){
async logCustomExposureTest() { return true;
console.log("HITHERE") }
await this.dispatchStoreAction(storeActions.RUN_EXPERIMENTS_FOR_TRIGGER, { return false;
userId: getDeviceIdValue(),
triggerEvent: "PageEntry",
triggerValue: "vehicle-make"
})
const testExperiment = store.getters.applicationUser.experiments.find(e => e.universeName === "Concept Funnel Test With Rules")
console.log(testExperiment)
await this.dispatchStoreAction(storeActions.LOG_EXPERIMENT_EXPOSURE,
{
userId: getDeviceIdValue(),
sessionKey: getSessionKeyValue(),
pageName: "vehicle-make",
experiment: testExperiment
}, false);
},
backButtonAction() {
// route to move backwards
this.$router.navigateWithoutSaving(
this.navigationScenarios.CLICKED_BACK,
this.$route
);
},
arePagePrerequisitesValid() {
if (store.getters.vehicle.year) {
return true;
}
return false;
},
}, },
},
watch: { watch: {
selectedMake(make) { selectedMake(make) {
this.dispatchStoreAction(storeActions.SAVE_VEHICLE_MAKE, make, false); this.dispatchStoreAction(storeActions.SAVE_VEHICLE_MAKE, make, false);
this.$router.navigateWithSaving( this.$router.navigateWithSaving(
this.navigationScenarios.SELECTED_MAKE, this.navigationScenarios.SELECTED_MAKE,
this.$route this.$route
); );
},
}, },
},
components: { components: {
makeQuestion, makeQuestion,
funnelHeader, funnelHeader,
vehicleBanner, vehicleBanner,
funnelSubHeader, funnelSubHeader,
}, },
}; };
</script> </script>

3
src/mixins/experiment-mixin.js
View file

@ -3,9 +3,6 @@ import store from "@/store";
export default { export default {
methods: { methods: {
hasSettingEqualTo(settingName, settingValue) { hasSettingEqualTo(settingName, settingValue) {
console.log(store.getters.experimentSettings)
console.log(store.getters.experimentSettings[settingName])
console.log(settingValue)
return store.getters.experimentSettings[settingName] == settingValue; return store.getters.experimentSettings[settingName] == settingValue;
}, },
hasSetting(settingName) { hasSetting(settingName) {

19
src/router/index.js
View file

@ -20,23 +20,8 @@ import store from "@/store";
import analyticsMixin from "@/mixins/analytics-mixin"; import analyticsMixin from "@/mixins/analytics-mixin";
import { experimentTriggers } from "../constants/experiments"; import { experimentTriggers } from "../constants/experiments";
import { applicationConfig } from "../constants/application-config"; import { applicationConfig } from "../constants/application-config";
import TestOne from "@/layouts/test-one";
import TestTwo from "@/layouts/test-two";
const routes = [ const routes = [
{
path: "/test1",
name: "test1",
components: {
default: TestOne
}
},
{
path: "/test2",
name: "test2",
components: {
default: TestTwo
}
},
{ {
path: "/", path: "/",
name: "root", name: "root",
@ -240,8 +225,6 @@ function navigateToUrl(url, optionalQuery = {}) {
externalUrl.searchParams.append(queryKey, optionalQuery[queryKey]); externalUrl.searchParams.append(queryKey, optionalQuery[queryKey]);
} }
externalUrl.searchParams.append("experiments", "ConceptFunnel=ConceptFunnel_V1=ConceptFunnel_TEST=true");
window.location.assign(externalUrl); window.location.assign(externalUrl);
} }

10
src/router/router-constants/routing-table.js
View file

@ -7,16 +7,6 @@ const routingTable = function(store) {
{ {
fmgPageValue: fmgPageValues.VEHICLE_YEAR, fmgPageValue: fmgPageValues.VEHICLE_YEAR,
maps: [ maps: [
{
scenario: navigationScenarios.SELECTED_YEAR,
destinationFmgPageValue: "test1",
filter: store.getters.vehicle.year === 2010
},
{
scenario: navigationScenarios.SELECTED_YEAR,
destinationFmgPageValue: "test2",
filter: store.getters.vehicle.year < 1954
},
{ {
scenario: navigationScenarios.SELECTED_YEAR, scenario: navigationScenarios.SELECTED_YEAR,
destinationFmgPageValue: fmgPageValues.VEHICLE_MAKE, destinationFmgPageValue: fmgPageValues.VEHICLE_MAKE,

2
src/store/index.js
View file

@ -391,7 +391,7 @@ export const getters = {
funnelServiceZipCode: state.order.serviceLocation.zipCode, funnelServiceZipCode: state.order.serviceLocation.zipCode,
funnelParentAccountNumber: state.order.accountNumber, funnelParentAccountNumber: state.order.accountNumber,
funnelIsCoverageVerified: state.order.payment.insuranceCoverage.isVerified, funnelIsCoverageVerified: state.order.payment.insuranceCoverage.isVerified,
funnelHasRecalibrationPart: getAllValuesOfPropertyInArrayOfObjects(state.order.lineItems.glassParts, "requiresRecalibration")?.length > 0, funnelHasRecalibrationPart: getHasRecalibrationPart(state),
funnelSelectedMultiGlass: state.order.damage.glassToReplace?.length > 1, funnelSelectedMultiGlass: state.order.damage.glassToReplace?.length > 1,
funnelSelectedWindshieldGlass: getAllValuesOfPropertyInArrayOfObjects(state.order.damage.glassToReplace, "glassLocation").includes(damageLocationsSelected.WINDSHIELD), funnelSelectedWindshieldGlass: getAllValuesOfPropertyInArrayOfObjects(state.order.damage.glassToReplace, "glassLocation").includes(damageLocationsSelected.WINDSHIELD),
funnelSelectedBackGlass: getAllValuesOfPropertyInArrayOfObjects(state.order.damage.glassToReplace, "glassLocation").includes(damageLocationsSelected.REAR), funnelSelectedBackGlass: getAllValuesOfPropertyInArrayOfObjects(state.order.damage.glassToReplace, "glassLocation").includes(damageLocationsSelected.REAR),