From 140f94913ee62c2342e011c92b3e21c754d1fcba Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Tue, 7 Feb 2023 15:48:22 -0500
Subject: [PATCH 01/19] build molding-questions page

---
 .../molding-questions/molding-questions.vue   | 199 +++++++++++++-----
 src/store/index.js                            |  28 +++
 2 files changed, 175 insertions(+), 52 deletions(-)

diff --git a/src/layouts/molding-questions/molding-questions.vue b/src/layouts/molding-questions/molding-questions.vue
index bdf3e956..23f1c519 100644
--- a/src/layouts/molding-questions/molding-questions.vue
+++ b/src/layouts/molding-questions/molding-questions.vue
@@ -2,66 +2,53 @@
   <Form
     @submit="onSubmit"
     @invalidSubmit="onInvalidSubmit"
+    ref="theForm"
     v-slot="{ meta }"
   >
-    <div class="page-container-grouped-styles overflow-auto">
-      <siteHeader
-        cmsWidgetName="SiteHeaderWidget"
-      />
-      <vehicleBanner
-        cmsWidgetName="VehicleBannerWidget"
-        :displayGenericVehicleImage="false"
-      />
-      <siteSubHeader
-        cmsWidgetName="SiteSubHeaderWidget"
-      />
-      <div class="fade-on-route-transition sub-container make-tall mt-5">
-        <p>Placeholder for molding-questions page</p>
-
-        <siteFooter
-          cmsWidgetName="SiteFooterWidget"
-          :isForwardActionDisabled="!meta.valid"
-          @backClicked="backButtonAction"
-          @forwardClicked="forwardButtonAction"
-          ref="siteFooter"
-        />
-      </div>
-    </div>
+    <questionsPageLayout
+      isRequired
+      ref="questionsPageLayout"
+      :isMetaValid="meta.valid"
+      :alertFewMoreQuestionsHeader="AlertFewMoreQuestionsHeader"
+      :alertFewMoreQuestionsCopy="AlertFewMoreQuestionsCopy"
+      :questionsData="questionsData"
+      validationRules="questions-required"
+      v-model="selectedAnswers"
+      @forwardButtonAction="forwardButtonAction"
+      @back-click="navigateBack"
+      :index="currentGlassIndex"
+      id="molding-question-wrapper"
+    />
   </Form>
 </template>
 <script>
 // Import Supporting Files
-import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
-import { settleAllPromises } from '@/helpers/layout-helper';
+import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
+import { settleAllPromises } from "@/helpers/layout-helper";
+import { defineRule } from "vee-validate";
+import { required } from "@/helpers/validation-rules";
+import { errorMessages } from "@/constants/error-messages";
+import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
+import { useMainStore } from "@/store";
+import { issPageValues } from "@/router/router-constants/issPage-values";
 
 // Import Component
-import baseFormMixin from '@/mixins/base-form-mixin';
-import { Form } from 'vee-validate';
-import siteFooter from '@/iss-components/site-footer/site-footer.vue';
-import siteHeader from '@/iss-components/site-header/site-header.vue';
-import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
-import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
+import { Form } from "vee-validate";
+import questionsPageLayout from "@/iss-components/questions-page-layout/questions-page-layout.vue";
+
+// DEFINE VALIDATION RULES
+defineRule("questions-required", required(errorMessages.OPTION_REQUIRED));
 
 export default {
-  name: 'molding-questions',
-  mixins: [baseFormMixin],
-  components: {
-    siteFooter,
-    siteHeader,
-    siteSubHeader,
-    Form,
-    vehicleBanner,    
-  },  
-  data() {
-    return {};
-  },  
+  name: "molding-questions",
+  mixins: [vehicleQuestionsMixin],
   async beforeRouteEnter(to, from, next) {
     const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
 
     // Settle promises and get results
     const promiseResultMap = [
       {
-        resultKey: 'cmsContent',
+        resultKey: "cmsContent",
         promise: cmsContentPromise,
       },
     ];
@@ -72,18 +59,126 @@ export default {
       vm.setCmsContent(resultMap.cmsContent);
     });
   },
+  data() {
+    return {
+      questionsData: [],
+      selectedAnswers: {},
+      currentGlassIndex: 0,
+    };
+  },
+  computed: {
+    AlertFewMoreQuestionsHeader() {
+      return this.getCmsContent(
+        "AdditionalPartsQuestionsAlert",
+        "HeadlineText"
+      );
+    },
+    AlertFewMoreQuestionsCopy() {
+      return this.getCmsContent("AdditionalPartsQuestionsAlert", "BodyText");
+    },
+    partsOrQuestionsData() {
+      return useMainStore().pageData(issPageValues.MOLDING_QUESTIONS)
+        .partsOrQuestions;
+    },
+  },
+  mounted() {
+    this.getInitialQuestionData();
+  },
   methods: {
     arePagePrerequisiteValid() {
-      return true;
+      const moldingQuestionsFromPageData = useMainStore().getters.pageData(
+        issPageValues.MOLDING_QUESTIONS
+      );
+      return (
+        // has childPartQuestions array and has glassName not null
+        moldingQuestionsFromPageData?.partsOrQuestions?.some(
+          (part) => part?.glassName
+        ) &&
+        moldingQuestionsFromPageData.partsOrQuestions.some((glass) =>
+          glass.parts?.some((part) => part?.childPartQuestions?.length > 0)
+        )
+      );
     },
-    backButtonAction() {
-      /**
-       * this.navigationScenarios comes from base-mixin
-       */
-      this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
+    getInitialQuestionData() {
+      // get any questions that were already answered
+      const alreadyAnsweredQuestions =
+        useMainStore().order.damage.moldingQuestionAnswers;
+      this.questionsData = this.partsOrQuestionsData
+        .filter((x) => x.parts[0].childPartQuestions.length)
+        .map((glass, index) => {
+          // NOTE: questions for property "questions" can differ between layouts
+          glass.questions = glass.parts[0].childPartQuestions;
+          glass.answerKey = glass.glassLocation + "-" + glass.glassName;
+          // reset selectedAnswers for this glass
+          this.selectedAnswers[glass.answerKey] = [];
+          const updatedGlass = this.setupInitialData(
+            glass,
+            index,
+            alreadyAnsweredQuestions
+          );
+          // Set up watch for each set of glass questions
+          this.$watch(
+            "selectedAnswers." + glass.answerKey,
+            (newValue) => {
+              if (newValue && Object.keys(newValue).length > 0) {
+                this.handleCompletedQuestionChainAnswers(
+                  newValue,
+                  glass.answerKey
+                );
+              }
+            },
+            { deep: true }
+          );
+          return updatedGlass;
+        });
     },
-    async forwardButtonAction() {},    
-    resetDependentState() {},
+    async forwardButtonAction() {
+            const questionAnswersArray = this.questionsData.map((glass) => {
+                return {
+                    glassLocation: glass.glassLocation,
+                    glassName: glass.glassName,
+                    partNum: glass.answerData.answerResult,
+                    answeredQuestions: glass.answerData.answeredQuestions,
+                    isSuppressedPart: glass.isSuppressedPart,
+                };
+            });
+            // clear out answerData for future page loads; must occur prior to store save
+            this.questionsData.forEach((glass) => {
+                glass.answerData = {};
+            });
+            // save to store as order.damage.moldingQuestionArrays (array)
+            await useMainStore().saveMoldingQuestionAnswers(questionAnswersArray);
+            
+            // get parts from the questionAnswers
+            let partsOrQuestions = this.partsOrQuestionsData;
+            for (let answer of questionAnswersArray) {
+                partsOrQuestions.find((partOrQuestion) => {
+                    return (
+                        partOrQuestion.glassLocation === answer.glassLocation &&
+                        partOrQuestion.glassName === answer.glassName
+                    );
+                }).parts[0].childParts = [
+                    {
+                        partNumber: answer.partNum,
+                    },
+                ];
+            }
+            this.navigateForward(partsOrQuestions);
+    },
+  },
+  components: {
+    Form,
+    questionsPageLayout,
   },
 };
 </script>
