From e6e55e7e3b642b1d48ba4db25cb48ed4a194eeb8 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 6 Jun 2023 15:24:33 -0400 Subject: [PATCH 1/7] Initial blocking out --- .../damage-review/damage-review.spec.js | 3 ++ .../damage-review/damage-review.vue | 33 +++++++++++++++++++ src/layouts/review/review.vue | 7 ++++ 3 files changed, 43 insertions(+) create mode 100644 src/layouts/review/review-sections/damage-review/damage-review.spec.js create mode 100644 src/layouts/review/review-sections/damage-review/damage-review.vue diff --git a/src/layouts/review/review-sections/damage-review/damage-review.spec.js b/src/layouts/review/review-sections/damage-review/damage-review.spec.js new file mode 100644 index 000000000..ee5ec0816 --- /dev/null +++ b/src/layouts/review/review-sections/damage-review/damage-review.spec.js @@ -0,0 +1,3 @@ +describe("Damage Review Block", () => { + test.todo("Add more tests as specific functionality is added."); +}); diff --git a/src/layouts/review/review-sections/damage-review/damage-review.vue b/src/layouts/review/review-sections/damage-review/damage-review.vue new file mode 100644 index 000000000..b769b9489 --- /dev/null +++ b/src/layouts/review/review-sections/damage-review/damage-review.vue @@ -0,0 +1,33 @@ + + + diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue index 3f7e45639..85491ad97 100644 --- a/src/layouts/review/review.vue +++ b/src/layouts/review/review.vue @@ -41,6 +41,10 @@ cmsWidgetName="VehicleReviewWidget" :vehicle="vehicleInfo" @edit-clicked="editVehicle" /> + +
+ +
@@ -60,6 +64,7 @@ import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner"; import buttonMain from "@/ux-components/button-main/button-main"; import textBlock from "@/digital-components/text-block/text-block"; import vehicleReview from "@/layouts/review/review-sections/vehicle-review/vehicle-review"; +import damageReview from "@/layouts/review/review-sections/damage-review/damage-review"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { settleAllPromises } from "@/helpers/layout-helper"; @@ -99,6 +104,7 @@ export default { this.$route ); }, + editDamage() {}, }, computed: { subHeaderTitle() { @@ -121,6 +127,7 @@ export default { buttonMain, textBlock, vehicleReview, + damageReview, }, }; From 8939a57a163a149d4fba824b8124ebdcfdbf9630 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 6 Jun 2023 16:10:41 -0400 Subject: [PATCH 2/7] Fix component name --- .../review/review-sections/damage-review/damage-review.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/layouts/review/review-sections/damage-review/damage-review.vue b/src/layouts/review/review-sections/damage-review/damage-review.vue index b769b9489..667826f17 100644 --- a/src/layouts/review/review-sections/damage-review/damage-review.vue +++ b/src/layouts/review/review-sections/damage-review/damage-review.vue @@ -9,7 +9,7 @@ import reviewBlock from "@/layouts/review/review-block/review-block"; export default { - name: "vehicle-review", + name: "damage-review", props: { cmsWidgetName: String, }, From ea177efca953fc199b60fec5c27da6c7a0b3109c Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 6 Jun 2023 16:11:01 -0400 Subject: [PATCH 3/7] Pull damage information from store --- .../review-sections/damage-review/damage-review.vue | 9 ++++++++- src/layouts/review/review.vue | 8 +++++++- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/src/layouts/review/review-sections/damage-review/damage-review.vue b/src/layouts/review/review-sections/damage-review/damage-review.vue index 667826f17..ea9422a26 100644 --- a/src/layouts/review/review-sections/damage-review/damage-review.vue +++ b/src/layouts/review/review-sections/damage-review/damage-review.vue @@ -12,6 +12,7 @@ export default { name: "damage-review", props: { cmsWidgetName: String, + damage: Object, }, data() { return {}; @@ -23,7 +24,13 @@ export default { }, computed: { displayContent() { - return ["Test"]; + return [ + this.damage.isRepair + ? `Windshield repair - ${this.damage.numberOfChips} chip${ + this.damage.numberOfChips !== 1 ? "s" : "" + }` + : "Windshield Replace", + ]; }, }, components: { diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue index 85491ad97..a9a7e8e72 100644 --- a/src/layouts/review/review.vue +++ b/src/layouts/review/review.vue @@ -44,7 +44,10 @@
- +
@@ -119,6 +122,9 @@ export default { vehicleInfo() { return this.$store.getters.vehicle; }, + damageInfo() { + return this.$store.getters.damage; + }, }, components: { funnelHeader, From 17a5325a7c7be4abb764feb987e433387d4cf37e Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 6 Jun 2023 16:33:44 -0400 Subject: [PATCH 4/7] Add edit action to navigate to vehicle-damage --- src/layouts/review/review.vue | 7 ++++++- src/router/router-constants/navigation-scenarios.js | 1 + src/router/router-constants/routing-table.js | 4 ++++ 3 files changed, 11 insertions(+), 1 deletion(-) diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue index a9a7e8e72..e3c173a02 100644 --- a/src/layouts/review/review.vue +++ b/src/layouts/review/review.vue @@ -107,7 +107,12 @@ export default { this.$route ); }, - editDamage() {}, + editDamage() { + this.$router.navigateWithoutSaving( + this.navigationScenarios.CLICKED_DAMAGE_EDIT, + this.$route + ); + }, }, computed: { subHeaderTitle() { diff --git a/src/router/router-constants/navigation-scenarios.js b/src/router/router-constants/navigation-scenarios.js index 4b61687cb..2cbf5dd69 100644 --- a/src/router/router-constants/navigation-scenarios.js +++ b/src/router/router-constants/navigation-scenarios.js @@ -51,6 +51,7 @@ const navigationScenarios = { // Review CLICKED_VEHICLE_EDIT: "CLICKED_VEHICLE_EDIT", + CLICKED_DAMAGE_EDIT: "CLICKED_DAMAGE_EDIT", }; export { navigationScenarios }; diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js index 0f2bfa355..14fcbbf8a 100644 --- a/src/router/router-constants/routing-table.js +++ b/src/router/router-constants/routing-table.js @@ -442,6 +442,10 @@ const routingTable = function (store) { scenario: navigationScenarios.CLICKED_VEHICLE_EDIT, destinationFmgPageValue: fmgPageValues.VEHICLE_YEAR, }, + { + scenario: navigationScenarios.CLICKED_DAMAGE_EDIT, + destinationFmgPageValue: fmgPageValues.VEHICLE_DAMAGE, + }, ], }, ]; From 793530788b80cde95d475915c48493fde48c5ad1 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 7 Jun 2023 10:06:12 -0400 Subject: [PATCH 5/7] Add darker coloring for review-blocks --- src/digital-components/text-block/text-block.vue | 3 +++ src/layouts/review/review-block/review-block.vue | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/digital-components/text-block/text-block.vue b/src/digital-components/text-block/text-block.vue index 3a608f3a0..c6a899309 100644 --- a/src/digital-components/text-block/text-block.vue +++ b/src/digital-components/text-block/text-block.vue @@ -46,5 +46,8 @@ export default { &.bold { font-weight: 500; } + &.dark { + color: $black; + } } diff --git a/src/layouts/review/review-block/review-block.vue b/src/layouts/review/review-block/review-block.vue index 128e488d7..0b1f913c3 100644 --- a/src/layouts/review/review-block/review-block.vue +++ b/src/layouts/review/review-block/review-block.vue @@ -3,7 +3,7 @@
From 78a1df30c20047dbd8301f5f1abaf14057c165a7 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 7 Jun 2023 10:08:09 -0400 Subject: [PATCH 6/7] Slight change to terminology --- .../review/review-sections/damage-review/damage-review.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/layouts/review/review-sections/damage-review/damage-review.vue b/src/layouts/review/review-sections/damage-review/damage-review.vue index ea9422a26..f7db11554 100644 --- a/src/layouts/review/review-sections/damage-review/damage-review.vue +++ b/src/layouts/review/review-sections/damage-review/damage-review.vue @@ -29,7 +29,7 @@ export default { ? `Windshield repair - ${this.damage.numberOfChips} chip${ this.damage.numberOfChips !== 1 ? "s" : "" }` - : "Windshield Replace", + : "Windshield crack", ]; }, }, From 33af471b030c4bb9c130dcef0fe07ce83acd62cf Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 7 Jun 2023 10:30:02 -0400 Subject: [PATCH 7/7] Implement unit tests --- .../damage-review/damage-review.spec.js | 71 ++++++++++++++++++- 1 file changed, 70 insertions(+), 1 deletion(-) diff --git a/src/layouts/review/review-sections/damage-review/damage-review.spec.js b/src/layouts/review/review-sections/damage-review/damage-review.spec.js index ee5ec0816..a6dbe6f2d 100644 --- a/src/layouts/review/review-sections/damage-review/damage-review.spec.js +++ b/src/layouts/review/review-sections/damage-review/damage-review.spec.js @@ -1,3 +1,72 @@ +import { shallowMount } from "@vue/test-utils"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; +import damageReview from "@/layouts/review/review-sections/damage-review/damage-review"; + +jest.mock("@/helpers/cms-content-helper", () => ({ + fetchCmsContentForPage: () => Promise.resolve("content"), +})); + describe("Damage Review Block", () => { - test.todo("Add more tests as specific functionality is added."); + describe("Correctly assembles damage info into a display string", () => { + test("Basic Replace", async () => { + // Arrange + const { wrapper } = setupMocks({ + propsData: { + damage: { + isRepair: false, + }, + }, + }); + + // Act + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.displayContent).toStrictEqual(["Windshield crack"]); + }); + + test("Basic Repair", async () => { + // Arrange + const { wrapper } = setupMocks({ + propsData: { + damage: { + isRepair: true, + numberOfChips: 2, + }, + }, + }); + + // Act + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.displayContent).toStrictEqual(["Windshield repair - 2 chips"]); + }); + + test("Basic Repair - no s with 1 chip", async () => { + // Arrange + const { wrapper } = setupMocks({ + propsData: { + damage: { + isRepair: true, + numberOfChips: 1, + }, + }, + }); + + // Act + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.displayContent).toStrictEqual(["Windshield repair - 1 chip"]); + }); + }); }); + +function setupMocks(customMountOptions) { + const mountOptions = getMountOptions(customMountOptions); + + const wrapper = shallowMount(damageReview, mountOptions); + wrapper.vm.setCmsContent = jest.fn(); + return { wrapper }; +}