@dimailn/vuetify 2.7.2-alpha27 → 2.7.2-alpha28

package/src/components/VStepper/__tests__/VStepperStep.spec.ts

@@ -1,5 +1,3 @@
-import Vue from 'vue'
-
 // Components
 import VStepperStep from '../VStepperStep'
 
@@ -8,16 +6,9 @@ import {
   mount,
   Wrapper,
   MountOptions,
+  enableAutoUnmount,
 } from '@vue/test-utils'
 
-Vue.prototype.$vuetify = {
-  icons: {
-    values: {
-      complete: 'mdi-check',
-    },
-  },
-}
-
 const tip = '[Vuetify] The v-stepper-step component must be used inside a v-stepper'
 const warning = '[Vue warn]: Injection "stepClick" not found'
 
@@ -25,9 +16,29 @@ describe('VStepperStep.ts', () => {
   type Instance = InstanceType<typeof VStepperStep>
   let mountFunction: (options?: MountOptions<Instance>) => Wrapper<Instance>
 
+  enableAutoUnmount(afterEach)
+
   beforeEach(() => {
     mountFunction = (options = {}) => {
       return mount(VStepperStep, {
+        global: {
+          mocks: {
+            $vuetify: {
+              icons: {
+                values: {
+                  complete: 'mdi-check',
+                },
+              },
+            },
+          },
+          provide: {
+            stepClick: jest.fn(),
+            stepper: {
+              register: jest.fn(),
+              unregister: jest.fn(),
+            },
+          },
+        },
         ...options,
       })
     }
@@ -35,104 +46,103 @@ describe('VStepperStep.ts', () => {
 
   it('should accept a custom color', async () => {
     const wrapper = mountFunction({
-      attachToDocument: true,
-      propsData: {
+      attachTo: document.body,
+      props: {
         color: 'pink',
         complete: true,
       },
     })
 
     expect(wrapper.html()).toMatchSnapshot()
-    expect(warning).toHaveBeenWarned()
-    expect(tip).toHaveBeenTipped()
   })
 
   it('should accept a custom css color', async () => {
     const wrapper = mountFunction({
-      attachToDocument: true,
-      propsData: {
+      attachTo: document.body,
+      props: {
         color: '#aabbcc',
         complete: true,
       },
     })
 
     expect(wrapper.html()).toMatchSnapshot()
-    expect(warning).toHaveBeenWarned()
-    expect(tip).toHaveBeenTipped()
   })
 
   it('should emit event and invoke stepClick when clicked', async () => {
     const stepClick = jest.fn()
-    const click = jest.fn()
     const wrapper = mountFunction({
-      propsData: {
+      props: {
         editable: true,
       },
-      provide: {
-        stepClick,
+      global: {
+        provide: {
+          stepClick,
+          stepper: {
+            register: jest.fn(),
+            unregister: jest.fn(),
+          },
+        },
       },
     })
-    wrapper.vm.$on('click', click)
 
-    wrapper.find('.v-stepper__step').trigger('click')
-    expect(click).toHaveBeenCalledTimes(1)
+    await wrapper.find('.v-stepper__step--editable').trigger('click')
+    expect(wrapper.emitted('click')).toBeTruthy()
     expect(stepClick).toHaveBeenCalledWith(wrapper.vm.step)
-
-    expect(tip).toHaveBeenTipped()
   })
 
   it('should render', async () => {
     const wrapper = mountFunction({
-      propsData: {
+      props: {
         step: 1,
       },
     })
 
     expect(wrapper.html()).toMatchSnapshot()
-    expect(warning).toHaveBeenWarned()
-    expect(tip).toHaveBeenTipped()
   })
 
   it('should render complete step', async () => {
     const wrapper = mountFunction({
-      propsData: {
+      props: {
         complete: true,
       },
     })
 
     expect(wrapper.html()).toMatchSnapshot()
-    expect(warning).toHaveBeenWarned()
-    expect(tip).toHaveBeenTipped()
   })
 
   it('should render step with error', async () => {
     const wrapper = mountFunction({
-      computed: {
-        hasError: () => true,
+      props: {
+        rules: [() => 'Error message'],
+      },
+      global: {
+        provide: {
+          stepClick: jest.fn(),
+          stepper: {
+            register: jest.fn(),
+            unregister: jest.fn(),
+          },
+        },
       },
     })
 
     expect(wrapper.html()).toMatchSnapshot()
-    expect(warning).toHaveBeenWarned()
-    expect(tip).toHaveBeenTipped()
   })
 
   it('should render editable step', async () => {
     const wrapper = mountFunction({
-      propsData: {
+      props: {
         editable: true,
         complete: true,
       },
     })
 
     expect(wrapper.html()).toMatchSnapshot()
-    expect(warning).toHaveBeenWarned()
-    expect(tip).toHaveBeenTipped()
   })
 
   it('should toggle', async () => {
     const wrapper = mountFunction({
-      propsData: {
+      props: {
         step: 3,
       },
     })
@@ -148,8 +158,5 @@ describe('VStepperStep.ts', () => {
     wrapper.vm.toggle(5)
     expect(wrapper.vm.isActive).toBeFalsy()
     expect(wrapper.vm.isInactive).toBeFalsy()
-
-    expect(warning).toHaveBeenWarned()
-    expect(tip).toHaveBeenTipped()
   })
 })

package/src/components/VSwitch/__tests__/VSwitch.spec.ts

@@ -6,6 +6,7 @@ import {
   mount,
   MountOptions,
   Wrapper,
+  enableAutoUnmount,
 } from '@vue/test-utils'
 import { touch } from '../../../../test'
 
@@ -16,6 +17,8 @@ describe('VSwitch.ts', () => {
   type Instance = ExtractVue<typeof VSwitch>
   let mountFunction: (options?: MountOptions<Instance>) => Wrapper<Instance>
 
+  enableAutoUnmount(afterEach)
+
   beforeEach(() => {
     mountFunction = (options = {}) => {
       return mount(VSwitch, options)
@@ -24,17 +27,15 @@ describe('VSwitch.ts', () => {
 
   it('should set ripple data attribute based on ripple prop state', async () => {
     const wrapper = mountFunction({
-      propsData: {
-        inputValue: false,
+      props: {
+        modelValue: false,
         ripple: false,
       },
     })
 
-    expect(wrapper.findAll('.v-input--selection-controls__ripple').wrappers).toHaveLength(0)
-
-    wrapper.setProps({ ripple: true })
+    expect(wrapper.findAll('.v-input--selection-controls__ripple')).toHaveLength(0)
 
-    await wrapper.vm.$nextTick()
+    await wrapper.setProps({ ripple: true })
 
     const ripple = wrapper.find('.v-input--selection-controls__ripple')
 
@@ -44,69 +45,61 @@ describe('VSwitch.ts', () => {
 
   it('should emit change event on swipe', async () => {
     const wrapper = mountFunction({
-      propsData: {
-        inputValue: false,
+      props: {
+        modelValue: false,
       },
     })
 
-    const change = jest.fn()
-    wrapper.vm.$on('change', change)
     touch(wrapper.find('.v-input--selection-controls__ripple')).start(0, 0).end(20, 0)
-    expect(change).toHaveBeenCalledWith(true)
-    expect(change).toHaveBeenCalledTimes(1)
+    expect(wrapper.emitted('update:modelValue')).toBeTruthy()
+    expect(wrapper.emitted('update:modelValue')![0]).toEqual([true])
 
-    wrapper.setProps({ inputValue: true })
+    await wrapper.setProps({ modelValue: true })
     touch(wrapper.find('.v-input--selection-controls__ripple')).start(0, 0).end(-20, 0)
-    expect(change).toHaveBeenCalledWith(false)
-    expect(change).toHaveBeenCalledTimes(2)
+    expect(wrapper.emitted('update:modelValue')![1]).toEqual([false])
   })
 
   it('should emit change event on key events', async () => {
     const wrapper = mountFunction({
-      propsData: {
-        inputValue: false,
+      props: {
+        modelValue: false,
       },
     })
 
-    const change = jest.fn()
     const input = wrapper.find('input')
-    wrapper.vm.$on('change', change)
 
-    input.trigger('keydown.left')
-    expect(change).not.toHaveBeenCalled()
+    await input.trigger('keydown.left')
+    expect(wrapper.emitted('update:modelValue')).toBeFalsy()
 
-    input.trigger('keydown.right')
-    expect(change).toHaveBeenCalledWith(true)
-    expect(change).toHaveBeenCalledTimes(1)
+    await input.trigger('keydown.right')
+    expect(wrapper.emitted('update:modelValue')).toBeTruthy()
+    expect(wrapper.emitted('update:modelValue')![0]).toEqual([true])
 
-    input.trigger('keydown.right')
-    expect(change).toHaveBeenCalledTimes(1)
+    await input.trigger('keydown.right')
+    expect(wrapper.emitted('update:modelValue')).toHaveLength(1)
 
-    input.trigger('keydown.left')
-    expect(change).toHaveBeenCalledWith(false)
-    expect(change).toHaveBeenCalledTimes(2)
+    await input.trigger('keydown.left')
+    expect(wrapper.emitted('update:modelValue')![1]).toEqual([false])
   })
 
   it('should not emit change event on swipe when not active', async () => {
     const wrapper = mountFunction({
-      propsData: {
-        inputValue: false,
+      props: {
+        modelValue: false,
       },
     })
 
-    const change = jest.fn()
-    wrapper.vm.$on('change', change)
     touch(wrapper.find('.v-input--selection-controls__ripple')).start(0, 0).end(-20, 0)
-    expect(change).not.toHaveBeenCalled()
+    expect(wrapper.emitted('update:modelValue')).toBeFalsy()
 
-    wrapper.setProps({ inputValue: true })
+    await wrapper.setProps({ modelValue: true })
     touch(wrapper.find('.v-input--selection-controls__ripple')).start(0, 0).end(20, 0)
-    expect(change).not.toHaveBeenCalled()
+    expect(wrapper.emitted('update:modelValue')).toBeFalsy()
   })
 
   it('should render element with loader and match the snapshot', async () => {
     const wrapper = mountFunction({
-      propsData: {
+      props: {
         loading: true,
       },
     })

package/src/components/VTabs/__tests__/VTabs.spec.ts

@@ -36,13 +36,6 @@ describe('VTabs.ts', () => {
           config: {
             warnHandler: () => {}, // Подавляем предупреждения Vue
           },
-          directives: {
-            Resize: {
-              mounted: () => {},
-              updated: () => {},
-              unmounted: () => {},
-            },
-          },
           mocks: {
             $vuetify: {
               application: { left: 0, right: 0 },