From a0345a605e79e1283fa779e47ad38c0c177d9b2c Mon Sep 17 00:00:00 2001
From: Zaytsev Kirill <Zaytzev.Kirill@yandex.ru>
Date: Mon, 2 Nov 2020 20:34:09 +0300
Subject: [PATCH] refactor: Moved install method out of Formulario class

---
 src/Formulario.ts            | 20 ++---------
 src/index.ts                 | 28 +++++++++++++--
 test/unit/Formulario.test.js | 70 +++++++++++++++++++++++++++++-------
 3 files changed, 85 insertions(+), 33 deletions(-)

diff --git a/src/Formulario.ts b/src/Formulario.ts
index 90f046e..401d2c4 100644
--- a/src/Formulario.ts
+++ b/src/Formulario.ts
@@ -1,20 +1,14 @@
-import { VueConstructor } from 'vue'
-
 import merge from '@/utils/merge'
 import validationRules from '@/validation/rules'
 import validationMessages from '@/validation/messages'
 
-import FormularioForm from '@/FormularioForm.vue'
-import FormularioGrouping from '@/FormularioGrouping.vue'
-import FormularioInput from '@/FormularioInput.vue'
-
 import {
     ValidationContext,
     CheckRuleFn,
     CreateMessageFn,
 } from '@/validation/validator'
 
-interface FormularioOptions {
+export interface FormularioOptions {
     validationRules?: any;
     validationMessages?: Record<string, Function>;
 }
@@ -27,19 +21,9 @@ export default class Formulario {
     public validationRules: Record<string, CheckRuleFn> = {}
     public validationMessages: Record<string, Function> = {}
 
-    constructor () {
+    constructor (options?: FormularioOptions) {
         this.validationRules = validationRules
         this.validationMessages = validationMessages
-    }
-
-    /**
-     * Install vue formulario, and register it’s components.
-     */
-    install (Vue: VueConstructor, options?: FormularioOptions): void {
-        Vue.prototype.$formulario = this
-        Vue.component('FormularioForm', FormularioForm)
-        Vue.component('FormularioGrouping', FormularioGrouping)
-        Vue.component('FormularioInput', FormularioInput)
 
         this.extend(options || {})
     }
diff --git a/src/index.ts b/src/index.ts
index 5bf2957..a8e34b8 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,3 +1,27 @@
-import Formulario from '@/Formulario.ts'
+import Formulario, { FormularioOptions } from '@/Formulario.ts'
+import { VueConstructor } from 'vue'
+import FormularioForm from '@/FormularioForm.vue'
+import FormularioGrouping from '@/FormularioGrouping.vue'
+import FormularioInput from '@/FormularioInput.vue'
 
-export default new Formulario()
+export default {
+    install (Vue: VueConstructor, options?: FormularioOptions): void {
+        Vue.component('FormularioForm', FormularioForm)
+        Vue.component('FormularioGrouping', FormularioGrouping)
+        Vue.component('FormularioInput', FormularioInput)
+
+        Vue.mixin({
+            beforeCreate () {
+                const o = this.$options as Record<string, any>
+
+                if (typeof o.formulario === 'function') {
+                    this.$formulario = o.formulario()
+                } else if (o.parent && o.parent.$formulario) {
+                    this.$formulario = o.parent.$formulario
+                } else {
+                    this.$formulario = new Formulario(options)
+                }
+            }
+        })
+    },
+}
diff --git a/test/unit/Formulario.test.js b/test/unit/Formulario.test.js
index 813de14..4cbb10f 100644
--- a/test/unit/Formulario.test.js
+++ b/test/unit/Formulario.test.js
@@ -1,18 +1,62 @@
-import Formulario from '@/index.ts'
+import { createLocalVue, mount } from '@vue/test-utils'
+import Formulario from '@/Formulario.ts'
+import plugin from '@/index.ts'
 
 describe('Formulario', () => {
     it('Installs on vue instance', () => {
-        const registry = []
-        function Vue () {}
-        Vue.component = function (name, instance) {
-            registry.push(name)
-        }
-        Formulario.install(Vue)
-        expect(Vue.prototype.$formulario).toBe(Formulario)
-        expect(registry).toEqual([
-            'FormularioForm',
-            'FormularioGrouping',
-            'FormularioInput',
-        ])
+        const localVue = createLocalVue()
+
+        localVue.use(plugin)
+
+        expect(localVue.component('FormularioForm')).toBeTruthy()
+        expect(localVue.component('FormularioGrouping')).toBeTruthy()
+        expect(localVue.component('FormularioInput')).toBeTruthy()
+
+        const wrapper = mount({ template: '<div />', }, { localVue })
+
+        expect(wrapper.vm.$formulario).toBeInstanceOf(Formulario)
+    })
+
+    it ('Pushes Formulario instance to child a component', () => {
+        const localVue = createLocalVue()
+
+        localVue.use(plugin)
+        localVue.component('TestComponent', {
+            render (h) {
+                return h('div')
+            }
+        })
+
+        const wrapper = mount({
+            render (h) {
+                return h('div', [h('TestComponent', { ref: 'test'  })])
+            },
+        }, { localVue })
+
+        expect(wrapper.vm.$formulario === wrapper.vm.$refs.test.$formulario).toBe(true)
+    })
+
+    it ('Does not pushes Formulario instance to a child component, if it has its own', () => {
+        const localVue = createLocalVue()
+
+        localVue.use(plugin)
+        // noinspection JSCheckFunctionSignatures
+        localVue.component('TestComponent', {
+            formulario () {
+                return new Formulario()
+            },
+
+            render (h) {
+                return h('div')
+            },
+        })
+
+        const wrapper = mount({
+            render (h) {
+                return h('div', [h('TestComponent', { ref: 'test'  })])
+            },
+        }, { localVue })
+
+        expect(wrapper.vm.$formulario === wrapper.vm.$refs.test.$formulario).toBe(false)
     })
 })