From d1008cd0c78123d7a759ddad7f9a25bb0c107322 Mon Sep 17 00:00:00 2001
From: Matt Rider <mattwr18@gmail.com>
Date: Wed, 21 Aug 2019 13:17:32 +0200
Subject: [PATCH] Fix vue warnings

- localVue.use(Styleguide) to register components
- find masonryGrid and emit event

- Co-authored-by: Alina Beck <alina.beck@mail.com>
- Co-authored-by: Joseph Ngugi <jngugi88@gmail.com>
---
 webapp/components/MasonryGrid/MasonryGrid.spec.js  | 14 ++++++++++----
 .../components/MasonryGrid/MasonryGridItem.spec.js | 10 ++++++++--
 2 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/webapp/components/MasonryGrid/MasonryGrid.spec.js b/webapp/components/MasonryGrid/MasonryGrid.spec.js
index 8cedac652..2a52f9a85 100644
--- a/webapp/components/MasonryGrid/MasonryGrid.spec.js
+++ b/webapp/components/MasonryGrid/MasonryGrid.spec.js
@@ -1,22 +1,28 @@
-import { shallowMount } from '@vue/test-utils'
+import { mount, createLocalVue } from '@vue/test-utils'
+import Styleguide from '@human-connection/styleguide'
 import MasonryGrid from './MasonryGrid'
 
+const localVue = createLocalVue()
+localVue.use(Styleguide)
+
 describe('MasonryGrid', () => {
   let wrapper
+  let masonryGrid
 
   beforeEach(() => {
-    wrapper = shallowMount(MasonryGrid)
+    wrapper = mount(MasonryGrid, { localVue })
+    masonryGrid = wrapper.vm.$children[0]
   })
 
   it('adds the "reset-grid-height" class when one or more children are updating', () => {
-    wrapper.trigger('calculating-item-height')
+    masonryGrid.$emit('calculating-item-height')
 
     expect(wrapper.classes()).toContain('reset-grid-height')
   })
 
   it('removes the "reset-grid-height" class when all children have completed updating', () => {
     wrapper.setData({ itemsCalculating: 1 })
-    wrapper.trigger('finished-calculating-item-height')
+    masonryGrid.$emit('finished-calculating-item-height')
 
     expect(wrapper.classes()).not.toContain('reset-grid-height')
   })
diff --git a/webapp/components/MasonryGrid/MasonryGridItem.spec.js b/webapp/components/MasonryGrid/MasonryGridItem.spec.js
index ba22380ae..fc799dadc 100644
--- a/webapp/components/MasonryGrid/MasonryGridItem.spec.js
+++ b/webapp/components/MasonryGrid/MasonryGridItem.spec.js
@@ -1,11 +1,17 @@
-import { shallowMount } from '@vue/test-utils'
+import { config, shallowMount, createLocalVue } from '@vue/test-utils'
+import Styleguide from '@human-connection/styleguide'
 import MasonryGridItem from './MasonryGridItem'
 
+const localVue = createLocalVue()
+localVue.use(Styleguide)
+
+config.stubs['ds-grid-item'] = '<span><slot /></span>'
+
 describe('MasonryGridItem', () => {
   let wrapper
 
   beforeEach(() => {
-    wrapper = shallowMount(MasonryGridItem)
+    wrapper = shallowMount(MasonryGridItem, { localVue })
     wrapper.vm.$parent.$emit = jest.fn()
   })