Upgrade vue-test-utils to latest version and correct deprecation warn…

…ing (#1029)
buefy · Oct 14, 2018 · 95d8a6a · 95d8a6a
1 parent db3adf5
commit 95d8a6a
Show file tree

Hide file tree

Showing 35 changed files with 1,541 additions and 1,884 deletions.
diff --git a/package.json b/package.json
@@ -50,7 +50,7 @@
   "devDependencies": {
     "@fortawesome/fontawesome-free": "5.3.1",
     "@mdi/font": "2.7.94",
-    "@vue/test-utils": "1.0.0-beta.15",
+    "@vue/test-utils": "^1.0.0-beta.25",
     "autoprefixer": "7.1.1",
     "axios": "0.16.2",
     "babel-core": "6.25.0",

diff --git a/src/components/autocomplete/Autocomplete.spec.js b/src/components/autocomplete/Autocomplete.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BAutocomplete from '@components/autocomplete/Autocomplete'
 
 describe('BAutocomplete', () => {
     it('is called', () => {
-        const wrapper = shallow(BAutocomplete)
+        const wrapper = shallowMount(BAutocomplete)
         expect(wrapper.name()).toBe('BAutocomplete')
         expect(wrapper.isVueInstance()).toBeTruthy()
     })

diff --git a/src/components/checkbox/Checkbox.spec.js b/src/components/checkbox/Checkbox.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BCheckbox from '@components/checkbox/Checkbox'
 
 describe('BCheckbox', () => {
     it('is called', () => {
-        const wrapper = shallow(BCheckbox)
+        const wrapper = shallowMount(BCheckbox)
         expect(wrapper.name()).toBe('BCheckbox')
         expect(wrapper.isVueInstance()).toBeTruthy()
     })

diff --git a/src/components/checkbox/CheckboxButton.spec.js b/src/components/checkbox/CheckboxButton.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BCheckboxButton from '@components/checkbox/CheckboxButton'
 
 describe('BCheckboxButton', () => {
     it('is called', () => {
-        const wrapper = shallow(BCheckboxButton)
+        const wrapper = shallowMount(BCheckboxButton)
         expect(wrapper.name()).toBe('BCheckboxButton')
         expect(wrapper.isVueInstance()).toBeTruthy()
     })

diff --git a/src/components/collapse/Collapse.spec.js b/src/components/collapse/Collapse.spec.js
@@ -1,22 +1,22 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BCollapse from '@components/collapse/Collapse'
 
 describe('BCollapse', () => {
     it('is called', () => {
-        const wrapper = shallow(BCollapse)
+        const wrapper = shallowMount(BCollapse)
         expect(wrapper.name()).toBe('BCollapse')
         expect(wrapper.isVueInstance()).toBeTruthy()
     })
 
     it('default props and vm', () => {
-        const wrapper = shallow(BCollapse)
+        const wrapper = shallowMount(BCollapse)
         expect(wrapper.props().open).toBe(true)
         expect(wrapper.props().animation).toBe('fade')
         expect(wrapper.vm.isOpen).toBe(true)
     })
 
     it('set default open prop', () => {
-        const wrapper = shallow(BCollapse, {
+        const wrapper = shallowMount(BCollapse, {
             propsData: {
                 open: false
             }
@@ -26,7 +26,7 @@ describe('BCollapse', () => {
     })
 
     it('call toggle method', async () => {
-        const wrapper = shallow(BCollapse, {
+        const wrapper = shallowMount(BCollapse, {
             propsData: {
                 open: false
             }
@@ -39,7 +39,7 @@ describe('BCollapse', () => {
     })
 
     it('emit a click event', () => {
-        const wrapper = shallow(BCollapse, {
+        const wrapper = shallowMount(BCollapse, {
             propsData: {
                 open: false
             }
@@ -55,7 +55,7 @@ describe('BCollapse', () => {
     })
 
     it('update open prop', () => {
-        const wrapper = shallow(BCollapse, {
+        const wrapper = shallowMount(BCollapse, {
             propsData: {
                 open: false
             }
@@ -68,7 +68,7 @@ describe('BCollapse', () => {
 
     it('should have trigger slot', () => {
         const triggerSlot = '<strong> Header </strong>'
-        const wrapper = shallow(BCollapse, {
+        const wrapper = shallowMount(BCollapse, {
             slots: {
                 trigger: triggerSlot
             }
@@ -78,7 +78,7 @@ describe('BCollapse', () => {
 
     it('should have default slot', () => {
         const slotDefault = '<div> Content </div>'
-        const wrapper = shallow(BCollapse, {
+        const wrapper = shallowMount(BCollapse, {
             slots: {
                 default: slotDefault
             }
@@ -87,7 +87,7 @@ describe('BCollapse', () => {
     })
 
     it('should emit open event', () => {
-        const wrapper = shallow(BCollapse, {
+        const wrapper = shallowMount(BCollapse, {
             propsData: {
                 open: false
             }
@@ -99,7 +99,7 @@ describe('BCollapse', () => {
     })
 
     it('should emit close event', () => {
-        const wrapper = shallow(BCollapse, {
+        const wrapper = shallowMount(BCollapse, {
             propsData: {
                 open: true
             }

diff --git a/src/components/datepicker/Datepicker.spec.js b/src/components/datepicker/Datepicker.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BDatepicker from '@components/datepicker/Datepicker'
 
 describe('BDatepicker', () => {
     it('is called', () => {
-        const wrapper = shallow(BDatepicker)
+        const wrapper = shallowMount(BDatepicker)
         expect(wrapper.name()).toBe('BDatepicker')
         expect(wrapper.isVueInstance()).toBeTruthy()
     })

diff --git a/src/components/datepicker/DatepickerTable.spec.js b/src/components/datepicker/DatepickerTable.spec.js
@@ -1,4 +1,4 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BDatepickerTable from '@components/datepicker/DatepickerTable'
 
 import config, {setOptions} from '@utils/config'
@@ -15,7 +15,7 @@ describe('BDatepickerTable', () => {
     })
 
     it('is called', () => {
-        const wrapper = shallow(BDatepickerTable, {
+        const wrapper = shallowMount(BDatepickerTable, {
             propsData: {
                 dayNames: config.defaultMonthNames,
                 monthNames: config.defaultMonthNames,

diff --git a/src/components/datepicker/DatepickerTableRow.spec.js b/src/components/datepicker/DatepickerTableRow.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BDatepickerTableRow from '@components/datepicker/DatepickerTableRow'
 
 describe('BDatepickerTableRow', () => {
     it('is called', () => {
-        const wrapper = shallow(BDatepickerTableRow, {
+        const wrapper = shallowMount(BDatepickerTableRow, {
             propsData: {
                 week: [
                     new Date('Sun Dec 31 2017 00:00:00 GMT-0200 (-02)'),

diff --git a/src/components/dialog/Dialog.spec.js b/src/components/dialog/Dialog.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BDialog from '@components/dialog/Dialog'
 
 describe('BDialog', () => {
     it('is called', () => {
-        const wrapper = shallow(BDialog, {
+        const wrapper = shallowMount(BDialog, {
             attachToDocument: true
         })
         expect(wrapper.name()).toBe('BDialog')

diff --git a/src/components/dialog/Dialog.vue b/src/components/dialog/Dialog.vue
@@ -180,7 +180,9 @@
         },
         beforeMount() {
             // Insert the Dialog component in body tag
-            document.body.appendChild(this.$el)
+            this.$nextTick(() => {
+                document.body.appendChild(this.$el)
+            })
         },
         mounted() {
             this.isActive = true

diff --git a/src/components/dropdown/Dropdown.spec.js b/src/components/dropdown/Dropdown.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BDropdown from '@components/dropdown/Dropdown'
 
 describe('BDropdown', () => {
     it('is called', () => {
-        const wrapper = shallow(BDropdown)
+        const wrapper = shallowMount(BDropdown)
         expect(wrapper.name()).toBe('BDropdown')
         expect(wrapper.isVueInstance()).toBeTruthy()
     })

diff --git a/src/components/field/Field.spec.js b/src/components/field/Field.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BField from '@components/field/Field'
 
 describe('BField', () => {
     it('is called', () => {
-        const wrapper = shallow(BField)
+        const wrapper = shallowMount(BField)
         expect(wrapper.name()).toBe('BField')
         expect(wrapper.isVueInstance()).toBeTruthy()
     })

diff --git a/src/components/field/FieldBody.spec.js b/src/components/field/FieldBody.spec.js
@@ -1,9 +1,9 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BFieldBody from '@components/field/FieldBody'
 
 describe('BFieldBody', () => {
     it('is called', () => {
-        const wrapper = shallow(BFieldBody, {
+        const wrapper = shallowMount(BFieldBody, {
             slots: {
                 default: 'content'
             }

diff --git a/src/components/icon/Icon.spec.js b/src/components/icon/Icon.spec.js
@@ -1,22 +1,22 @@
-import { shallow } from '@vue/test-utils'
+import { shallowMount } from '@vue/test-utils'
 import BIcon from '@components/icon/Icon'
 
 describe('BIcon', () => {
     it('render correctly', () => {
-        const wrapper = shallow(BIcon)
+        const wrapper = shallowMount(BIcon)
 
         expect(wrapper.html()).toMatchSnapshot()
     })
 
     it('is vue instance', () => {
-        const wrapper = shallow(BIcon)
+        const wrapper = shallowMount(BIcon)
 
         expect(wrapper.name()).toBe('BIcon')
         expect(wrapper.isVueInstance()).toBeTruthy()
     })
 
     it('render icon when icon property is passed', () => {
-        const wrapper = shallow(BIcon, {
+        const wrapper = shallowMount(BIcon, {
             propsData: { icon: 'eye' }
         })
 
@@ -25,7 +25,7 @@ describe('BIcon', () => {
     })
 
     it('render a colored icon when type is passed', () => {
-        const wrapper = shallow(BIcon, {
+        const wrapper = shallowMount(BIcon, {
             propsData: {
                 icon: 'eye',
                 type: 'is-primary'
@@ -36,7 +36,7 @@ describe('BIcon', () => {
     })
 
     it('render icon package correctly when the pack property is is passed.', () => {
-        const wrapper = shallow(BIcon, {
+        const wrapper = shallowMount(BIcon, {
             propsData: {
                 icon: 'eye',
                 pack: 'fa'
@@ -47,7 +47,7 @@ describe('BIcon', () => {
     })
 
     it('use both packages when the both property is is passed', () => {
-        const wrapper = shallow(BIcon, {
+        const wrapper = shallowMount(BIcon, {
             propsData: {
                 icon: 'eye',
                 both: true
@@ -85,7 +85,7 @@ describe('BIcon', () => {
     })
 
     it('display size when size propery is passed', () => {
-        const wrapper = shallow(BIcon, {
+        const wrapper = shallowMount(BIcon, {
             propsData: {
                 icon: 'eye'
             }
@@ -101,7 +101,7 @@ describe('BIcon', () => {
     })
 
     it('overrides icon font size when customSize property is passed', () => {
-        const wrapper = shallow(BIcon, {
+        const wrapper = shallowMount(BIcon, {
             propsData: {
                 icon: 'eye',
                 pack: 'fa',
@@ -113,7 +113,7 @@ describe('BIcon', () => {
     })
 
     it('render custom classes when customClass property is passed', () => {
-        const wrapper = shallow(BIcon, {
+        const wrapper = shallowMount(BIcon, {
             propsData: {
                 icon: 'eye',
                 customClass: 'foo-bar'