diff --git a/packages/vuetify/src/components/VDialog/VDialog.ts b/packages/vuetify/src/components/VDialog/VDialog.ts index 0a0b3577905..9ce826197f2 100644 --- a/packages/vuetify/src/components/VDialog/VDialog.ts +++ b/packages/vuetify/src/components/VDialog/VDialog.ts @@ -276,7 +276,7 @@ export default baseMixins.extend({ class: this.contentClasses, attrs: { role: 'document', - tabindex: 0, + tabindex: this.isActive ? 0 : undefined, ...this.getScopeIdAttrs(), }, on: { diff --git a/packages/vuetify/src/components/VDialog/__tests__/VDialog.spec.ts b/packages/vuetify/src/components/VDialog/__tests__/VDialog.spec.ts index d488cbe5632..8de088b13d6 100644 --- a/packages/vuetify/src/components/VDialog/__tests__/VDialog.spec.ts +++ b/packages/vuetify/src/components/VDialog/__tests__/VDialog.spec.ts @@ -324,4 +324,18 @@ describe('VDialog.ts', () => { content.trigger('keydown.esc') expect(wrapper.vm.isActive).toBe(false) }) + + it('should only set tabindex if active', () => { + const wrapper = mountFunction() + + const content = wrapper.find('.v-dialog__content') + + expect(content.html()).toMatchSnapshot() + expect(content.element.tabIndex).toBe(-1) + + wrapper.setData({ isActive: true }) + + expect(content.element.tabIndex).toBe(0) + expect(content.html()).toMatchSnapshot() + }) }) diff --git a/packages/vuetify/src/components/VDialog/__tests__/__snapshots__/VDialog.spec.ts.snap b/packages/vuetify/src/components/VDialog/__tests__/__snapshots__/VDialog.spec.ts.snap index 4cd7c754762..1a78bb8d5b3 100644 --- a/packages/vuetify/src/components/VDialog/__tests__/__snapshots__/VDialog.spec.ts.snap +++ b/packages/vuetify/src/components/VDialog/__tests__/__snapshots__/VDialog.spec.ts.snap @@ -1,12 +1,36 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`VDialog.ts should only set tabindex if active 1`] = ` +