get validation observer working for tests

frontend/jest.config.js

@@ -15,10 +15,14 @@ module.exports = {
   transform: {
     '^.+\\.vue$': '<rootDir>/node_modules/vue-jest',
     '^.+\\.(js|jsx)?$': '<rootDir>/node_modules/babel-jest',
+    'vee-validate/dist/rules': '<rootDir>/node_modules/babel-jest',
   },
   setupFiles: ['<rootDir>/test/testSetup.js'],
   testMatch: ['**/?(*.)+(spec|test).js?(x)'],
   // snapshotSerializers: ['jest-serializer-vue'],
-  transformIgnorePatterns: ['<rootDir>/node_modules/'],
+  transformIgnorePatterns: [
+    '<rootDir>/node_modules/',
+    '<rootDir>/node_modules/(?!vee-validate/dist/rules)',
+  ],
   preset: '@vue/cli-plugin-unit-jest',
 }

frontend/src/views/Pages/Login.spec.js

@@ -0,0 +1,44 @@
+import { mount, RouterLinkStub } from '@vue/test-utils'
+import Vuex from 'vuex'
+
+import Login from './Login'
+
+const localVue = global.localVue
+
+describe('Login', () => {
+  let wrapper
+
+  let mocks = {
+    $i18n: {
+      locale: 'en',
+    },
+    $t: jest.fn((t) => t),
+  }
+
+  let store = new Vuex.Store({
+    getters: {
+      'auth/isModerator': () => false,
+      'auth/user': () => {
+        return { id: 'some-user' }
+      },
+    },
+  })
+
+  let stubs = {
+    RouterLink: RouterLinkStub,
+  }
+
+  const Wrapper = () => {
+    return mount(Login, { localVue, mocks, store, stubs })
+  }
+
+  describe('mount', () => {
+    beforeEach(() => {
+      wrapper = Wrapper()
+    })
+
+    it('renders the Login form', () => {
+      expect(wrapper.find('div.login-form').exists()).toBeTruthy()
+    })
+  })
+})

frontend/src/views/Pages/Login.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="login-form">
     <!-- Header -->
     <div class="header p-4">
       <b-container>

frontend/test/testSetup.js

@@ -1,8 +1,18 @@
 import { createLocalVue } from '@vue/test-utils'
 import ElementUI from 'element-ui'
-import BootstrapVue from 'bootstrap-vue'
+import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
+import Vuex from 'vuex'
+import { ValidationProvider, ValidationObserver } from 'vee-validate'
+import BaseInput from '@/components/Inputs/BaseInput.vue'
+import BaseButton from '@/components/BaseButton.vue'
 
 global.localVue = createLocalVue()
 
 global.localVue.use(ElementUI)
 global.localVue.use(BootstrapVue)
+global.localVue.use(Vuex)
+global.localVue.use(IconsPlugin)
+global.localVue.component(BaseInput.name, BaseInput)
+global.localVue.component('validation-provider', ValidationProvider)
+global.localVue.component('validation-observer', ValidationObserver)
+global.localVue.component(BaseButton.name, BaseButton)