CSR-726 | Cash or Insurance Toggle

Unit Tests
Default selection logic
Fix for list-button-horizontal

src/layouts/quote/cash-or-insurance-question/cash-or-insurance-question.spec.js

@@ -0,0 +1,57 @@
+import { shallowMount } from "@vue/test-utils";
+import CashOrInsuranceQuestion from "./cash-or-insurance-question";
+
+
+describe("cash-or-insurance-question.vue", () => {
+    it("Should emit a false boolean value when selectedValues is 'CashAnswer' (update:modelValue)", async () => {
+        
+        //Arrange
+        const wrapper = shallowMount(CashOrInsuranceQuestion, {
+            propsData: mockProps,
+            mixins: [mockMixin]
+        });
+
+        //Act
+        wrapper.vm.selectedValues = "CashAnswer";
+        await wrapper.vm.$nextTick();
+
+        //Assert
+        expect(wrapper.emitted()["update:modelValue"][0]).toEqual([false]);
+        expect(typeof wrapper.emitted()["update:modelValue"][0][0]).toBe("boolean");
+    });
+    it("Should return 'CashAnswer' from selectedValues when modelValue is set to false", async () => {
+
+        //Arrange
+        const wrapper = shallowMount(CashOrInsuranceQuestion, {
+            propsData: mockProps,
+            mixins: [mockMixin]
+        });
+
+        //Act
+        wrapper.setProps({modelValue : false});
+        await wrapper.vm.$nextTick();
+
+        //Assert
+        expect(wrapper.vm.selectedValues).toBe("CashAnswer");
+    });
+});
+
+                        ///////////////
+                        // Constants //
+                        ///////////////
+
+const mockMixin = {
+  methods: {
+    getCmsContent: jest.fn((widgetName, cmsFieldName) => {
+        return mockCmsContent[cmsFieldName];
+    })
+  }
+}
+
+const mockProps = {
+    modelValue: true,
+}
+
+const mockCmsContent = {
+    'Text': "Sample text here.",
+}

src/layouts/quote/cash-or-insurance-question/cash-or-insurance-question.vue

@@ -14,6 +14,9 @@
 <script>
 import buttonQuestion from "@/common-components/button-question/button-question";
 
+const cashAnswer = "CashAnswer";
+const insuranceAnswer = "InsuranceAnswer";
+
 export default ({
     name: "cashOrInsuranceQuestion",
     props: {               
@@ -23,17 +26,18 @@ export default ({
     },
     computed: {
         answersFromCms(){
+            //console.log(JSON.parse(JSON.stringify(this.getCmsContent(this.cmsWidgetName, 'Answers'))));
             return this.getCmsContent(this.cmsWidgetName, 'Answers');
         },
         selectedValues: {
             get: function() {
                 // Convert to CMS answer name from bool
-                var cmsAnswerValue = this.modelValue ? "InsuranceAnswer" : "CashAnswer";
+                var cmsAnswerValue = this.modelValue ? insuranceAnswer : cashAnswer;
                 return cmsAnswerValue;
             },
             set: function(newValue) {
                 // Convert back to bool for parent component
-                this.$emit("update:modelValue", newValue === "InsuranceAnswer");
+                this.$emit("update:modelValue", newValue === insuranceAnswer);
             }
         },
     },

src/layouts/quote/quote.vue

@@ -133,19 +133,43 @@ export default {
     // Call APIs
     const cmsContent = await fetchCmsContentForPage(to.query.fmgPage);
 
+    // TODOS - modify as needed, just a rough sketch to place initializations
+
+    // get supporting lineitems
+
+    // get wiper and rain defense lineitems
+
+    // Settle promises and get results
+
+    // get price of supporting, rain defense & wipers, and parts
+
+    // Settle pricing promise and get results
+
+
     // Call the "next" function to complete the transition to this page.
     next((vm) => {
       vm.setCmsContent(cmsContent);
+      vm.isInsurance = vm.getDefaultIsInsuranceValue();
     });
   },
   data(){
     return {
-      isInsurance: false,
+      cashOrInsuranceThreshhold: 600,
+      pricingRequestResult: null,
+      isInsurance: null,
     }
   },
   methods: {
     arePagePrerequisitesValid() {
       return store.getters.order.damage.isRepair || (store.getters.order.lineItems?.glassParts != null && store.getters.order.lineItems.glassParts.length > 0);
+    },
+    getDefaultIsInsuranceValue() {
+      var defaultIsInsuranceValue = this.$store.getters.order.payment.isInsurance;
+      if(defaultIsInsuranceValue != null) {
+        return defaultIsInsuranceValue;
+      } else {
+        return this.economyPackagePrice > this.cashOrInsuranceThreshhold;
+      }
     }
   },
   computed: {
@@ -155,6 +179,10 @@ export default {
     answersFromCms() {
       return ["Pay on my own", "Pay with insurance"];
     },
+    economyPackagePrice() {
+      //TODO build out the pricing logic CSR-504
+      return 0;
+    },
     selectedChipCountValues: {
       get: function() {
         return this.modelValue;

src/ux-components/list-button-horizontal/list-button-horizontal.vue

@@ -85,7 +85,7 @@ export default {
         : this.selectedValues[0] == this.value;
     }
     else {
-      this.checkValue = this.selectedValues;
+      this.checkValue = this.selectedValues === this.value;
     }
   },
   methods: {