@dimailn/vuetify 2.7.2-alpha35 → 2.7.2-alpha36

package/lib/mixins/proxyable/index.js

@@ -22,8 +22,11 @@ export function factory(prop = 'modelValue', event = 'update:modelValue') {
 
         set(val) {
           if (val === this.internalLazyValue) return;
-          this.internalLazyValue = val;
-          this.$emit(event, val);
+          this.internalLazyValue = val; // Don't emit events if component is being destroyed
+
+          if (!this._isDestroyed) {
+            this.$emit(event, val);
+          }
         }
 
       }

package/lib/mixins/proxyable/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/mixins/proxyable/index.ts"],"names":[],"mappings":"AAAA,SAAS,eAAT,QAAgD,KAAhD;AAQA,OAAM,SAAU,OAAV,CACJ,IAAI,GAAG,YADH,EAEJ,KAAK,GAAG,mBAFJ,EAEuB;AAE3B,SAAO,eAAe,CAAC;AACrB,IAAA,IAAI,EAAE,WADe;AAGrB,IAAA,KAAK,EAAE;AACL,OAAC,IAAD,GAAQ;AACN,QAAA,QAAQ,EAAE;AADJ;AADH,KAHc;;AASrB,IAAA,IAAI,GAAA;AACF,aAAO;AACL,QAAA,iBAAiB,EAAE,KAAK,IAAL;AADd,OAAP;AAGD,KAboB;;AAerB,IAAA,QAAQ,EAAE;AACR,MAAA,aAAa,EAAE;AACb,QAAA,GAAG,GAAA;AACD,iBAAO,KAAK,iBAAZ;AACD,SAHY;;AAIb,QAAA,GAAG,CAAE,GAAF,EAAU;AACX,cAAI,GAAG,KAAK,KAAK,iBAAjB,EAAoC;AAEpC,eAAK,iBAAL,GAAyB,GAAzB;AAEA,eAAK,KAAL,CAAW,KAAX,EAAkB,GAAlB;AACD;;AAVY;AADP,KAfW;AA8BrB,IAAA,KAAK,EAAE;AACL,OAAC,IAAD,EAAQ,GAAR,EAAW;AACT,aAAK,iBAAL,GAAyB,GAAzB;AACD;;AAHI;AA9Bc,GAAD,CAAtB;AAoCD;AAED;;AACA,MAAM,SAAS,GAAG,OAAO,EAAzB;AAEA,eAAe,SAAf","sourcesContent":["import { defineComponent, Component, App } from 'vue'\n\nexport type Proxyable<T extends string = 'value'> = Component<App & {\n  internalLazyValue: unknown\n  internalValue: unknown\n} & Record<T, any>>\n\nexport function factory<T extends string = 'value'> (prop?: T, event?: string): Proxyable<T>\nexport function factory (\n  prop = 'modelValue',\n  event = 'update:modelValue'\n) {\n  return defineComponent({\n    name: 'proxyable',\n\n    props: {\n      [prop]: {\n        required: false,\n      },\n    },\n\n    data () {\n      return {\n        internalLazyValue: this[prop] as unknown,\n      }\n    },\n\n    computed: {\n      internalValue: {\n        get (): unknown {\n          return this.internalLazyValue\n        },\n        set (val: any) {\n          if (val === this.internalLazyValue) return\n\n          this.internalLazyValue = val\n\n          this.$emit(event, val)\n        },\n      },\n    },\n\n    watch: {\n      [prop] (val) {\n        this.internalLazyValue = val\n      },\n    },\n  })\n}\n\n/* eslint-disable-next-line @typescript-eslint/no-redeclare */\nconst Proxyable = factory()\n\nexport default Proxyable\n"],"sourceRoot":"","file":"index.js"}
+{"version":3,"sources":["../../../src/mixins/proxyable/index.ts"],"names":[],"mappings":"AAAA,SAAS,eAAT,QAAgD,KAAhD;AAQA,OAAM,SAAU,OAAV,CACJ,IAAI,GAAG,YADH,EAEJ,KAAK,GAAG,mBAFJ,EAEuB;AAE3B,SAAO,eAAe,CAAC;AACrB,IAAA,IAAI,EAAE,WADe;AAGrB,IAAA,KAAK,EAAE;AACL,OAAC,IAAD,GAAQ;AACN,QAAA,QAAQ,EAAE;AADJ;AADH,KAHc;;AASrB,IAAA,IAAI,GAAA;AACF,aAAO;AACL,QAAA,iBAAiB,EAAE,KAAK,IAAL;AADd,OAAP;AAGD,KAboB;;AAerB,IAAA,QAAQ,EAAE;AACR,MAAA,aAAa,EAAE;AACb,QAAA,GAAG,GAAA;AACD,iBAAO,KAAK,iBAAZ;AACD,SAHY;;AAIb,QAAA,GAAG,CAAE,GAAF,EAAU;AACX,cAAI,GAAG,KAAK,KAAK,iBAAjB,EAAoC;AAEpC,eAAK,iBAAL,GAAyB,GAAzB,CAHW,CAKX;;AACA,cAAI,CAAE,KAAa,YAAnB,EAAiC;AAC/B,iBAAK,KAAL,CAAW,KAAX,EAAkB,GAAlB;AACD;AACF;;AAbY;AADP,KAfW;AAiCrB,IAAA,KAAK,EAAE;AACL,OAAC,IAAD,EAAQ,GAAR,EAAW;AACT,aAAK,iBAAL,GAAyB,GAAzB;AACD;;AAHI;AAjCc,GAAD,CAAtB;AAuCD;AAED;;AACA,MAAM,SAAS,GAAG,OAAO,EAAzB;AAEA,eAAe,SAAf","sourcesContent":["import { defineComponent, Component, App } from 'vue'\n\nexport type Proxyable<T extends string = 'value'> = Component<App & {\n  internalLazyValue: unknown\n  internalValue: unknown\n} & Record<T, any>>\n\nexport function factory<T extends string = 'value'> (prop?: T, event?: string): Proxyable<T>\nexport function factory (\n  prop = 'modelValue',\n  event = 'update:modelValue'\n) {\n  return defineComponent({\n    name: 'proxyable',\n\n    props: {\n      [prop]: {\n        required: false,\n      },\n    },\n\n    data () {\n      return {\n        internalLazyValue: this[prop] as unknown,\n      }\n    },\n\n    computed: {\n      internalValue: {\n        get (): unknown {\n          return this.internalLazyValue\n        },\n        set (val: any) {\n          if (val === this.internalLazyValue) return\n\n          this.internalLazyValue = val\n\n          // Don't emit events if component is being destroyed\n          if (!(this as any)._isDestroyed) {\n            this.$emit(event, val)\n          }\n        },\n      },\n    },\n\n    watch: {\n      [prop] (val) {\n        this.internalLazyValue = val\n      },\n    },\n  })\n}\n\n/* eslint-disable-next-line @typescript-eslint/no-redeclare */\nconst Proxyable = factory()\n\nexport default Proxyable\n"],"sourceRoot":"","file":"index.js"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dimailn/vuetify",
   "description": "Vue Material Component Framework",
-  "version": "2.7.2-alpha35",
+  "version": "2.7.2-alpha36",
   "author": {
     "name": "John Leider",
     "email": "john@vuetifyjs.com"

package/src/components/VBottomNavigation/VBottomNavigation.ts

@@ -1,4 +1,4 @@
-import {h} from 'vue'
+import {h, withDirectives} from 'vue'
 // Styles
 import './VBottomNavigation.sass'
 
@@ -153,16 +153,16 @@ export default mixins(
       onChange: this.updateValue
     })
 
-    if (this.canScroll) {
-      data.directives = data.directives || []
+    const vnode = h(ButtonGroup, this.setTextColor(this.color, data), getSlot(this))
 
-      data.directives.push({
-        arg: this.scrollTarget,
-        name: 'scroll',
-        value: this.onScroll,
-      })
+    if (this.canScroll) {
+      return withDirectives(vnode, [[
+        'scroll',
+        this.onScroll,
+        this.scrollTarget
+      ]])
     }
 
-    return h(ButtonGroup, this.setTextColor(this.color, data), getSlot(this))
+    return vnode
   },
 })

