Clean up and generalize jinja to vue test template rendering and testing

js/components/__tests__/checkbox_input.test.js

@@ -1,60 +1,24 @@
 import { mount } from '@vue/test-utils'
 
-import Vue from 'vue'
-
 import checkboxinput from '../checkbox_input'
 
-const fs = require('fs')
-const testTemplate = fs.readFileSync('js/test_templates/checkbox_input_template.html', 'utf-8')
-console.log(testTemplate)
-const template = `
-    <div>
-      <div class='usa-input'>
-        <fieldset data-ally-disabled="true" v-on:change="onInput" class="usa-input__choices">
-          <legend>
-            <input type="checkbox" v-model="isChecked"></input>
-            Some words about this checkbox
-          </legend>
-        </fieldset>
-      </div>
-    </div>
-`
+import { makeTestWrapper } from '../../test_utils/component_test_helpers'
 
-// const templatedCheckboxInput = {
-//     ...checkboxinput,
-//     template
-// }
-
-// Define test wrapping component
-// Use test template for wrapping component template
-// Inject component under test (checkboxInput) into wrapping component??
-
-const WrapperComponent = {
-    name: 'WrapperComponent',
-    components: { checkboxinput },
-    template: testTemplate,
-    props: {
-        initialChecked: Boolean,
+const WrapperComponent = makeTestWrapper({
+    components: {
+        checkboxinput
     },
-    data: function () {
-        return {
-            name: 'testCheck',
-            initialchecked: this.initialChecked
-        }
-    }
-}
+    templatePath: 'checkbox_input_template.html',
+})
 
 describe('CheckboxInput Renders Correctly', () => {
     it('Should initialize checked', () => {
         const wrapper = mount(WrapperComponent, {
             propsData: {
                 name: 'testCheck',
-                initialChecked: true
+                initialData: true
             }
         })
-
-        // wrapper.vm.$children[0].$data.isChecked = true
-
         expect(wrapper.find('.usa-input input').element.checked).toBe(true)
     })
 
@@ -62,10 +26,9 @@ describe('CheckboxInput Renders Correctly', () => {
         const wrapper = mount(WrapperComponent, {
             propsData: {
                 name: 'testCheck',
-                initialChecked: false
+                initialData: false
             }
         })
-
         expect(wrapper.find('.usa-input input').element.checked).toBe(false)
     })
 })