From ed94db7b0eae31b89a75d96657fb1b5a2a43dd0d Mon Sep 17 00:00:00 2001 From: Adam Caouette Date: Thu, 7 Apr 2022 16:28:30 -0400 Subject: [PATCH 1/5] CSR-419: adjust styles for padding --- src/ux-components/list-card/list-card.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/ux-components/list-card/list-card.vue b/src/ux-components/list-card/list-card.vue index d984ac171..eb0570c58 100644 --- a/src/ux-components/list-card/list-card.vue +++ b/src/ux-components/list-card/list-card.vue @@ -107,7 +107,7 @@ export default { computed: { getLabelClasses() { if (this.isWide) { - let classes = "flex-row py-r ps-3 pe-4"; + let classes = "flex-row py-2 ps-4 pe-4"; if (this.buttonLabelSubCopy) { classes += " checkboxTop"; } @@ -173,7 +173,7 @@ export default { // svg's should be constructed on the same canvas size/viewbox to ensure they occupy the same space in the DOM. This will allow easy/proper alignment of elements. See exisitng svg's for examples. height: auto; width: 6.5rem; - margin-bottom: 3rem; + margin-bottom: 2.2rem; max-width: 100%; } From 4dd442596cd90f85bc40071b25d762812717e59a Mon Sep 17 00:00:00 2001 From: Katie Date: Thu, 7 Apr 2022 17:13:43 -0400 Subject: [PATCH 2/5] CSR-98 Add vehicle years for QA --- src/layouts/vehicle-damage/vehicle-damage.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index 893e7d572..da252308a 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -277,7 +277,8 @@ export default { navigateForward(partsData){ // CSR-98 TEMP - if (store.getters.vehicle.year == 2010) { + const vehicleYearsToShowHeritageFunnel = [ "2001", "2002", "2010" ]; + if (vehicleYearsToShowHeritageFunnel.includes(store.getters.vehicle.year)) { navigateToHeritageFunnel(); return; } From 7a1e5b8f4f1834b4580f30f46770ce3a36fe74fa Mon Sep 17 00:00:00 2001 From: Adam Caouette Date: Thu, 7 Apr 2022 17:24:38 -0400 Subject: [PATCH 3/5] CSR-419: update unit tests for css changes --- src/ux-components/list-card/list-card.spec.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/ux-components/list-card/list-card.spec.js b/src/ux-components/list-card/list-card.spec.js index 11f24abbb..3aa803cc1 100644 --- a/src/ux-components/list-card/list-card.spec.js +++ b/src/ux-components/list-card/list-card.spec.js @@ -145,7 +145,7 @@ describe("list-card.vue", () => { // Assert const label = wrapper.find("label"); - expect(label.classes()).toEqual(["d-flex", "w-100", "align-items-center", "px-2", "h-100", "flex-row", "py-r", "ps-3", "pe-4"]); + expect(label.classes()).toEqual(["d-flex", "w-100", "align-items-center", "px-2", "h-100", "flex-row", "py-2", "ps-4", "pe-4"]); }); it("Should return flex row classes if isWide is true and checkboxTop if buttonLabelSubCopy is true", async () => { @@ -167,7 +167,7 @@ describe("list-card.vue", () => { // Assert const label = wrapper.find("label"); - expect(label.classes()).toEqual(["d-flex", "w-100", "align-items-center", "px-2", "h-100", "flex-row", "py-r", "ps-3", "pe-4", "checkboxTop"]); + expect(label.classes()).toEqual(["d-flex", "w-100", "align-items-center", "px-2", "h-100", "flex-row", "py-2", "ps-4", "pe-4", "checkboxTop"]); }); it("Should return flex column classes if isWide is false", async () => { From 044464ea27d0e6e5a890f2b448eebfad239e0f52 Mon Sep 17 00:00:00 2001 From: CarlNation Date: Fri, 8 Apr 2022 08:48:19 -0400 Subject: [PATCH 4/5] CSR-92 call intializeComp for replace options --- .../vehicle-damage/windshield-options/windshield-options.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/layouts/vehicle-damage/windshield-options/windshield-options.vue b/src/layouts/vehicle-damage/windshield-options/windshield-options.vue index 7802dfbff..017bb4c6e 100644 --- a/src/layouts/vehicle-damage/windshield-options/windshield-options.vue +++ b/src/layouts/vehicle-damage/windshield-options/windshield-options.vue @@ -99,9 +99,9 @@ export default ({ }, methods: { - initializeComponent( - windshieldAvailableReplacementOptions){ + initializeComponent(windshieldAvailableReplacementOptions){ this.windshieldAvailableReplacementOptions = windshieldAvailableReplacementOptions; + this.$refs.replaceOptionsQuestion.initializeComponent(windshieldAvailableReplacementOptions); }, getWindshieldOptions(selectedWindshieldDamageType, selectedWindshieldChipCount, selectedWindshieldReplaceOptions){ // ONLY UPDATE THE NEW VALUE IF IT IS TRUTHY (NOT NULL) From e1da84ee61b1bf22bec154ea764d26830c406066 Mon Sep 17 00:00:00 2001 From: Max Date: Fri, 8 Apr 2022 13:02:46 -0400 Subject: [PATCH 5/5] Adding new cms content retrieval method to alert component --- .../license-plate-lookup.vue | 21 +++------------- src/layouts/vehicle-damage/vehicle-damage.vue | 3 +-- .../windshield-options/windshield-options.vue | 6 ++--- src/layouts/vehicle-parts/vehicle-parts.vue | 10 +------- src/ux-components/alert/alert.spec.js | 24 ++++++++++++++----- src/ux-components/alert/alert.vue | 22 +++++++---------- 6 files changed, 33 insertions(+), 53 deletions(-) diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.vue b/src/layouts/license-plate-lookup/license-plate-lookup.vue index 1f99a38bc..a6d181ddd 100644 --- a/src/layouts/license-plate-lookup/license-plate-lookup.vue +++ b/src/layouts/license-plate-lookup/license-plate-lookup.vue @@ -26,24 +26,21 @@
@@ -107,18 +104,6 @@ export default { // Call the "next" function to complete the transition to this page. next((vm) => { vm.setCmsContent(resultMap.cmsContent); - vm.noServiceZipWidget = { - headline: resultMap.cmsContent.NoServiceZipWidget.HeadlineText, - copy: resultMap.cmsContent.NoServiceZipWidget.BodyText, - }; - vm.noMatchAlertWidget = { - headline: resultMap.cmsContent.NoMatchAlertWidget.HeadlineText, - copy: resultMap.cmsContent.NoMatchAlertWidget.BodyText - }; - vm.matchedDifferentVehicleAlertWidget = { - headline: resultMap.cmsContent.MatchedDifferentVehicleAlertWidget.HeadlineText, - copy: resultMap.cmsContent.MatchedDifferentVehicleAlertWidget.BodyText - }; }); }, props: { diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index da252308a..b84e2fbfa 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -24,10 +24,9 @@ />
diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index d4c3e164a..25291d218 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -9,8 +9,7 @@
@@ -74,13 +73,6 @@ export default { FeatureQuestionWidget: resultMap.cmsContent.FeatureQuestionWidget, }) ); - - // Set alertData for the page alert. These use props so we don't call - // initializeComponent here. - vm.alertWidgetData = { - copy: resultMap.cmsContent.AlertWidget.BodyText, - headline: resultMap.cmsContent.AlertWidget.HeadlineText, - }; }); }, data() { diff --git a/src/ux-components/alert/alert.spec.js b/src/ux-components/alert/alert.spec.js index be6dc8df7..8072f8d73 100644 --- a/src/ux-components/alert/alert.spec.js +++ b/src/ux-components/alert/alert.spec.js @@ -3,28 +3,40 @@ import alert from "./alert"; describe("alert.vue", () => { - it("Should set isMultiParagraph to true if alertCopy is an array of strings", async () => { + it("Should add class 'alert-dismissible' if isDismissible is true", async () => { // Arrange const wrapper = shallowMount(alert, { propsData: { - alertCopy: ["one", "two"] + isDismissible: true }, + mixins: [mockMixin] }); + const wrapperDiv = wrapper.find('div'); + // Assert - expect(wrapper.vm.isMultiParagraph).toBe(true); + expect(wrapperDiv.classes()).toContain('alert-dismissible') }); - it("Should set isMultiParagraph to false if alertCopy is a single string", async () => { + it("Should add specified alert class", async () => { // Arrange const wrapper = shallowMount(alert, { propsData: { - alertCopy: "three" + alertClass: 'warning' }, + mixins: [mockMixin] }); + const wrapperDiv = wrapper.find('div'); + // Assert - expect(wrapper.vm.isMultiParagraph).toBe(false); + expect(wrapperDiv.classes()).toContain('warning') }); }); + +const mockMixin = { + methods: { + getCmsContent: jest.fn() + } +} \ No newline at end of file diff --git a/src/ux-components/alert/alert.vue b/src/ux-components/alert/alert.vue index 5b27f385a..9b76789f1 100644 --- a/src/ux-components/alert/alert.vue +++ b/src/ux-components/alert/alert.vue @@ -5,12 +5,7 @@ :class="[isDismissible ? 'alert-dismissible' : '', this.alertClass]" >

{{ alertHeadline }}

- -

- {{ para }} -

- -

{{ alertCopy }}

+

{{ alertCopy }}