Update modal.spec.js

tmorehouse · web-flow · commit d0c90b40ed9d · 2019-11-09T16:24:34.000-04:00
diff --git a/src/directives/modal/modal.spec.js b/src/directives/modal/modal.spec.js
@@ -26,6 +26,8 @@ describe('v-b-modal directive', () => {
 
     expect(wrapper.isVueInstance()).toBe(true)
     expect(wrapper.is('button')).toBe(true)
+    expect(wrapper.find('buttun').attributes('tabindex')).not.toBeDefined()
+    expect(wrapper.find('buttun').attributes('role')).not.toBeDefined()
     expect(spy).not.toHaveBeenCalled()
 
     const $button = wrapper.find('button')
@@ -36,6 +38,48 @@ describe('v-b-modal directive', () => {
     wrapper.destroy()
   })
 
+  it('works on links', async () => {
+    const localVue = new CreateLocalVue()
+    const spy = jest.fn()
+
+    const App = localVue.extend({
+      directives: {
+        bModal: VBModal
+      },
+      data() {
+        return {
+          text: 'link'
+        }
+      },
+      mounted() {
+        this.$root.$on(EVENT_SHOW, spy)
+      },
+      beforeDestroy() {
+        this.$root.$off(EVENT_SHOW, spy)
+      },
+      template: '<a href="#" v-b-modal.test>{{ text }}</a>'
+    })
+    const wrapper = mount(App, {
+      localVue: localVue
+    })
+
+    expect(wrapper.isVueInstance()).toBe(true)
+    expect(wrapper.is('a')).toBe(true)
+    expect(spy).not.toHaveBeenCalled()
+    expect(wrapper.find('a').attributes('role')).toBe('button')
+    expect(wrapper.find('a').attributes('tabindex')).not.toBeDefined()
+    expect(wrapper.find('a').text()).toBe('link')
+
+    const $link = wrapper.find('link')
+    $link.trigger('click')
+    expect(spy).toHaveBeenCalledTimes(1)
+    expect(spy).toBeCalledWith('test', $link.element)
+    expect(wrapper.find('a').attributes('role')).toBe('button')
+    expect(wrapper.find('a').attributes('tabindex')).not.toBeDefined()
+
+    wrapper.destroy()
+  })
+
   it('works on non-buttons', async () => {
     const localVue = new CreateLocalVue()
     const spy = jest.fn()
@@ -55,7 +99,7 @@ describe('v-b-modal directive', () => {
       beforeDestroy() {
         this.$root.$off(EVENT_SHOW, spy)
       },
-      template: '<span tabindex="0" v-b-modal.test>{{ text }}</span>'
+      template: '<span v-b-modal.test>{{ text }}</span>'
     })
     const wrapper = mount(App, {
       localVue: localVue
@@ -65,6 +109,7 @@ describe('v-b-modal directive', () => {
     expect(wrapper.is('span')).toBe(true)
     expect(spy).not.toHaveBeenCalled()
     expect(wrapper.find('span').attributes('role')).toBe('button')
+    expect(wrapper.find('span').attributes('tabindex')).toBe('0')
     expect(wrapper.find('span').text()).toBe('span')
 
     const $span = wrapper.find('span')
@@ -102,7 +147,7 @@ describe('v-b-modal directive', () => {
       beforeDestroy() {
         this.$root.$off(EVENT_SHOW, spy)
       },
-      template: '<span tabindex="0" v-b-modal.test>{{ text }}</span>'
+      template: '<span v-b-modal.test>{{ text }}</span>'
     })
     const wrapper = mount(App, {
       localVue: localVue
@@ -112,6 +157,7 @@ describe('v-b-modal directive', () => {
     expect(wrapper.is('span')).toBe(true)
     expect(spy).not.toHaveBeenCalled()
     expect(wrapper.find('span').attributes('role')).toBe('button')
+    expect(wrapper.find('span').attributes('tabindex')).toBe('0')
     expect(wrapper.find('span').text()).toBe('span')
 
     const $span = wrapper.find('span')
