From 5c9d7dc53cfd203203bc6d21e804d51b4604efd6 Mon Sep 17 00:00:00 2001
From: Scott Kiener <scott.kiener@safelite.com>
Date: Thu, 1 Sep 2022 10:55:21 -0400
Subject: [PATCH 1/2] CSR-795 | Added unit tests to modal.vue

---
 src/common-components/modal/modal.spec.js | 61 +++++++++++++++++++++++
 src/common-components/modal/modal.vue     |  2 -
 2 files changed, 61 insertions(+), 2 deletions(-)
 create mode 100644 src/common-components/modal/modal.spec.js

diff --git a/src/common-components/modal/modal.spec.js b/src/common-components/modal/modal.spec.js
new file mode 100644
index 000000000..717b6f895
--- /dev/null
+++ b/src/common-components/modal/modal.spec.js
@@ -0,0 +1,61 @@
+import { shallowMount } from "@vue/test-utils";
+import Modal from "./modal";
+
+
+describe("modal.vue", () => {
+  it("Should display header text when HeaderText is defined in the CMS", async () => {
+    // Act
+    const wrapper = shallowMount(Modal, {
+      mixins: [mockMixin]
+    });
+    expect(wrapper.html()).toEqual(expect.stringContaining(mockCmsContent['HeaderText']));
+  });
+
+  it("Should display subheader text when SubheaderText is defined in the CMS", async () => {
+    // Act
+    const wrapper = shallowMount(Modal, {
+      mixins: [mockMixin]
+    });
+    expect(wrapper.html()).toEqual(expect.stringContaining(mockCmsContent['SubheaderText']));
+  });
+
+  it("Should insert image url when Image is defined in the CMS", async () => {
+    // Act
+    const wrapper = shallowMount(Modal, {
+      mixins: [mockMixin]
+    });
+    expect(wrapper.html()).toEqual(expect.stringContaining(mockCmsContent['Image']));
+  });
+
+  it("Should display body text when BodyText is defined in the CMS", async () => {
+    // Act
+    const wrapper = shallowMount(Modal, {
+      mixins: [mockMixin]
+    });
+    expect(wrapper.html()).toEqual(expect.stringContaining(mockCmsContent['BodyText']));
+  });
+
+  it("Should display footer text when FooterText is defined in the CMS", async () => {
+    // Act
+    const wrapper = shallowMount(Modal, {
+      mixins: [mockMixin]
+    });
+    expect(wrapper.html()).toEqual(expect.stringContaining(mockCmsContent['FooterText']));
+  });
+});
+
+const mockMixin = {
+  methods: {
+    getCmsContent: jest.fn((widgetName, cmsFieldName) => {
+        return mockCmsContent[cmsFieldName];
+    })
+  }
+}
+
+const mockCmsContent = {
+    'HeaderText': "Sample header text here.",
+    'SubheaderText': "Sample subheader text here.",
+    'Image': "https://www.sampleImage.sample",
+    'BodyText': "Sample body text here.",
+    'FooterText': "Sample footer text here.",
+}
diff --git a/src/common-components/modal/modal.vue b/src/common-components/modal/modal.vue
index c03c0b12a..2ade08aeb 100644
--- a/src/common-components/modal/modal.vue
+++ b/src/common-components/modal/modal.vue
@@ -18,11 +18,9 @@
 </template>
 
 <script>
-import textLink from "@/ux-components/text-link/text-link";
 export default {
   name: 'modal',
   props: {
-    headlineText: String,
     cmsWidgetName: String,
   },
   data() {

From fba1efc7f9f84b6e8fc5177b1de0514045209a33 Mon Sep 17 00:00:00 2001
From: Scott Kiener <scott.kiener@safelite.com>
Date: Thu, 1 Sep 2022 14:22:05 -0400
Subject: [PATCH 2/2] CSR-795 | Fix typo

---
 src/common-components/modal/modal.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/common-components/modal/modal.vue b/src/common-components/modal/modal.vue
index 2ade08aeb..622b0e92c 100644
--- a/src/common-components/modal/modal.vue
+++ b/src/common-components/modal/modal.vue
@@ -6,7 +6,7 @@
         <div class="modal-body px-4 py-5">
           <img :src="this.ModalImage" class="w-100 mb-4" alt="" />
           <h5 class="mb-4" v-html="this.ModalHeadline"></h5>
-          <p class="fw-bold mb-2" v-html="this.ModalSubheaderText"></p>
+          <p class="fw-bold mb-2" v-html="this.ModalSubheadertext"></p>
           <p class="mb-0" v-html="this.ModalBodyText"></p>
         </div>
         <div class="modal-footer">