+
+<style lang="scss">
+#molding-question-wrapper p.text-body.small {
+  margin-bottom: 0 !important; // Overrides extra margin-bottom on alert body text
+}
+
+#molding-question-wrapper .form-test-error {
+  margin-top: 0 !important; // Overrides extra margin-top on error message text
+}
+</style>
\ No newline at end of file
diff --git a/src/store/index.js b/src/store/index.js
index abb22d83..d664f46b 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -701,6 +701,34 @@ export const useMainStore = defineStore({
         //Save new values
         this.updatePartQuestionAnswers(partQuestionAnswersArray);
       },
+      saveMoldingQuestionAnswers(moldingQuestionAnswers) {
+        const sortedPreviousResultsArray = sortArrayOfObjectsByPropertyValue(
+          this.getters.damage.moldingQuestionAnswers, 
+          "partNum"
+        );
+        const sortedMoldingQuestionAnswersArray = sortArrayOfObjectsByPropertyValue(
+          moldingQuestionAnswers, 
+          "partNum"
+        );
+        const haveMoldingQuestionAnswersChanged = 
+          sortedPreviousResultsArray?.length !== sortedMoldingQuestionAnswersArray.length ||
+          !sortedPreviousResultsArray?.every(
+            (x, i) => x.partNum === sortedMoldingQuestionAnswersArray[i].partNum
+          );
+        
+        if (haveMoldingQuestionAnswersChanged) {
+          this.updateGlassParts(null);
+          this.updateSupportingItems(null);
+          this.updateCapabilityQuestionAnswers(null);
+          this.updatePageData({
+            page: issPageValues.CAPABILITY_QUESTIONS,
+            data: null,
+          });
+        }
+
+        // Save new values
+        this.updateMoldingQuestionAnswers(moldingQuestionAnswers);
+      },
      
       addEventToBus (event) {
         this.applicationUser.eventBus.push(event);

From ec8731f9a348b52c5a84216902915870f0986bb6 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Wed, 8 Feb 2023 15:40:46 -0500
Subject: [PATCH 02/19] navigation for molding-questions

---
 .../molding-questions/molding-questions.vue        | 10 +++++-----
 src/router/router-constants/routing-table.js       |  2 +-
 src/store/index.js                                 | 14 +++++++-------
 3 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/layouts/molding-questions/molding-questions.vue b/src/layouts/molding-questions/molding-questions.vue
index 23f1c519..44b4cd38 100644
--- a/src/layouts/molding-questions/molding-questions.vue
+++ b/src/layouts/molding-questions/molding-questions.vue
@@ -86,7 +86,7 @@ export default {
   },
   methods: {
     arePagePrerequisiteValid() {
-      const moldingQuestionsFromPageData = useMainStore().getters.pageData(
+      const moldingQuestionsFromPageData = useMainStore().pageData(
         issPageValues.MOLDING_QUESTIONS
       );
       return (
@@ -102,7 +102,7 @@ export default {
     getInitialQuestionData() {
       // get any questions that were already answered
       const alreadyAnsweredQuestions =
-        useMainStore().order.damage.moldingQuestionAnswers;
+        useMainStore().damage.moldingQuestionAnswers;
       this.questionsData = this.partsOrQuestionsData
         .filter((x) => x.parts[0].childPartQuestions.length)
         .map((glass, index) => {
@@ -121,7 +121,7 @@ export default {
             "selectedAnswers." + glass.answerKey,
             (newValue) => {
               if (newValue && Object.keys(newValue).length > 0) {
-                this.handleCompletedQuestionChainAnswers(
+                this.handleAnswerUpdates(
                   newValue,
                   glass.answerKey
                 );
@@ -147,7 +147,7 @@ export default {
                 glass.answerData = {};
             });
             // save to store as order.damage.moldingQuestionArrays (array)
-            await useMainStore().saveMoldingQuestionAnswers(questionAnswersArray);
+            await this.mainStore.saveMoldingQuestionAnswers(questionAnswersArray);
             
             // get parts from the questionAnswers
             let partsOrQuestions = this.partsOrQuestionsData;
@@ -163,7 +163,7 @@ export default {
                     },
                 ];
             }
-            this.navigateForward(partsOrQuestions);
+            this.navigateForward(partsOrQuestions, null);
     },
   },
   components: {
diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js
index 95179d81..78dbb55a 100644
--- a/src/router/router-constants/routing-table.js
+++ b/src/router/router-constants/routing-table.js
@@ -235,7 +235,7 @@ const routingTable = function(store) {
           },
           {
               scenario: navigationScenarios.CLICKED_BACK_WITH_NO_VIN_NOR_QUESTIONS,
-              destinationIssPageValue: issPageValues.ESTIMATE,
+              destinationIssPageValue: issPageValues.VEHICLE_LOOKUP,
           },
           {
               scenario: navigationScenarios.CLICKED_BACK_WITH_PART_QUESTIONS,
diff --git a/src/store/index.js b/src/store/index.js
index d664f46b..db172dde 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -701,19 +701,19 @@ export const useMainStore = defineStore({
         //Save new values
         this.updatePartQuestionAnswers(partQuestionAnswersArray);
       },
-      saveMoldingQuestionAnswers(moldingQuestionAnswers) {
+      saveMoldingQuestionAnswers(moldingQuestionAnswersArray) {
         const sortedPreviousResultsArray = sortArrayOfObjectsByPropertyValue(
-          this.getters.damage.moldingQuestionAnswers, 
-          "partNum"
+          this.order.damage.moldingQuestionAnswers, 
+          "result"
         );
         const sortedMoldingQuestionAnswersArray = sortArrayOfObjectsByPropertyValue(
-          moldingQuestionAnswers, 
-          "partNum"
+          moldingQuestionAnswersArray, 
+          "result"
         );
         const haveMoldingQuestionAnswersChanged = 
           sortedPreviousResultsArray?.length !== sortedMoldingQuestionAnswersArray.length ||
           !sortedPreviousResultsArray?.every(
-            (x, i) => x.partNum === sortedMoldingQuestionAnswersArray[i].partNum
+            (x, i) => x.result === sortedMoldingQuestionAnswersArray[i].result
           );
         
         if (haveMoldingQuestionAnswersChanged) {
@@ -727,7 +727,7 @@ export const useMainStore = defineStore({
         }
 
         // Save new values
-        this.updateMoldingQuestionAnswers(moldingQuestionAnswers);
+        this.updateMoldingQuestionAnswers(moldingQuestionAnswersArray);
       },
      
       addEventToBus (event) {

From d54694ebaf9a9b7056c64e9d2dfb38d618e31d15 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Thu, 9 Feb 2023 11:53:23 -0500
Subject: [PATCH 03/19] change to getPartsOrQuestions method - zip code can be
 empty string

---
 src/store/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/store/index.js b/src/store/index.js
index abb22d83..1cd57344 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -341,7 +341,7 @@ export const useMainStore = defineStore({
             payload: {
                 carId: carId,
                 glassPieces: glassArrayForPayload,
-                zip: zipCode,
+                zip: zipCode ? zipCode : "",
                 vin: vin,
             },
         });

From 4f31b1c8f06cae3b1a90c19524d4564023ed4318 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Thu, 9 Feb 2023 15:02:16 -0500
Subject: [PATCH 04/19] Reverting change for SSR-257 - zipCode will either pull
 registration.zip or customer.address.zip

---
 src/store/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/store/index.js b/src/store/index.js
index b08671f5..db172dde 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -341,7 +341,7 @@ export const useMainStore = defineStore({
             payload: {
                 carId: carId,
                 glassPieces: glassArrayForPayload,
-                zip: zipCode ? zipCode : "",
+                zip: zipCode,
                 vin: vin,
             },
         });

From 3686e4907dbba94661ea119ab98f11aac44fa72c Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Thu, 9 Feb 2023 15:02:47 -0500
Subject: [PATCH 05/19] fix to navigation from molding-questions

---
 src/layouts/molding-questions/molding-questions.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/layouts/molding-questions/molding-questions.vue b/src/layouts/molding-questions/molding-questions.vue
index 44b4cd38..e3c6c13e 100644
--- a/src/layouts/molding-questions/molding-questions.vue
+++ b/src/layouts/molding-questions/molding-questions.vue
@@ -31,6 +31,7 @@ import { errorMessages } from "@/constants/error-messages";
 import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
 import { useMainStore } from "@/store";
 import { issPageValues } from "@/router/router-constants/issPage-values";
+import BaseFormMixin from '@/mixins/base-form-mixin.js';
 
 // Import Component
 import { Form } from "vee-validate";
@@ -41,7 +42,7 @@ defineRule("questions-required", required(errorMessages.OPTION_REQUIRED));
 
 export default {
   name: "molding-questions",
-  mixins: [vehicleQuestionsMixin],
+  mixins: [BaseFormMixin, vehicleQuestionsMixin],
   async beforeRouteEnter(to, from, next) {
     const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
 
@@ -163,6 +164,7 @@ export default {
                     },
                 ];
             }
+
             this.navigateForward(partsOrQuestions, null);
     },
   },

From a7e3c8b66905ddcaf3ae1d40008e2ece4d396bf7 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Thu, 9 Feb 2023 15:03:11 -0500
Subject: [PATCH 06/19] start of unit tests for molding-questions

---
 .../molding-questions.spec.js                 | 331 ++++++++++++++++++
 1 file changed, 331 insertions(+)
 create mode 100644 src/layouts/molding-questions/molding-questions.spec.js

diff --git a/src/layouts/molding-questions/molding-questions.spec.js b/src/layouts/molding-questions/molding-questions.spec.js
new file mode 100644
index 00000000..ba3d5438
--- /dev/null
+++ b/src/layouts/molding-questions/molding-questions.spec.js
@@ -0,0 +1,331 @@
+// Components
+import moldingQuestions from "@/layouts/molding-questions/molding-questions";
+
+// Supporting Files
+import { shallowMount } from "@vue/test-utils";
+import { getMountOptions } from "@/helpers/unit-test-helper.js";
+import { useMainStore } from "@/store";
+import baseMixin from "../../mixins/base-mixin";
+import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
+import { nextTick } from "vue";
+
+// Mock our module for promises.
+jest.mock("@/helpers/layout-helper.js", () => ({
+    settleAllPromises: jest.fn(),
+}));
+
+// Mock fetchCmsContentForPage
+jest.mock("@/helpers/cms-content-helper", () => ({
+    fetchCmsContentForPage: jest.fn(),
+}));
+
+const baseStoreGettersPageData = () => {
+    return {
+        partsOrQuestions: [
+            {
+                parts: [
+                    {
+                        childPartQuestions: [
+                            {
+                                questionSequence: 1,
+                                questionText:
+                                    "Does the rubber seal around your windshield have a chrome strip running through it?",
+                                answers: [
+                                    {
+                                        answerResult: "WKT D1106 C",
+                                        answerText: "Yes",
+                                        nextQuestionSequence: null,
+                                    },
+                                    {
+                                        answerResult: "WKT D1106 B",
+                                        answerText: "No",
+                                        nextQuestionSequence: null,
+                                    },
+                                ],
+                            },
+                        ],
+                        basePartNumber: "DW01105",
+                        color: "Green Tint, Blue Shade",
+                        requiresRecalibration: false,
+                        recalibrationType: "",
+                        canSafeliteRecalibrate: false,
+                        requiresCapabilityQuestions: false,
+                        childParts: null,
+                        partNumber: "DW01105GBNN",
+                        description: "solar",
+                        partType: "WINDSHIELD",
+                    },
+                ],
+                partQuestions: [],
+                glassLocation: "Windshield",
+                glassName: "Single",
+                answerKey: "Windshield-Single",
+                answerData: null,
+            },
+        ],
+    };
+};
+const baseStoreGettersDamage = () => {
+    return {
+        partsQuestionAnswers: [
+            {
+                glassLocation: "Windshield",
+                glassName: "Single",
+                result: "FW04848",
+                answeredQuestions: [
+                    {
+                        questionText:
+                            "Is your vehicle equipped with the Panoramic Sunroof which can be identified by having a glass panel over the rear seats?",
+                        selectedAnswer: "1|nextQuestion|3|Yes",
+                        selectedAnswerText: "Yes",
+                        questionNum: 1,
+                    },
+                    {
+                        questionText:
+                            "Is your vehicle equipped with a heated windshield that melts snow and ice from underneath the windshield wiper blades?",
+                        selectedAnswer: "2|nextQuestion|3|Yes",
+                        selectedAnswerText: "Yes",
+                        questionNum: 2,
+                    },
+                ],
+            },
+        ],
+    };
+};
+
+useMainStore().pageData = baseStoreGettersDamage;
+useMainStore().damage = baseStoreGettersDamage;
+
+describe("moldingQuestions.vue", () => {
+    describe("method arePagePrerequisitesValid...", () => {
+        test("Should return true for valid page requisites if pageData exists", () => {
+            // Arrange
+            const { wrapper } = setupMocks({});
+
+            // Act
+            const result = wrapper.vm.arePagePrerequisitesValid();
+
+            //Assert
+            expect(result).toBe(true);
+
+            wrapper.unmount();
+        });
+
+        test("Should return false for valid page requisites if partsOrQuestions in pageData is missing", () => {
+            // Arrange
+            const { wrapper } = setupMocks({});
+            store.getters.pageData = jest.fn(() => {
+                return undefined;
+            });
+
+            // Act
+            const result = wrapper.vm.arePagePrerequisitesValid();
+
+            //Assert
+            expect(result).toBeFalsy();
+
+            wrapper.unmount();
+        });
+
+        test("Should be at least one item in partsOrQuestions", () => {
+            // Arrange
+            store.getters = {
+                pageData: jest.fn(() => {
+                    return {
+                        partsOrQuestions: [],
+                    };
+                }),
+                damage: baseStoreGettersDamage,
+            };
+            const { wrapper } = setupMocks({});
+
+            // Act
+            const result = wrapper.vm.arePagePrerequisitesValid();
+
+            //Assert
+            expect(result).toBeFalsy();
+
+            wrapper.unmount();
+        });
+    });
+
+    describe("watch on selectedAnswers should be set up...", () => {
+        test("Should trigger handleCompletedQuestionChainAnswers if watched data changes", async () => {
+            // Arrange
+            const { wrapper } = setupMocks({});
+            const spy = jest.spyOn(wrapper.vm, "handleCompletedQuestionChainAnswers");
+
+            // Act
+            wrapper.setData({
+                selectedAnswers: {
+                    "Windshield-Single": {
+                        answerResult: "FW04848",
+                        answeredQuestions: [
+                            {
+                                questionText:
+                                    "Is your vehicle equipped with the Panoramic Sunroof which can be identified by having a glass panel over the rear seats?",
+                                selectedAnswer: "1|nextQuestion|3|Yes",
+                                selectedAnswerText: "Yes",
+                                questionNum: 1,
+                            },
+                            {
+                                questionText:
+                                    "Is your vehicle equipped with a heated windshield that melts snow and ice from underneath the windshield wiper blades?",
+                                selectedAnswer: "2|nextQuestion|3|Yes",
+                                selectedAnswerText: "Yes",
+                                questionNum: 2,
+                            },
+                        ],
+                        index: 0,
+                    },
+                },
+            });
+
+            await nextTick();
+
+            //Assert
+            expect(spy).toHaveBeenCalled();
+
+            wrapper.unmount();
+        });
+    });
+
+//     describe("forwardButtonAction", () => {
+//         test("Should clear out answerData", () => {
+//             // Arrange
+//             const { wrapper } = setupMocks({});
+
+//             wrapper.vm.questionsData = [
+//                 {
+//                     glassLocation: "Windshield",
+//                     glassName: "Single",
+//                     answerData: {
+//                         answerResult: "FW04848",
+//                         answeredQuestions: [],
+//                     },
+//                 },
+//             ];
+//             wrapper.vm.dispatchStoreAction = jest.fn(() => {
+//                 return {
+//                     data: {
+//                         glassPieceParts: [],
+//                     },
+//                 };
+//             });
+
+//             // Act
+//             wrapper.vm.forwardButtonAction();
+
+//             //Assert
+//             expect(wrapper.vm.questionsData[0].answerData).toEqual({});
+
+//             wrapper.unmount();
+//         });
+
+//         test("Should save to Vuex store", async () => {
+//             // Arrange
+//             const { wrapper } = setupMocks({});
+
+//             wrapper.vm.questionsData = [
+//                 {
+//                     glassLocation: "Windshield",
+//                     glassName: "Single",
+//                     answerData: {
+//                         answerResult: "FW04848",
+//                         answeredQuestions: [],
+//                     },
+//                 },
+//             ];
+//             wrapper.vm.dispatchStoreAction = jest.fn(() => {
+//                 return {
+//                     data: {
+//                         glassPieceParts: [],
+//                     },
+//                 };
+//             });
+//             const spy = jest.spyOn(wrapper.vm, "dispatchStoreAction");
+
+//             // Act
+//             wrapper.vm.forwardButtonAction();
+
+//             await nextTick();
+
+//             //Assert
+//             expect(spy).toHaveBeenNthCalledWith(
+//                 1,
+//                 "saveMoldingQuestionAnswers",
+//                 [
+//                     {
+//                         answeredQuestions: [],
+//                         glassLocation: "Windshield",
+//                         glassName: "Single",
+//                         isSuppressedPart: undefined,
+//                         partNum: "FW04848",
+//                     },
+//                 ],
+//                 false
+//             );
+
+//             wrapper.unmount();
+//         });
+
+//         test("Should trigger navigateForward", async () => {
+//             // Arrange
+//             const { wrapper } = setupMocks({});
+
+//             wrapper.vm.questionsData = [
+//                 {
+//                     glassLocation: "Windshield",
+//                     glassName: "Single",
+//                     answerData: {
+//                         answerResult: "FW04848",
+//                         answeredQuestions: [],
+//                     },
+//                 },
+//             ];
+//             wrapper.vm.dispatchStoreAction = jest.fn(() => {
+//                 return {
+//                     data: {
+//                         glassPieceParts: [],
+//                     },
+//                 };
+//             });
+//             wrapper.vm.navigateForward = jest.fn();
+
+//             // Act
+//             await wrapper.vm.forwardButtonAction();
+
+//             //Assert
+//             expect(wrapper.vm.navigateForward).toHaveBeenCalled();
+
+//             wrapper.unmount();
+//         });
+//     });
+    });
+
+function setupMocks({
+    mountOptionsMockData = {
+        router: {
+            navigate: jest.fn(),
+        },
+        store: {
+            getters: store.getters,
+            commit: store.commit,
+        },
+        route: {
+            query: {
+                issPage: "molding-questions",
+            },
+        },
+    },
+}) {
+    const mountOptions = getMountOptions({
+        ...mountOptionsMockData,
+        mixins: [baseMixin, vehicleQuestionsMixin],
+    });
+    mountOptions["attachTo"] = document.body;
+
+    const wrapper = shallowMount(moldingQuestions, mountOptions);
+
+    return { wrapper };
+}
\ No newline at end of file

From e9bcab540239e5978a505ec6919ac9dba2a32f6c Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Thu, 9 Feb 2023 16:49:08 -0500
Subject: [PATCH 07/19] typo fix

---
 src/layouts/molding-questions/molding-questions.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/molding-questions/molding-questions.vue b/src/layouts/molding-questions/molding-questions.vue
index e3c6c13e..e06dfe58 100644
--- a/src/layouts/molding-questions/molding-questions.vue
+++ b/src/layouts/molding-questions/molding-questions.vue
@@ -86,7 +86,7 @@ export default {
     this.getInitialQuestionData();
   },
   methods: {
-    arePagePrerequisiteValid() {
+    arePagePrerequisitesValid() {
       const moldingQuestionsFromPageData = useMainStore().pageData(
         issPageValues.MOLDING_QUESTIONS
       );

From 9a536d2886c8b3a506ffc1e46d10788675e65cb0 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Thu, 9 Feb 2023 16:49:29 -0500
Subject: [PATCH 08/19] completed unit tests for molding-questions

---
 .../molding-questions.spec.js                 | 281 +++++++++++-------
 1 file changed, 169 insertions(+), 112 deletions(-)

diff --git a/src/layouts/molding-questions/molding-questions.spec.js b/src/layouts/molding-questions/molding-questions.spec.js
index ba3d5438..ee5a11b1 100644
--- a/src/layouts/molding-questions/molding-questions.spec.js
+++ b/src/layouts/molding-questions/molding-questions.spec.js
@@ -93,7 +93,7 @@ const baseStoreGettersDamage = () => {
     };
 };
 
-useMainStore().pageData = baseStoreGettersDamage;
+useMainStore().pageData = baseStoreGettersPageData;
 useMainStore().damage = baseStoreGettersDamage;
 
 describe("moldingQuestions.vue", () => {
@@ -114,7 +114,7 @@ describe("moldingQuestions.vue", () => {
         test("Should return false for valid page requisites if partsOrQuestions in pageData is missing", () => {
             // Arrange
             const { wrapper } = setupMocks({});
-            store.getters.pageData = jest.fn(() => {
+            useMainStore().pageData = jest.fn(() => {
                 return undefined;
             });
 
@@ -129,14 +129,13 @@ describe("moldingQuestions.vue", () => {
 
         test("Should be at least one item in partsOrQuestions", () => {
             // Arrange
-            store.getters = {
-                pageData: jest.fn(() => {
-                    return {
-                        partsOrQuestions: [],
-                    };
-                }),
-                damage: baseStoreGettersDamage,
-            };
+            useMainStore().pageData = jest.fn(() => {
+                return {
+                    partsOrQuestions: [],
+                };
+            });
+            useMainStore().damage = baseStoreGettersDamage;
+
             const { wrapper } = setupMocks({});
 
             // Act
@@ -150,10 +149,13 @@ describe("moldingQuestions.vue", () => {
     });
 
     describe("watch on selectedAnswers should be set up...", () => {
-        test("Should trigger handleCompletedQuestionChainAnswers if watched data changes", async () => {
+        test("Should trigger handleAnswerUpdates if watched data changes", async () => {
             // Arrange
+            useMainStore().pageData = baseStoreGettersPageData;
+            useMainStore().damage = baseStoreGettersDamage;
+
             const { wrapper } = setupMocks({});
-            const spy = jest.spyOn(wrapper.vm, "handleCompletedQuestionChainAnswers");
+            const spy = jest.spyOn(wrapper.vm, "handleAnswerUpdates");
 
             // Act
             wrapper.setData({
@@ -190,135 +192,190 @@ describe("moldingQuestions.vue", () => {
         });
     });
 
-//     describe("forwardButtonAction", () => {
-//         test("Should clear out answerData", () => {
-//             // Arrange
-//             const { wrapper } = setupMocks({});
+    describe("forwardButtonAction", () => {
+        test("Should clear out answerData", () => {
+            // Arrange
+            const { wrapper } = setupMocks({});
 
-//             wrapper.vm.questionsData = [
-//                 {
-//                     glassLocation: "Windshield",
-//                     glassName: "Single",
-//                     answerData: {
-//                         answerResult: "FW04848",
-//                         answeredQuestions: [],
-//                     },
-//                 },
-//             ];
-//             wrapper.vm.dispatchStoreAction = jest.fn(() => {
-//                 return {
-//                     data: {
-//                         glassPieceParts: [],
-//                     },
-//                 };
-//             });
+            wrapper.vm.questionsData = [
+                {
+                    glassLocation: "Windshield",
+                    glassName: "Single",
+                    answerData: {
+                        answerResult: "FW04848",
+                        answeredQuestions: [],
+                    },
+                },
+            ];
+            wrapper.vm.dispatchStoreAction = jest.fn(() => {
+                return {
+                    data: {
+                        partsOrQuestions: [],
+                    },
+                };
+            });
 
-//             // Act
-//             wrapper.vm.forwardButtonAction();
+            // Act
+            wrapper.vm.forwardButtonAction();
 
-//             //Assert
-//             expect(wrapper.vm.questionsData[0].answerData).toEqual({});
+            //Assert
+            expect(wrapper.vm.questionsData[0].answerData).toEqual({});
 
-//             wrapper.unmount();
-//         });
+            wrapper.unmount();
+        });
 
-//         test("Should save to Vuex store", async () => {
-//             // Arrange
-//             const { wrapper } = setupMocks({});
+        test("Should save to pinia store", async () => {
+            // Arrange
+            const { wrapper } = setupMocks({});
 
-//             wrapper.vm.questionsData = [
-//                 {
-//                     glassLocation: "Windshield",
-//                     glassName: "Single",
-//                     answerData: {
-//                         answerResult: "FW04848",
-//                         answeredQuestions: [],
-//                     },
-//                 },
-//             ];
-//             wrapper.vm.dispatchStoreAction = jest.fn(() => {
-//                 return {
-//                     data: {
-//                         glassPieceParts: [],
-//                     },
-//                 };
-//             });
-//             const spy = jest.spyOn(wrapper.vm, "dispatchStoreAction");
+            wrapper.vm.questionsData = [
+                {
+                    glassLocation: "Windshield",
+                    glassName: "Single",
+                    answerData: {
+                        answerResult: "FW04848",
+                        answeredQuestions: [],
+                    },
+                },
+            ];
+            useMainStore().getPartsOrQuestions = jest.fn(() => {
+                return {
+                    data: {
+                        partsOrQuestions: [],
+                    },
+                };
+            });
 
-//             // Act
-//             wrapper.vm.forwardButtonAction();
+            // Act
+            wrapper.vm.forwardButtonAction();
 
-//             await nextTick();
+            await nextTick();
 
-//             //Assert
-//             expect(spy).toHaveBeenNthCalledWith(
-//                 1,
-//                 "saveMoldingQuestionAnswers",
-//                 [
-//                     {
-//                         answeredQuestions: [],
-//                         glassLocation: "Windshield",
-//                         glassName: "Single",
-//                         isSuppressedPart: undefined,
-//                         partNum: "FW04848",
-//                     },
-//                 ],
-//                 false
-//             );
+            //Assert
+            expect(wrapper.vm.saveMoldingQuestionAnswers).toHaveBeenCalled;
+            wrapper.unmount();
+        });
 
-//             wrapper.unmount();
-//         });
+        test("Should call GET_PARTS_OR_QUESTIONS API", async () => {
+            // Arrange
+            const { wrapper } = setupMocks({});
 
-//         test("Should trigger navigateForward", async () => {
-//             // Arrange
-//             const { wrapper } = setupMocks({});
+            wrapper.vm.questionsData = [
+                {
+                    glassLocation: "Windshield",
+                    glassName: "Single",
+                    answerData: {
+                        answerResult: "FW04848",
+                        answeredQuestions: [],
+                    },
+                },
+            ];
+            useMainStore().getPartsOrQuestions = jest.fn(() => {
+                return {
+                    data: {
+                        partsOrQuestions: [],
+                    },
+                };
+            });
 
-//             wrapper.vm.questionsData = [
-//                 {
-//                     glassLocation: "Windshield",
-//                     glassName: "Single",
-//                     answerData: {
-//                         answerResult: "FW04848",
-//                         answeredQuestions: [],
-//                     },
-//                 },
-//             ];
-//             wrapper.vm.dispatchStoreAction = jest.fn(() => {
-//                 return {
-//                     data: {
-//                         glassPieceParts: [],
-//                     },
-//                 };
-//             });
-//             wrapper.vm.navigateForward = jest.fn();
+            // Act
+            wrapper.vm.forwardButtonAction();
 
-//             // Act
-//             await wrapper.vm.forwardButtonAction();
+            await nextTick();
 
-//             //Assert
-//             expect(wrapper.vm.navigateForward).toHaveBeenCalled();
+            //Assert
+            expect(wrapper.vm.getPartsOrQuestions).toHaveBeenCalled;
 
-//             wrapper.unmount();
-//         });
-//     });
+            wrapper.unmount();
+        });
+
+        test("Should trigger navigateForward", async () => {
+            // Arrange
+            const { wrapper } = setupMocks({});
+
+            wrapper.vm.questionsData = [
+                {
+                    glassLocation: "Windshield",
+                    glassName: "Single",
+                    answerData: {
+                        answerResult: "FW04848",
+                        answeredQuestions: [],
+                    },
+                },
+            ];
+            useMainStore().getPartsOrQuestions = jest.fn(() => {
+                return {
+                    data: {
+                        partsOrQuestions: [],
+                    },
+                };
+            });
+            wrapper.vm.navigateForward = jest.fn();
+
+            // Act
+            await wrapper.vm.forwardButtonAction();
+
+            //Assert
+            expect(wrapper.vm.navigateForward).toHaveBeenCalled();
+
+            wrapper.unmount();
+        });
     });
+});
 
 function setupMocks({
     mountOptionsMockData = {
         router: {
             navigate: jest.fn(),
         },
-        store: {
-            getters: store.getters,
-            commit: store.commit,
-        },
+        actionList: [
+            {
+                actionName: "saveMoldingQuestionAnswers",
+                data: {},
+            },
+            {
+                actionName: "getPartsOrQuestions",
+                data: {},
+            },
+        ],
         route: {
             query: {
                 issPage: "molding-questions",
             },
         },
+        data() {
+            return {
+                computedSwitcher: [
+                    {
+                        glassLocation: "Windshield",
+                        glassName: "Single",
+                        answerData: {
+                            answerResult: "FW04848",
+                            answeredQuestions: [],
+                        },
+                    },
+                ],
+            };
+        },
+        questionsData: {
+            get() {
+                return this.computedSwitcher;
+            },
+            set(val) {
+                this.computedSwitcher = val;
+            },
+        },
     },
 }) {
+
+    useMainStore().getPartsOrQuestions = jest.fn(() => {
+        return {
+            data: {
+                partsOrQuestions: [],
+            }
+        };
+    });
+
     const mountOptions = getMountOptions({
         ...mountOptionsMockData,
         mixins: [baseMixin, vehicleQuestionsMixin],

From 89c029b41dd8bfa5195d0b258dbaac7bf21fbf17 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Mon, 13 Feb 2023 09:19:25 -0500
Subject: [PATCH 09/19] spacing fix

---
 src/layouts/policy-holder-details/policy-holder-details.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index 76702d8b..9e43261d 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -4,7 +4,7 @@
             <div class="fade-on-route-transition">
                 <siteHeader cmsWidgetName="SiteHeaderWidget"/>
                 <siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
-                <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" />
+                <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions" />
                 <div class="row mt-4">
                     <div class="col">
                         <textboxQuestion
@@ -141,4 +141,8 @@ export default {
 {
     margin-top: 20px;
 }
+
+#address-questions {
+    margin-top: 24px !important;
+}
 </style>
\ No newline at end of file

From c7f7995ad34fa85417fc3e0c74f5a1be580e8e0c Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Mon, 13 Feb 2023 10:37:47 -0500
Subject: [PATCH 10/19] policy-holder-details: styling fixes for font-size,
 line-height, and color

---
 .../policy-holder-details.vue                     | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index 9e43261d..dc98e414 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -3,8 +3,8 @@
         <div class="page-container-grouped-styles overflow-auto">
             <div class="fade-on-route-transition">
                 <siteHeader cmsWidgetName="SiteHeaderWidget"/>
-                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
-                <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions" />
+                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header"/>
+                <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions-wrapper"/>
                 <div class="row mt-4">
                     <div class="col">
                         <textboxQuestion
@@ -142,7 +142,14 @@ export default {
     margin-top: 20px;
 }
 
-#address-questions {
-    margin-top: 24px !important;
+#address-questions-wrapper {
+    margin-top: 24px;
 }
+
+#sub-header p {
+    color: #4D5151;
+    line-height: 26px;
+    font-size: 16px;
+}
+
 </style>
\ No newline at end of file

From 04b3ab2157d34605e652366ec20ce5c5cfab3c1c Mon Sep 17 00:00:00 2001
From: katie <katie.kroell@safelite.com>
Date: Mon, 13 Feb 2023 10:53:20 -0500
Subject: [PATCH 11/19] Revert "spacing fix"

This reverts commit 89c029b41dd8bfa5195d0b258dbaac7bf21fbf17.
---
 .../policy-holder-details.vue                     | 15 ++-------------
 1 file changed, 2 insertions(+), 13 deletions(-)

diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index dc98e414..76702d8b 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -3,8 +3,8 @@
         <div class="page-container-grouped-styles overflow-auto">
             <div class="fade-on-route-transition">
                 <siteHeader cmsWidgetName="SiteHeaderWidget"/>
-                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header"/>
-                <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions-wrapper"/>
+                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
+                <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" />
                 <div class="row mt-4">
                     <div class="col">
                         <textboxQuestion
@@ -141,15 +141,4 @@ export default {
 {
     margin-top: 20px;
 }
-
-#address-questions-wrapper {
-    margin-top: 24px;
-}
-
-#sub-header p {
-    color: #4D5151;
-    line-height: 26px;
-    font-size: 16px;
-}
-
 </style>
\ No newline at end of file

From d2474d059d638558b634bff80a20a2bea853ced1 Mon Sep 17 00:00:00 2001
From: katie <katie.kroell@safelite.com>
Date: Mon, 13 Feb 2023 10:58:02 -0500
Subject: [PATCH 12/19] Revert commit


From 728f7d35ac81882146e506fb3f1fb4cd223d2e87 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Mon, 13 Feb 2023 11:14:04 -0500
Subject: [PATCH 13/19] SSR-255: changes to font size, line height, and font
 color

---
 .../policy-holder-details/policy-holder-details.vue       | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index 76702d8b..79b2c584 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -3,7 +3,7 @@
         <div class="page-container-grouped-styles overflow-auto">
             <div class="fade-on-route-transition">
                 <siteHeader cmsWidgetName="SiteHeaderWidget"/>
-                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
+                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header"/>
                 <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" />
                 <div class="row mt-4">
                     <div class="col">
@@ -141,4 +141,10 @@ export default {
 {
     margin-top: 20px;
 }
+
+#sub-header p {
+    font-size: 16px;
+    line-height: 26px;
+    color: #4D5151;
+}
 </style>
\ No newline at end of file

From eb78ede3a6d47c78af8478c7fcdf2e5a56ee7622 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Mon, 13 Feb 2023 11:16:14 -0500
Subject: [PATCH 14/19] SSR-256: changes to margin-top spacing

---
 src/layouts/policy-holder-details/policy-holder-details.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index 79b2c584..564a8049 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -4,7 +4,7 @@
             <div class="fade-on-route-transition">
                 <siteHeader cmsWidgetName="SiteHeaderWidget"/>
                 <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header"/>
-                <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" />
+                <addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions-wrapper"/>
                 <div class="row mt-4">
                     <div class="col">
                         <textboxQuestion
@@ -147,4 +147,8 @@ export default {
     line-height: 26px;
     color: #4D5151;
 }
+
+#address-questions-wrapper {
+    margin-top: 24px;
+}
 </style>
\ No newline at end of file

From 0fcdbf92a2271fd92031256e12db892e48b1f484 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Mon, 13 Feb 2023 11:45:15 -0500
Subject: [PATCH 15/19] SSR-265: changes to line-height on alert

---
 src/layouts/policy-holder-details/policy-holder-details.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index 564a8049..32f0aea9 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -151,4 +151,8 @@ export default {
 #address-questions-wrapper {
     margin-top: 24px;
 }
+
+#address-questions-wrapper .alert.heading  {
+    line-height: 24px;
+}
 </style>
\ No newline at end of file

From 03e525c8e81a12176d0be1d1a041b38cee4b4470 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Mon, 13 Feb 2023 13:34:52 -0500
Subject: [PATCH 16/19] SSR-263: change to line-height on field error messages

---
 src/layouts/policy-holder-details/policy-holder-details.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index 32f0aea9..bacb5059 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -155,4 +155,8 @@ export default {
 #address-questions-wrapper .alert.heading  {
     line-height: 24px;
 }
+
+#address-questions-wrapper .form-test-error {
+    line-height: 24px;
+}
 </style>
\ No newline at end of file

From def94c927506fdba72af1fbf4f28eec7296fa844 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Mon, 13 Feb 2023 15:40:52 -0500
Subject: [PATCH 17/19] Create CSM entries and markup for coverage statement
 page.

Remove hard-coded margin-bottom from vehicleBanner and replace it at the component level.

"Recalibration" link at bottom of page is for testing only and will be removed when textLink functionality is added to the CMS.
---
 .../text-block/text-block.vue                 |  5 +-
 .../questions-page-layout.vue                 |  2 +-
 .../vehicle-banner/vehicle-banner.vue         |  6 +-
 src/layouts/address-lookup/address-lookup.vue |  9 +--
 .../address-vehicles/address-vehicles.vue     |  3 +-
 .../capability-questions.vue                  |  9 +--
 .../coverage-statement/coverage-statement.vue | 58 ++++++++++++++-----
 .../license-plate-lookup.vue                  | 17 +++---
 src/layouts/vehicle-damage/vehicle-damage.vue | 11 ++--
 src/layouts/vehicle-lookup/vehicle-lookup.vue |  1 +
 src/layouts/vehicle-make/vehicle-make.vue     | 28 ++++-----
 src/layouts/vehicle-model/vehicle-model.vue   | 21 ++++---
 src/layouts/vehicle-parts/vehicle-parts.vue   |  1 +
 src/layouts/vehicle-style/vehicle-style.vue   |  8 +--
 src/layouts/vehicle-year/vehicle-year.vue     | 33 +++++------
 src/layouts/vin-lookup/vin-lookup.vue         | 41 ++++++-------
 src/layouts/welcome-page/welcome-page.vue     |  2 +-
 src/styles/common-typography-styles.scss      |  4 +-
 18 files changed, 150 insertions(+), 109 deletions(-)

diff --git a/src/digital-components/text-block/text-block.vue b/src/digital-components/text-block/text-block.vue
index 33854e14..d042113e 100644
--- a/src/digital-components/text-block/text-block.vue
+++ b/src/digital-components/text-block/text-block.vue
@@ -1,6 +1,6 @@
 <template>
     <div
-        class="text-block w-100 mt-2"
+        class="text-block w-100"
         :class="[justifyText, typeStyle, fontWeight]"
         v-html="this.TextBlockCopy"></div>
 </template>
@@ -25,12 +25,15 @@ export default {
 <style lang="scss" scoped>
 .text-block {
     &.left {
+        display: flex;
         justify-content: flex-start;
     }
     &.right {
+        display: flex;
         justify-content: flex-end;
     }
     &.center {
+        display: flex;
         justify-content: center;
     }
     &.bold {
diff --git a/src/iss-components/questions-page-layout/questions-page-layout.vue b/src/iss-components/questions-page-layout/questions-page-layout.vue
index f8df17f8..3acf2856 100644
--- a/src/iss-components/questions-page-layout/questions-page-layout.vue
+++ b/src/iss-components/questions-page-layout/questions-page-layout.vue
@@ -2,7 +2,7 @@
     <div :class="`page-container-grouped-styles questions-page`">
         <loadingModal ref="loadingModal" />
         <siteHeader cmsWidgetName="SiteHeaderWidget" />
-        <vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="false" />
+        <vehicleBanner class="mb-3" cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="false" />
         <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
         <div class="fade-on-route-transition sub-container make-tall">
             <alert
diff --git a/src/iss-components/vehicle-banner/vehicle-banner.vue b/src/iss-components/vehicle-banner/vehicle-banner.vue
index 4ffebe12..fe0737f9 100644
--- a/src/iss-components/vehicle-banner/vehicle-banner.vue
+++ b/src/iss-components/vehicle-banner/vehicle-banner.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="vehicle_banner mb-3 text-center">
+  <div class="vehicle_banner text-center">
     <img
       class="vehicle-image img-fluid"
       :src="vehicleImageToDisplay"
@@ -21,9 +21,9 @@ export default {
   computed: {
     vehicleImageToDisplay(){
         if (this.displayGenericVehicleImage){
-          return this.genericVehicleImage;  
+          return this.genericVehicleImage;
         }
-  
+
         const imageUrl = this.mainStore.order.vehicle.imageUrl;
         if (!imageUrl || imageUrl === "NULL"){
           return this.getUnmatchedVehicleIcon();
diff --git a/src/layouts/address-lookup/address-lookup.vue b/src/layouts/address-lookup/address-lookup.vue
index 7a4df016..5bcdeb86 100644
--- a/src/layouts/address-lookup/address-lookup.vue
+++ b/src/layouts/address-lookup/address-lookup.vue
@@ -8,6 +8,7 @@
         <div class="page-container-grouped-styles">
             <siteHeader cmsWidgetName="SiteHeaderWidget" ref="siteHeader" />
             <vehicleBanner
+                class="mb-3"
                 cmsWidgetName="VehicleBannerWidget"
                 ref="vehicleBanner"
                 :displayGenericVehicleImage="false" />
@@ -37,7 +38,7 @@
                     v-bind:isDismissible="false" />
 
                 <customerQuestions ref="customerQuestions" v-model="customerQuestions" />
-                
+
                 <siteFooter
                     cmsWidgetName="SiteFooterWidget"
                     ref="siteFooter"
@@ -116,7 +117,7 @@ export default {
             this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
         },
         attachCustomEvents() {
-            
+
             this.prependActionToMethod(this, this.forwardButtonAction, () => {
                 this.pushEventToGA(
                     this.$route.query[this.queryStrings.ISS_PAGE],
@@ -125,7 +126,7 @@ export default {
                     true
                 );
             });
-            
+
         },
 
         async forwardButtonAction() {
@@ -237,7 +238,7 @@ export default {
             // display vehicle changed alert on that page.
             if (
                 this.isCarIdDifferent &&
-                !this.isSelectedGlassAvailableForVehicle 
+                !this.isSelectedGlassAvailableForVehicle
             ) {
                 this.$router.navigate(
                     this.navigationScenarios.SELECTED_VIN_WITH_MISMATCHED_GLASS,
diff --git a/src/layouts/address-vehicles/address-vehicles.vue b/src/layouts/address-vehicles/address-vehicles.vue
index 8f6cbb2e..1fd2bf55 100644
--- a/src/layouts/address-vehicles/address-vehicles.vue
+++ b/src/layouts/address-vehicles/address-vehicles.vue
@@ -8,6 +8,7 @@
     <div class="page-container-grouped-styles overflow-auto">
       <siteHeader cmsWidgetName="SiteHeaderWidget" />
       <vehicleBanner
+        class="mb-3"
         cmsWidgetName="VehicleBannerWidget"
         :displayGenericVehicleImage="false"
       />
@@ -264,4 +265,4 @@ export default {
 #multiple-vehicles-alert p {
   margin-bottom: 0 !important; // Overrides extra margin-bottom on alert body text
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/layouts/capability-questions/capability-questions.vue b/src/layouts/capability-questions/capability-questions.vue
index d25d958a..23ba630f 100644
--- a/src/layouts/capability-questions/capability-questions.vue
+++ b/src/layouts/capability-questions/capability-questions.vue
@@ -11,6 +11,7 @@
       <vehicleBanner
         cmsWidgetName="VehicleBannerWidget"
         :displayGenericVehicleImage="false"
+        class="mb-3"
       />
       <siteSubHeader
         cmsWidgetName="SiteSubHeaderWidget"
@@ -50,11 +51,11 @@ export default {
     siteHeader,
     siteSubHeader,
     Form,
-    vehicleBanner,    
-  },  
+    vehicleBanner,
+  },
   data() {
     return {};
-  },  
+  },
   async beforeRouteEnter(to, from, next) {
     const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
 
@@ -82,7 +83,7 @@ export default {
        */
       this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
     },
-    async forwardButtonAction() {},    
+    async forwardButtonAction() {},
     resetDependentState() {},
   },
 };
diff --git a/src/layouts/coverage-statement/coverage-statement.vue b/src/layouts/coverage-statement/coverage-statement.vue
index 2e0e7565..6c38f0ff 100644
--- a/src/layouts/coverage-statement/coverage-statement.vue
+++ b/src/layouts/coverage-statement/coverage-statement.vue
@@ -11,13 +11,31 @@
       <vehicleBanner
         cmsWidgetName="VehicleBannerWidget"
         :displayGenericVehicleImage="false"
+        class="mb-0"
       />
-      <siteSubHeader
-        cmsWidgetName="SiteSubHeaderWidget"
-      />
-      <div class="fade-on-route-transition sub-container make-tall mt-5">
-        <p>Placeholder for coverage-statement page</p>
-
+      <div class="fade-on-route-transition sub-container make-tall">
+        <textBlock
+            cmsWidgetName="verifyingCoverageStatement"
+            typeStyle="h5"
+            justifyText="center"
+            class="mt-4 mb-4"
+        />
+        <textBlock
+            cmsWidgetName="continueWithSchedulingCopy"
+            typeStyle="body"
+            class="mt-0"
+        />
+        <textBlock
+            cmsWidgetName="whatHappensNextCopy"
+            typeStyle="h6"
+            class="mt-4"
+        />
+        <textBlock
+            cmsWidgetName="UnverifiedADASNextStepsWidget"
+            typeStyle="body"
+        />
+        <a href="#!" data-bs-toggle="modal" data-bs-target="#RecalModal" aria-label="Modal window">Recalibration</a>
+        <modal cmsWidgetName="RecalModal" />
         <siteFooter
           cmsWidgetName="SiteFooterWidget"
           :isForwardActionDisabled="!meta.valid"
@@ -30,9 +48,6 @@
   </Form>
 </template>
 <script>
-// Import Supporting Files
-import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
-import { settleAllPromises } from '@/helpers/layout-helper';
 
 // Import Component
 import baseFormMixin from '@/mixins/base-form-mixin';
@@ -41,6 +56,12 @@ import siteFooter from '@/iss-components/site-footer/site-footer.vue';
 import siteHeader from '@/iss-components/site-header/site-header.vue';
 import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
 import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
+import textBlock from "@/digital-components/text-block/text-block";
+import modal from "@/digital-components/modal/modal";
+
+// Import Supporting Files
+import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
+import { settleAllPromises } from '@/helpers/layout-helper';
 
 export default {
   name: 'coverage-statement',
@@ -50,11 +71,13 @@ export default {
     siteHeader,
     siteSubHeader,
     Form,
-    vehicleBanner,    
-  },  
+    vehicleBanner,
+    textBlock,
+    modal,
+  },
   data() {
     return {};
-  },  
+  },
   async beforeRouteEnter(to, from, next) {
     const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
 
@@ -82,8 +105,17 @@ export default {
        */
       this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
     },
-    async forwardButtonAction() {},    
+    async forwardButtonAction() {},
     resetDependentState() {},
   },
 };
 </script>
+
+<style lang="scss">
+    ol {
+        margin-left: -1rem;
+        li {
+            margin-bottom: .5rem;
+        }
+    }
+</style>
diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.vue b/src/layouts/license-plate-lookup/license-plate-lookup.vue
index cba7bf6a..a3896f85 100644
--- a/src/layouts/license-plate-lookup/license-plate-lookup.vue
+++ b/src/layouts/license-plate-lookup/license-plate-lookup.vue
@@ -1,11 +1,12 @@
-<template>  
-  <Form 
+<template>
+  <Form
       @submit="onSubmit"
       @invalid-submit="onInvalidSubmit"
       v-slot="{ meta }">
     <div class="page-container-grouped-styles overflow-auto">
       <siteHeader cms-widget-name="SiteHeaderWidget" />
       <vehicleBanner
+        class="mb-3"
         cms-widget-name="VehicleBannerWidget"
         :display-generic-vehicle-image="false" />
       <siteSubHeader cms-widget-name="SiteSubHeaderWidget" />
@@ -29,7 +30,7 @@
         <textboxQuestion
           cmsWidgetName="LicensePlateNumberQuestionWidget"
           v-model="licensePlate"
-          isRequired 
+          isRequired
           disableAutoFill
           id="license-plate-question-wrapper"
           inputId="license-plate-question"
@@ -97,17 +98,17 @@ export default {
     ];
 
     const resultMap = await settleAllPromises(promiseResultMap);
-    
+
     // Call the "next" function to complete the transition to this page.
     next((vm) => {
-      vm.setCmsContent(resultMap.cmsContent);      
+      vm.setCmsContent(resultMap.cmsContent);
     });
   },
   data() {
     return {
       activeVehicleLookupAlertType: null,
       vehicleFromLookup: null,
-      licensePlate: null, 
+      licensePlate: null,
       licenseState: null,
       displayVinNotFoundAlert: false,
       displayMatchedDifferentVehicleAlert: false,
@@ -118,7 +119,7 @@ export default {
    };
   },
   methods: {
-    arePagePrerequisitesValid() {      
+    arePagePrerequisitesValid() {
       return this.mainStore.order.vehicle.carId !== null;
     },
     loadDefaultsFromStore() {
@@ -162,7 +163,7 @@ export default {
         this.$refs.siteFooter.disableForwardButton();
         return this.$refs.siteFooter.removeLoader();
       };
-      
+
       // Vehicle found from VIN lookup
       const vehicleFromLookup = resultMap.vinLookupResponse.vehicle;
 
diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue
index ab07d525..01ce9443 100644
--- a/src/layouts/vehicle-damage/vehicle-damage.vue
+++ b/src/layouts/vehicle-damage/vehicle-damage.vue
@@ -3,6 +3,7 @@
         <div class="page-container-grouped-styles overflow-auto">
             <siteHeader cmsWidgetName="SiteHeaderWidget" />
             <vehicleBanner
+                class="mb-3"
                 cmsWidgetName="VehicleBannerWidget"
                 :displayGenericVehicleImage="false" />
             <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
@@ -123,7 +124,7 @@ export default {
     },
     setup() {
         const mainStore = useMainStore();
-        
+
         return { mainStore };
     },
     data() {
@@ -138,7 +139,7 @@ export default {
             selectedRearReplaceOptions: this.getRearReplaceOptionsFromStore(),
         };
     },
-    methods: {        
+    methods: {
         arePagePrerequisitesValid() {
             if (this.mainStore.order.vehicle.carId) {
                 return true;
@@ -306,8 +307,8 @@ export default {
             return this.navigateForward();
         },
 
-        navigateForward() {            
-            if (this.mainStore.damage.isRepair) {                
+        navigateForward() {
+            if (this.mainStore.damage.isRepair) {
                 this.$router.navigate(
                     this.navigationScenarios.CLICKED_FORWARD_WITH_REPAIR,
                     this.$route
@@ -326,7 +327,7 @@ export default {
                         this.$route
                     );
                 }
-            }            
+            }
         },
 
         selectedGlassToReplace() {
diff --git a/src/layouts/vehicle-lookup/vehicle-lookup.vue b/src/layouts/vehicle-lookup/vehicle-lookup.vue
index c9064901..34124672 100644
--- a/src/layouts/vehicle-lookup/vehicle-lookup.vue
+++ b/src/layouts/vehicle-lookup/vehicle-lookup.vue
@@ -8,6 +8,7 @@
         cms-widget-name="SiteHeaderWidget"
       />
       <VehicleBanner
+        class="mb-3"
         cms-widget-name="VehicleBannerWidget"
         :display-generic-vehicle-image="false"
       />
diff --git a/src/layouts/vehicle-make/vehicle-make.vue b/src/layouts/vehicle-make/vehicle-make.vue
index 4be988e9..2b91a3a7 100644
--- a/src/layouts/vehicle-make/vehicle-make.vue
+++ b/src/layouts/vehicle-make/vehicle-make.vue
@@ -3,21 +3,21 @@
       <siteHeader cmsWidgetName="SiteHeaderWidget" />
       <div class="select-car">
         <div class="select-car-form rounded text-center">
-          <vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true"/>
-          <siteSubHeader 
+          <vehicleBanner class="mb-3" cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true"/>
+          <siteSubHeader
             cmsWidgetName="SiteSubHeaderWidget"
             :hasBackButton="true"
             @click-event="backButtonAction"
           />
           <div class="fade-on-route-transition">
-            <makeQuestion 
+            <makeQuestion
               class="fade-on-route-transition"
-              v-model="selectedMake" 
-              ref="makeQuestion" 
-              cmsWidgetName="VehicleMakeQuestion" 
+              v-model="selectedMake"
+              ref="makeQuestion"
+              cmsWidgetName="VehicleMakeQuestion"
             />
           </div>
-          <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" 
+          <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter"
             @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
         </div>
       </div>
@@ -45,11 +45,11 @@
             };
         },
 
-        async beforeRouteEnter(to, from, next) {       
+        async beforeRouteEnter(to, from, next) {
         // Call APIs
         const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
         const makeQuestionInitialDataPromise = makeQuestion.methods.loadInitialData();
-    
+
         // Settle promises and get results
         const promiseResultMap = [
             {
@@ -61,9 +61,9 @@
             promise: makeQuestionInitialDataPromise,
             },
         ];
-    
+
         let resultMap = await settleAllPromises(promiseResultMap);
-    
+
         // Call the "next" function to complete the transition to this page.
         next((vm) => {
             vm.setCmsContent(resultMap.cmsContent);
@@ -95,12 +95,12 @@
         },
         watch: {
           selectedMake(make) {
-            this.mainStore.updateVehicleMake( make ); 
+            this.mainStore.updateVehicleMake( make );
             this.$router.navigate(
               this.navigationScenarios.SELECTED_MAKE,
               this.$route
             );
           },
-        }        
+        }
     };
-</script>
\ No newline at end of file
+</script>
diff --git a/src/layouts/vehicle-model/vehicle-model.vue b/src/layouts/vehicle-model/vehicle-model.vue
index bb3b0d40..cf34cbbd 100644
--- a/src/layouts/vehicle-model/vehicle-model.vue
+++ b/src/layouts/vehicle-model/vehicle-model.vue
@@ -3,7 +3,7 @@
       <siteHeader cmsWidgetName="SiteHeaderWidget" />
       <div class="select-car">
         <div class="select-car-form rounded text-center">
-          <vehicleBanner cmsWidgetName="VehicleBannerWidget" displayGenericVehicleImage />
+          <vehicleBanner class="mb-3" cmsWidgetName="VehicleBannerWidget" displayGenericVehicleImage />
           <siteSubHeader
             cmsWidgetName="SiteSubHeaderWidget"
             :hasBackButton="true"
@@ -13,13 +13,13 @@
           <div class="fade-on-route-transition">
             <modelQuestion v-model="selectedModel" ref="modelQuestion" cmsWidgetName="VehicleModelQuestion" />
           </div>
-          <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" 
+          <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter"
             @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
         </div>
       </div>
     </div>
   </template>
-  
+
   <script>
   // Components
   import modelQuestion from "@/layouts/vehicle-model/model-question/model-question";
@@ -27,11 +27,11 @@
   import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
   import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
   import siteFooter from "@/iss-components/site-footer/site-footer";
-  
+
   // Supporting files
   import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
   import { settleAllPromises } from "@/helpers/layout-helper";
-  
+
   export default {
     name: "vehicle-model",
     data() {
@@ -45,7 +45,7 @@
       const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
       const modelQuestionInitialDataPromise =
         modelQuestion.methods.loadInitialData();
-  
+
       // Settle promises and get results
       const promiseResultMap = [
         {
@@ -57,9 +57,9 @@
           promise: modelQuestionInitialDataPromise,
         },
       ];
-  
+
       const resultMap = await settleAllPromises(promiseResultMap);
-  
+
       // Call the "next" function to complete the transition to this page.
       next((vm) => {
         vm.setCmsContent(resultMap.cmsContent);
@@ -68,7 +68,7 @@
         );
       });
     },
-  
+
     methods: {
         backButtonAction() {
         // route to move backwards
@@ -77,7 +77,7 @@
             this.$route
             );
         },
-        arePagePrerequisitesValid() 
+        arePagePrerequisitesValid()
         {
             if(this.mainStore.order.vehicle.make){
                 return true;
@@ -109,4 +109,3 @@
     },
   };
   </script>
-  
\ No newline at end of file
diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue
index 06780711..61415037 100644
--- a/src/layouts/vehicle-parts/vehicle-parts.vue
+++ b/src/layouts/vehicle-parts/vehicle-parts.vue
@@ -3,6 +3,7 @@
         <div class="page-container-grouped-styles vehicle-parts">
             <siteHeader ref="siteHeader" cmsWidgetName="SiteHeaderWidget" />
             <vehicleBanner
+                class="mb-3"
                 ref="vehicleBanner"
                 cmsWidgetName="VehicleBannerWidget"
                 :displayGenericVehicleImage="false" />
diff --git a/src/layouts/vehicle-style/vehicle-style.vue b/src/layouts/vehicle-style/vehicle-style.vue
index e8b3e942..893de9d0 100644
--- a/src/layouts/vehicle-style/vehicle-style.vue
+++ b/src/layouts/vehicle-style/vehicle-style.vue
@@ -3,7 +3,7 @@
         <siteHeader cmsWidgetName="SiteHeaderWidget" />
         <div class="select-car">
             <div class="select-car-form rounded text-center">
-                <vehicleBanner cmsWidgetName="VehicleBannerWidget" displayGenericVehicleImage />
+                <vehicleBanner cmsWidgetName="VehicleBannerWidget" class="mb-3" displayGenericVehicleImage />
                 <siteSubHeader
                     cmsWidgetName="SiteSubHeaderWidget"
                     :hasBackButton="true"
@@ -15,7 +15,7 @@
                         ref="styleQuestion"
                         cmsWidgetName="VehicleStyleQuestion" />
                 </div>
-                <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" 
+                <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter"
                     @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
             </div>
         </div>
@@ -65,7 +65,7 @@ export default {
         ];
 
         const resultMap = await settleAllPromises(promiseResultMap);
-        
+
         const visitedVehicleDamage = useMainStore().pageData(issPageValues.VEHICLE_DAMAGE) ? true : false;
 
         // If we have exactly one style then navigate directly to vehicle-damage
@@ -117,7 +117,7 @@ export default {
     },
 
     computed: {
-        backButtonAccessibleText() 
+        backButtonAccessibleText()
         {
             return this.getCmsContent(this.cmsWidgetName, "BackButtonAccessibleText")
         }
diff --git a/src/layouts/vehicle-year/vehicle-year.vue b/src/layouts/vehicle-year/vehicle-year.vue
index 598e4728..10ea7b52 100644
--- a/src/layouts/vehicle-year/vehicle-year.vue
+++ b/src/layouts/vehicle-year/vehicle-year.vue
@@ -3,23 +3,23 @@
       <siteHeader cmsWidgetName="SiteHeaderWidget" />
       <div class="select-car">
         <div class="select-car-form rounded text-center">
-          <vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true"/>
+          <vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
           <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
           <div class="fade-on-route-transition">
-            <yearQuestion 
+            <yearQuestion
               class="fade-on-route-transition"
-              v-model="selectedYear" 
-              ref="yearQuestion" 
-              cmsWidgetName="VehicleYearQuestion" 
+              v-model="selectedYear"
+              ref="yearQuestion"
+              cmsWidgetName="VehicleYearQuestion"
             />
           </div>
-          <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" 
+          <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter"
             @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
         </div>
       </div>
     </div>
   </template>
-  
+
   <script>
   // Components
   import yearQuestion from "@/layouts/vehicle-year/year-question/year-question";
@@ -27,11 +27,11 @@
   import siteFooter from "@/iss-components/site-footer/site-footer";
   import siteSubHeader from "@/iss-components/site-sub-header/site-sub-header";
   import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
-  
+
   // Supporting files
   import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
   import { settleAllPromises } from "@/helpers/layout-helper";
-  
+
   export default {
     name: "vehicle-year",
     data() {
@@ -41,12 +41,12 @@
       };
     },
     computed: {},
-  
+
     async beforeRouteEnter(to, from, next) {
       // Call APIs
       const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
       const yearQuestionInitialDataPromise = yearQuestion.methods.loadInitialData();
-  
+
       // Settle promises and get results
       const promiseResultMap = [
         {
@@ -58,9 +58,9 @@
           promise: yearQuestionInitialDataPromise,
         },
       ];
-  
+
       let resultMap = await settleAllPromises(promiseResultMap);
-  
+
       // Call the "next" function to complete the transition to this page.
       next((vm) => {
         vm.setCmsContent(resultMap.cmsContent);
@@ -73,8 +73,8 @@
     watch: {
       selectedYear(year) {
         const parsedYear = parseInt(year);
-        this.mainStore.updateVehicleYear( parsedYear ); 
-        
+        this.mainStore.updateVehicleYear( parsedYear );
+
         this.$router.navigate(
           this.navigationScenarios.SELECTED_YEAR,
           this.$route
@@ -89,7 +89,7 @@
             this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
       },
     },
-    
+
     components: {
       yearQuestion,
       siteHeader,
@@ -99,4 +99,3 @@
     },
   };
   </script>
-  
\ No newline at end of file
diff --git a/src/layouts/vin-lookup/vin-lookup.vue b/src/layouts/vin-lookup/vin-lookup.vue
index d3751f1f..c54c2b7e 100644
--- a/src/layouts/vin-lookup/vin-lookup.vue
+++ b/src/layouts/vin-lookup/vin-lookup.vue
@@ -9,6 +9,7 @@
         cmsWidgetName="SiteHeaderWidget"
       />
       <vehicleBanner
+        class="mb-3"
         cmsWidgetName="VehicleBannerWidget"
         :displayGenericVehicleImage="false"
       />
@@ -82,7 +83,7 @@ export default {
       activeVehicleLookupAlertType: null,
       needToLookupVehicle: true,
       vehicleFromLookup: null,
-      vin: null,      
+      vin: null,
     };
   },
   provide() {
@@ -130,7 +131,7 @@ export default {
       this.resetActiveAlert();
       // Temp solution to reset the 'disabled' style on the Continue button
       this.$refs.siteFooter.enableForwardAction();
-      
+
       if (this.needToLookupVehicle) {
         const vehicleLookupResponse = await this.lookupVehicleByVin(this.vin);
 
@@ -146,29 +147,29 @@ export default {
         }
 
         // Add vin bcs the response from the service doesn't contain vin
-        this.vehicleFromLookup = Object.assign(vehicleLookupResponse.data, { vin: this.vin });        
+        this.vehicleFromLookup = Object.assign(vehicleLookupResponse.data, { vin: this.vin });
       }
 
-      if (this.needToLookupVehicle && this.isCarIdDifferentFromTheStore) {                
-        this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NOT_MATCHED;          
-        
+      if (this.needToLookupVehicle && this.isCarIdDifferentFromTheStore) {
+        this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NOT_MATCHED;
+
         const vehicleYearMakeModel = `${this.vehicleFromLookup.year} ${this.vehicleFromLookup.make} ${this.vehicleFromLookup.model}`;
         this.$refs.siteFooter.updateButtonText(`Continue with ${vehicleYearMakeModel}`);
         this.$refs.siteFooter.removeLoader();
-        
+
         this.needToLookupVehicle = false;
 
         return;
       }
 
-      let isSelectedGlassAvailableForVehicle = true;      
-      if (this.isCarIdDifferentFromTheStore) {        
-        isSelectedGlassAvailableForVehicle = 
-          await isGlassAvailableForCarId(this.vehicleFromLookup.carId);        
-      }            
-      
+      let isSelectedGlassAvailableForVehicle = true;
+      if (this.isCarIdDifferentFromTheStore) {
+        isSelectedGlassAvailableForVehicle =
+          await isGlassAvailableForCarId(this.vehicleFromLookup.carId);
+      }
+
       // navigate back to vehicle-damage
-      if (this.isCarIdDifferentFromTheStore && !isSelectedGlassAvailableForVehicle) {              
+      if (this.isCarIdDifferentFromTheStore && !isSelectedGlassAvailableForVehicle) {
         this.mainStore.updateVehicle(this.vehicleFromLookup);
         this.$router.navigate(
           this.navigationScenarios.SELECTED_VIN_WITH_MISMATCHED_GLASS,
@@ -179,8 +180,8 @@ export default {
 
         // navigate() doesn't stop the processing flow
         return;
-      }            
-      
+      }
+
       this.mainStore.updateVehicle(this.vehicleFromLookup);
       const partsOrQuestionsResponse = await this.getPartsOrQuestions();
       if (partsOrQuestionsResponse.error) {
@@ -194,7 +195,7 @@ export default {
       await this.navigateForward(partsOrQuestionsResponse.data.partsOrQuestions, this);
     },
     async getPartsOrQuestions() {
-      try {        
+      try {
         const response = await this.mainStore.getPartsOrQuestions();
 
         return response;
@@ -209,15 +210,15 @@ export default {
     async lookupVehicleByVin(vin) {
       try {
         return await this.mainStore.lookupVehicleByVin(vin);
-      } 
-      catch (responseError) {        
+      }
+      catch (responseError) {
         return {
           error: {
             status: responseError.status,
           },
         };
       }
-    },        
+    },
     resetActiveAlert() {
       this.activeVehicleLookupAlertType = null;
     },
diff --git a/src/layouts/welcome-page/welcome-page.vue b/src/layouts/welcome-page/welcome-page.vue
index c527d65f..79aef739 100644
--- a/src/layouts/welcome-page/welcome-page.vue
+++ b/src/layouts/welcome-page/welcome-page.vue
@@ -34,7 +34,7 @@
             </div>
             <div class="row">
                 <div class="col">
-                    <textBlock cmsWidgetName="DamageDateEstimateWidget" typeStyle="caption" />
+                    <textBlock cmsWidgetName="DamageDateEstimateWidget" typeStyle="caption" class="mt-2" />
                 </div>
             </div>
             <div class="row mt-4">
diff --git a/src/styles/common-typography-styles.scss b/src/styles/common-typography-styles.scss
index 9ee9aa28..a593092e 100644
--- a/src/styles/common-typography-styles.scss
+++ b/src/styles/common-typography-styles.scss
@@ -25,7 +25,7 @@ h4,.h4 {
   font-weight: 300;
 }
 h5,.h5 {
-  line-height: 1.325;
+  line-height: 1.6;
   font-weight: 400;
 }
 h6,.h6 {
@@ -64,4 +64,4 @@ caption,
   font-size: 1rem !important;
   line-height: 1.4;
   font-weight: 500;
-}
\ No newline at end of file
+}

From e8e88133a80546e5168e617dbe398a0b2843d9bf Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Tue, 14 Feb 2023 11:10:46 -0500
Subject: [PATCH 18/19] Update font size/weight.

---
 src/layouts/coverage-statement/coverage-statement.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/layouts/coverage-statement/coverage-statement.vue b/src/layouts/coverage-statement/coverage-statement.vue
index 6c38f0ff..e73ff61b 100644
--- a/src/layouts/coverage-statement/coverage-statement.vue
+++ b/src/layouts/coverage-statement/coverage-statement.vue
@@ -27,8 +27,7 @@
         />
         <textBlock
             cmsWidgetName="whatHappensNextCopy"
-            typeStyle="h6"
-            class="mt-4"
+            class="mt-4 mb-2 fw-bold"
         />
         <textBlock
             cmsWidgetName="UnverifiedADASNextStepsWidget"

From a8a25c21b888f4d29930e7b72d93e57fb1c6e013 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Thu, 16 Feb 2023 16:19:48 -0500
Subject: [PATCH 19/19] fix to save vin to store correctly so
 getPartsOrQuestions can use vin

---
 src/layouts/license-plate-lookup/license-plate-lookup.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.vue b/src/layouts/license-plate-lookup/license-plate-lookup.vue
index a3896f85..404a8785 100644
--- a/src/layouts/license-plate-lookup/license-plate-lookup.vue
+++ b/src/layouts/license-plate-lookup/license-plate-lookup.vue
@@ -194,7 +194,7 @@ export default {
       await useMainStore().saveRegistrationLicensePlateLookup(
           {
               isSelectedGlassAvailableForVehicle: this.isSelectedGlassAvailableForVehicle,
-              vehicleInfo: Object.assign(vehicleFromLookup, {vin: vehicleFromLookup.vin }),
+              vehicleInfo: Object.assign(vinLookupResponse.data.vehicle, { vin: vinLookupResponse.data.vin }),
               registrationInfo: {
                   licensePlate: this.licensePlate,
                   state: this.licenseState,