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

Merge pull request #722 from Safelite/feature/CSR-743-revert-temp-tests

Browse source 
Feature/csr 743 revert temp tests
This commit is contained in:
katieoh-safelite 2022-09-08 08:35:52 -04:00 committed by GitHub
commit ed59ea0023
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 143 additions and 237 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 { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import baseMixin from "@/mixins/base-mixin.js";
import analyticsMixIn from "@/mixins/analytics-mixin.js";
// Components
import vehicleMake from "@/layouts/vehicle-make/vehicle-make.vue";
import makeQuestion from "@/layouts/vehicle-make/make-question/make-question";
@ -30,88 +30,83 @@ jest.mock("@/helpers/layout-helper.js", () => ({
settleAllPromises: jest.fn(),
}));
test.todo("Removed for merging")
// describe("vehicle-make.vue", () => {
// // test("Make question component is initized with api data", async (done) => {
// // //Arrange
// // const makeQuestionInitialData = ["honda", "ford", "dodge"];
// // const { wrapper, apiPromise } = setupMocks({
// // makeQuestionInitialData: makeQuestionInitialData,
// // });
describe("vehicle-make.vue", () => {
test("Make question component is initized with api data", async (done) => {
//Arrange
const makeQuestionInitialData = ["honda", "ford", "dodge"];
const { wrapper, apiPromise } = setupMocks({
makeQuestionInitialData: makeQuestionInitialData,
});
// // //Act
// // vehicleMake.beforeRouteEnter.call(
// // wrapper.vm,
// // { query: { fmgPage: "vehicle-make" } },
// // undefined,
// // (c) => c(wrapper.vm)
// // );
//Act
vehicleMake.beforeRouteEnter.call(
wrapper.vm,
{ query: { fmgPage: "vehicle-make" } },
undefined,
(c) => c(wrapper.vm)
);
// // //Assert
// // apiPromise.finally(() => {
// // expect(makeQuestion.methods.initializeComponent).toHaveBeenCalledWith(
// // makeQuestionInitialData
// // );
// // done();
// // });
// // });
// });
//Assert
apiPromise.finally(() => {
expect(makeQuestion.methods.initializeComponent).toHaveBeenCalledWith(
makeQuestionInitialData
);
done();
});
});
});
// describe("vehicle-make.vue", () => {
// // test("BackButtonAction triggers a router.navigateWithoutSaving change", async (done) => {
// // //Arrange
// // const { wrapper, apiPromise } = setupMocks({
// // pageHeaderWidgetHeaderText: "Select a make to get started",
// // mountOptionsMockData: {
// // router: {
// // navigate: jest.fn(),
// // navigateWithoutSaving: jest.fn(),
// // },
// // },
// // });
describe("vehicle-make.vue", () => {
test("BackButtonAction triggers a router.navigateWithoutSaving change", async (done) => {
//Arrange
const { wrapper, apiPromise } = setupMocks({
pageHeaderWidgetHeaderText: "Select a make to get started",
mountOptionsMockData: {
router: {
navigate: jest.fn(),
navigateWithoutSaving: jest.fn(),
},
},
});
// // //Act
// // vehicleMake.beforeRouteEnter.call(
// // wrapper.vm,
// // { query: { fmgPage: "vehicle-make" } },
// // undefined,
// // (c) => c(wrapper.vm)
// // );
// // wrapper.vm.backButtonAction();
// // await nextTick();
//Act
vehicleMake.beforeRouteEnter.call(
wrapper.vm,
{ query: { fmgPage: "vehicle-make" } },
undefined,
(c) => c(wrapper.vm)
);
wrapper.vm.backButtonAction();
await nextTick();
// // //Assert
// // apiPromise.finally(() => {
// // expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalled();
// // done();
// // });
// // });
// });
//Assert
apiPromise.finally(() => {
expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalled();
done();
});
});
});
// describe("vehicle-make.vue", () => {
// // test("Year set, arePagePrerequisitesValid should be true ", async () => {
// // //Arrange
// // const { wrapper } = setupMocks({
// // mountOptionsMockData: {
// // mixins: analyticsMixIn
// // }
// // });
describe("vehicle-make.vue", () => {
test("Year set, arePagePrerequisitesValid should be true ", async () => {
//Arrange
const { wrapper } = setupMocks({});
// // //Act
// // vehicleMake.beforeRouteEnter.call(
// // wrapper.vm,
// // { query: { fmgPage: "vehicle-make" } },
// // undefined,
// // (c) => c(wrapper.vm)
// // );
//Act
vehicleMake.beforeRouteEnter.call(
wrapper.vm,
{ query: { fmgPage: "vehicle-make" } },
undefined,
(c) => c(wrapper.vm)
);
// // let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
// // //Assert
// // expect(arePagePrerequisitesValid).toBe(true);
// // });
// });
//Assert
expect(arePagePrerequisitesValid).toBe(true);
});
});
function setupMocks({

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

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

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

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

19
src/router/index.js
View file

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