package/src/components/VBottomNavigation/__tests__/__snapshots__/VBottomNavigation.spec.ts.snap

@@ -36,7 +36,6 @@ Object {
 exports[`VBottomNavigation.ts should be visible with a true value 4`] = `
 <div class="v-item-group theme--light v-bottom-navigation"
      style="height: 56px; transform: translateY(100%);"
-     directives="[object Object]"
 >
   <button class="v-btn v-btn--is-elevated v-btn--has-bg theme--light v-size--default"
           type="button"

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

@@ -26,7 +26,7 @@ describe('VExpansionPanel', () => {
             VExpansionPanelHeader,
             {
               render: () => h(VExpansionPanelContent, {
-                props: { eager: true },
+                eager: true,
               }),
             },
           ],
@@ -113,7 +113,7 @@ describe('VExpansionPanel', () => {
         default: [
           {
             render: () => h(VExpansionPanelHeader, {
-              props: { hideActions: true },
+              hideActions: true,
             }),
           },
           VExpansionPanelContent,

package/src/components/VExpansionPanel/__tests__/__snapshots__/VExpansionPanel.spec.ts.snap

@@ -7,14 +7,7 @@ exports[`VExpansionPanel should hide actions and match snapshot 1`] = `
   <button class="v-expansion-panel-header"
           type="button"
           aria-expanded="false"
-          props="[object Object]"
   >
-    <div class="v-expansion-panel-header__icon">
-      <i class="v-icon notranslate theme--light mdi mdi-chevron-down"
-         aria-hidden="true"
-      >
-      </i>
-    </div>
   </button>
 </div>
 `;
@@ -34,5 +27,11 @@ exports[`VExpansionPanel should hide actions and match snapshot 2`] = `
       </i>
     </div>
   </button>
+  <div class="v-expansion-panel-content"
+       style="display: none;"
+  >
+    <div class="v-expansion-panel-content__wrap">
+    </div>
+  </div>
 </div>
 `;

package/src/components/VSelect/VSelect.ts

@@ -631,7 +631,7 @@ export default baseMixins.extend({
         parent: this,
         item,
         index,
-        select: (e: Event) => {
+        onSelect: (e: Event) => {
           e.stopPropagation()
           this.selectedIndex = index
         },

package/src/components/VSlideGroup/VSlideGroup.ts

@@ -1,4 +1,4 @@
-import {h, withDirectives} from 'vue'
+import { h, withDirectives } from 'vue'
 // Styles
 import './VSlideGroup.sass'
 
@@ -20,7 +20,7 @@ import Touch from '../../directives/touch'
 import mixins, { ExtractVue } from '../../util/mixins'
 
 // Types
-import Vue, { VNode, defineComponent } from 'vue'
+import { VNode, defineComponent } from 'vue'
 import { composedPath, getSlot } from '../../util/helpers'
 
 interface TouchEvent {
@@ -36,7 +36,7 @@ interface Widths {
   wrapper: number
 }
 
-interface options extends Vue {
+interface options {
   $refs: {
     content: HTMLElement
     wrapper: HTMLElement
@@ -107,7 +107,6 @@ export const BaseSlideGroup = mixins<options &
 ).extend({
   name: 'base-slide-group',
 
-
   props: {
     activeClass: {
       type: String,
@@ -257,7 +256,10 @@ export const BaseSlideGroup = mixins<options &
 
   methods: {
     onScroll () {
-      this.$refs.wrapper.scrollLeft = 0
+      const wrapper = this.$refs.wrapper as HTMLElement
+      if (wrapper) {
+        wrapper.scrollLeft = 0
+      }
     },
     onFocusin (e: FocusEvent) {
       if (!this.isOverflowing) return
@@ -301,7 +303,7 @@ export const BaseSlideGroup = mixins<options &
     },
     genData (): object {
       return {
-        class: this.classes
+        class: this.classes,
       }
     },
     genIcon (location: 'prev' | 'next'): VNode | null {
@@ -321,9 +323,9 @@ export const BaseSlideGroup = mixins<options &
         !hasAffix
       ) return null
 
-      return h(VIcon, () => ({
+      return h(VIcon, {
         disabled: !hasAffix,
-      }, (this as any)[`${icon}Icon`]))
+      }, (this as any)[`${icon}Icon`])
     },
     // Always generate prev for scrollable hint
     genPrev (): VNode | null {
@@ -340,7 +342,7 @@ export const BaseSlideGroup = mixins<options &
       }, [slot])
     },
     genTransition (location: 'prev' | 'next') {
-      return h(VFadeTransition, () => [this.genIcon(location)])
+      return h(VFadeTransition, {}, [this.genIcon(location)])
     },
     genWrapper (): VNode {
       return withDirectives(h('div', {
@@ -354,8 +356,8 @@ export const BaseSlideGroup = mixins<options &
             start: (e: TouchEvent) => this.overflowCheck(e, this.onTouchStart),
             move: (e: TouchEvent) => this.overflowCheck(e, this.onTouchMove),
             end: (e: TouchEvent) => this.overflowCheck(e, this.onTouchEnd),
-          }
-        ]
+          },
+        ],
 
       ])
     },
@@ -377,7 +379,9 @@ export const BaseSlideGroup = mixins<options &
       this.setWidths()
     },
     onTouchStart (e: TouchEvent) {
-      const { content } = this.$refs
+      const content = this.$refs.content as HTMLElement
+
+      if (!content) return
 
       this.startX = this.scrollOffset + e.touchstartX as number
 
@@ -406,7 +410,11 @@ export const BaseSlideGroup = mixins<options &
     onTouchEnd () {
       if (!this.canTouch) return
 
-      const { content, wrapper } = this.$refs
+      const content = this.$refs.content as HTMLElement
+      const wrapper = this.$refs.wrapper as HTMLElement
+
+      if (!content || !wrapper) return
+
       const maxScrollOffset = content.clientWidth - wrapper.clientWidth
 
       content.style.setProperty('transition', null)
@@ -439,7 +447,10 @@ export const BaseSlideGroup = mixins<options &
     scrollIntoView /* istanbul ignore next */ () {
       if (!this.selectedItem && this.items.length) {
         const lastItemPosition = this.items[this.items.length - 1].$el.getBoundingClientRect()
-        const wrapperPosition = this.$refs.wrapper.getBoundingClientRect()
+        const wrapper = this.$refs.wrapper as HTMLElement
+
+        if (!wrapper) return
+        const wrapperPosition = wrapper.getBoundingClientRect()
 
         if (
           (this.$vuetify.rtl && wrapperPosition.right < lastItemPosition.right) ||
@@ -484,11 +495,14 @@ export const BaseSlideGroup = mixins<options &
       window.requestAnimationFrame(() => {
         if (this._isDestroyed) return
 
-        const { content, wrapper } = this.$refs
+        const content = this.$refs.content as HTMLElement
+        const wrapper = this.$refs.wrapper as HTMLElement
+
+        if (!content || !wrapper) return
 
         this.widths = {
-          content: content ? content.clientWidth : 0,
-          wrapper: wrapper ? wrapper.clientWidth : 0,
+          content: content.clientWidth,
+          wrapper: wrapper.clientWidth,
         }
 
         // https://github.com/vuetifyjs/vuetify/issues/13212
@@ -509,8 +523,8 @@ export const BaseSlideGroup = mixins<options &
     ]), [
       [
         Resize,
-        this.onResize
-      ]
+        this.onResize,
+      ],
     ])
   },
 })

package/src/components/VStepper/VStepperContent.ts

@@ -149,18 +149,17 @@ export default baseMixins.extend({
       ref: 'wrapper',
     }
 
+    const wrapper = h('div', wrapperData, getSlot(this))
+    let content: VNode
+
     if (!this.isVertical) {
-      contentData.directives = [
-        [
-          vShow,
-          this.isActive,
-        ],
-      ]
+      content = withDirectives(h('div', contentData, [wrapper]), [
+        [vShow, this.isActive]
+      ])
+    } else {
+      content = h('div', contentData, [wrapper])
     }
 
-    const wrapper = h('div', wrapperData, getSlot(this))
-    const content = h('div', contentData, [wrapper])
-
     return h(this.computedTransition, {
       ...this.$listeners,
     }, () => [content])

package/src/components/VTextarea/VTextarea.ts

@@ -95,7 +95,7 @@ export default baseMixins.extend({
       input.tag = 'textarea'
       input.type = 'textarea'
       delete input.props.type
-      input.rows = this.rows
+      input.props.rows = this.rows
 
       return input
     },

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

@@ -221,4 +221,55 @@ describe('VTextarea.ts', () => {
 
     expect(wrapper.vm.$refs.input.style.height).toBe('150px')
   })
+
+  it('should render with default rows attribute', () => {
+    const wrapper = mountFunction()
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render with custom rows attribute', () => {
+    const wrapper = mountFunction({
+      props: {
+        rows: 3,
+      },
+    })
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render with rows as string', () => {
+    const wrapper = mountFunction({
+      props: {
+        rows: '10',
+      },
+    })
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should render with rows and autoGrow', () => {
+    const wrapper = mountFunction({
+      props: {
+        rows: 7,
+        autoGrow: true,
+      },
+    })
+    expect(wrapper.html()).toMatchSnapshot()
+  })
+
+  it('should have rows attribute in DOM', () => {
+    const wrapper = mountFunction({
+      props: {
+        rows: 8,
+      },
+    })
+
+    const textarea = wrapper.find('textarea')
+    expect(textarea.attributes('rows')).toBe('8')
+  })
+
+  it('should have default rows attribute in DOM', () => {
+    const wrapper = mountFunction()
+
+    const textarea = wrapper.find('textarea')
+    expect(textarea.attributes('rows')).toBe('5')
+  })
 })

package/src/components/VTextarea/__tests__/__snapshots__/VTextarea.spec.ts.snap

@@ -6,6 +6,7 @@ exports[`VTextarea.ts should calculate element height when using auto-grow prop
     <div class="v-input__slot">
       <div class="v-text-field__slot">
         <textarea id="input-1"
+                  rows="5"
                   value="this
 is
 a
@@ -34,3 +35,87 @@ maybe?"
   </div>
 </div>
 `;
+
+exports[`VTextarea.ts should render with custom rows attribute 1`] = `
+<div class="v-input v-textarea theme--light v-text-field">
+  <div class="v-input__control">
+    <div class="v-input__slot">
+      <div class="v-text-field__slot">
+        <textarea id="input-45"
+                  rows="3"
+        >
+        </textarea>
+      </div>
+    </div>
+    <div class="v-text-field__details">
+      <div class="v-messages theme--light">
+        <div class="v-messages__wrapper">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`VTextarea.ts should render with default rows attribute 1`] = `
+<div class="v-input v-textarea theme--light v-text-field">
+  <div class="v-input__control">
+    <div class="v-input__slot">
+      <div class="v-text-field__slot">
+        <textarea id="input-41"
+                  rows="5"
+        >
+        </textarea>
+      </div>
+    </div>
+    <div class="v-text-field__details">
+      <div class="v-messages theme--light">
+        <div class="v-messages__wrapper">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`VTextarea.ts should render with rows and autoGrow 1`] = `
+<div class="v-input v-textarea v-textarea--auto-grow v-textarea--no-resize theme--light v-text-field">
+  <div class="v-input__control">
+    <div class="v-input__slot">
+      <div class="v-text-field__slot">
+        <textarea id="input-53"
+                  rows="7"
+        >
+        </textarea>
+      </div>
+    </div>
+    <div class="v-text-field__details">
+      <div class="v-messages theme--light">
+        <div class="v-messages__wrapper">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`VTextarea.ts should render with rows as string 1`] = `
+<div class="v-input v-textarea theme--light v-text-field">
+  <div class="v-input__control">
+    <div class="v-input__slot">
+      <div class="v-text-field__slot">
+        <textarea id="input-49"
+                  rows="10"
+        >
+        </textarea>
+      </div>
+    </div>
+    <div class="v-text-field__details">
+      <div class="v-messages theme--light">
+        <div class="v-messages__wrapper">
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;

package/src/components/VTreeview/__tests__/VTreeviewNode.spec.ts

@@ -17,27 +17,9 @@ const defaultSlot = () => h('div', 'foobar')
 const Mock = defineComponent({
   name: 'test',
 
-  render() {
+  render () {
     return h(VTreeviewNode, {
-      slots: {
-        prepend: defaultSlot,
-        append: defaultSlot,
-      },
-    })
-  },
-})
-
-const MockScopedLabel = defineComponent({
-  name: 'test',
-
-  render() {
-    return h(VTreeviewNode, {
-      props: {
-        item: singleRootTwoChildren,
-      },
-      slots: {
-        label: (props: any) => h('div', [props.item.name.toUpperCase()]),
-      },
+      item: singleRootTwoChildren,
     })
   },
 })
@@ -85,14 +67,20 @@ describe('VTreeViewNode.ts', () => {
     expect(wrapper.vm.computedIcon).toBe('$checkboxOff')
 
     // В Vue 3 нужно использовать другой подход для изменения внутренних данных
-    wrapper.vm.isIndeterminate = true
-    await wrapper.vm.$nextTick()
+    await wrapper.setData({ isIndeterminate: true })
 
     expect(wrapper.vm.computedIcon).toBe('$checkboxIndeterminate')
   })
 
   it('should use scoped slots', () => {
-    const wrapper = mount(Mock, {
+    const wrapper = mount(VTreeviewNode, {
+      props: {
+        item: singleRootTwoChildren,
+      },
+      slots: {
+        prepend: defaultSlot,
+        append: defaultSlot,
+      },
       global: {
         provide: { treeview },
       },
@@ -110,7 +98,13 @@ describe('VTreeViewNode.ts', () => {
   })
 
   it('should use label slot', () => {
-    const wrapper = mount(MockScopedLabel, {
+    const wrapper = mount(VTreeviewNode, {
+      props: {
+        item: singleRootTwoChildren,
+      },
+      slots: {
+        label: (props: any) => h('div', [props.item.name.toUpperCase()]),
+      },
       global: {
         provide: { treeview },
       },
@@ -120,23 +114,14 @@ describe('VTreeViewNode.ts', () => {
   })
 
   it('should render disabled item', () => {
-    const TestComponent = defineComponent({
-      name: 'test',
-
-      render() {
-        return h(VTreeviewNode, {
-          slots: {
-            prepend: defaultSlot,
-            append: defaultSlot,
-          },
-          props: {
-            item: { ...singleRootTwoChildren, disabled: true },
-          },
-        })
+    const wrapper = mount(VTreeviewNode, {
+      props: {
+        item: { ...singleRootTwoChildren, disabled: true },
+      },
+      slots: {
+        prepend: defaultSlot,
+        append: defaultSlot,
       },
-    })
-
-    const wrapper = mount(TestComponent, {
       global: {
         provide: { treeview },
       },
@@ -146,7 +131,7 @@ describe('VTreeViewNode.ts', () => {
   })
 
   const singleRootWithEmptyChildrens = { id: 1, name: 'Child', children: [] }
-  it('should be able to have active children with empty array', () => {
+  it('should be able to have active children with empty array', async () => {
     const wrapper = mountFunction({
       props: {
         item: singleRootWithEmptyChildrens,
@@ -157,13 +142,13 @@ describe('VTreeViewNode.ts', () => {
 
     expect(wrapper.vm.isActive).toBe(false)
     const selectedLeaf = wrapper.find('.v-treeview-node__root')
-    selectedLeaf.trigger('click')
+    await selectedLeaf.trigger('click')
     expect(wrapper.vm.isActive).toBe(true)
 
     expect(wrapper.html()).toMatchSnapshot()
   })
 
-  it('should not be able to have active children with empty array when loadChildren is specified', () => {
+  it('should not be able to have active children with empty array when loadChildren is specified', async () => {
     const wrapper = mountFunction({
       props: {
         item: singleRootWithEmptyChildrens,
@@ -175,13 +160,13 @@ describe('VTreeViewNode.ts', () => {
 
     expect(wrapper.vm.isActive).toBe(false)
     const selectedLeaf = wrapper.find('.v-treeview-node__root')
-    selectedLeaf.trigger('click')
+    await selectedLeaf.trigger('click')
     expect(wrapper.vm.isActive).toBe(false)
 
     expect(wrapper.html()).toMatchSnapshot()
   })
 
-  it('should not be able to have active children with empty array when disabled', () => {
+  it('should not be able to have active children with empty array when disabled', async () => {
     const wrapper = mountFunction({
       props: {
         item: { ...singleRootWithEmptyChildrens, disabled: true },
@@ -192,7 +177,7 @@ describe('VTreeViewNode.ts', () => {
 
     expect(wrapper.vm.isActive).toBe(false)
     const selectedLeaf = wrapper.find('.v-treeview-node__root')
-    selectedLeaf.trigger('click')
+    await selectedLeaf.trigger('click')
     expect(wrapper.vm.isActive).toBe(false)
 
     expect(wrapper.html()).toMatchSnapshot()