Skip to content

Commit

Permalink
fix(modal, tooltips, popovers): remove no longer needed nextTick de…
Browse files Browse the repository at this point in the history
…lay when updating content in transporter portal (closes #4589) (#4604)

* chore: remove nextTick delay in BootstrapVue transporter portal

* Update transporter.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update modal.spec.js

* Update transporter.js

Co-authored-by: Jacob Müller <jacob.mueller.elz@gmail.com>
  • Loading branch information
tmorehouse and jacobmllr95 committed Jan 13, 2020
1 parent 4f33e16 commit 0e3e7e0
Show file tree
Hide file tree
Showing 3 changed files with 18 additions and 30 deletions.
32 changes: 9 additions & 23 deletions src/components/modal/modal.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@ describe('modal', () => {
})

expect(wrapper.isVueInstance()).toBe(true)

await waitNT(wrapper.vm)

expect(wrapper.isEmpty()).toBe(true)
Expand All @@ -103,6 +104,7 @@ describe('modal', () => {
})

expect(wrapper.isVueInstance()).toBe(true)

await waitNT(wrapper.vm)

expect(wrapper.isEmpty()).toBe(true)
Expand All @@ -127,9 +129,6 @@ describe('modal', () => {
})

expect(wrapper.isVueInstance()).toBe(true)
await waitNT(wrapper.vm)
await waitRAF()
await waitNT(wrapper.vm)
await waitRAF()

// Main outer wrapper (has z-index, etc)... The stacker <div>
Expand Down Expand Up @@ -186,11 +185,6 @@ describe('modal', () => {
})

expect(wrapper.isVueInstance()).toBe(true)
await waitNT(wrapper.vm)
await waitRAF()
await waitNT(wrapper.vm)
await waitRAF()
await waitNT(wrapper.vm)
await waitRAF()

expect(wrapper.isEmpty()).toBe(true)
Expand All @@ -208,10 +202,6 @@ describe('modal', () => {
// Destroy modal
wrapper.destroy()

await waitNT(wrapper.vm)
await waitRAF()
await waitNT(wrapper.vm)
await waitRAF()
await waitNT(wrapper.vm)
await waitRAF()

Expand All @@ -235,10 +225,7 @@ describe('modal', () => {
})

expect(wrapper.isVueInstance()).toBe(true)
await waitNT(wrapper.vm)
await waitRAF()
await waitNT(wrapper.vm)
await waitRAF()

await waitNT(wrapper.vm)
await waitRAF()

Expand Down Expand Up @@ -268,8 +255,6 @@ describe('modal', () => {
await waitRAF()
await waitNT(wrapper.vm)
await waitRAF()
await waitNT(wrapper.vm)
await waitRAF()

expect($modal.attributes('aria-hidden')).toBeDefined()
expect($modal.attributes('aria-hidden')).toEqual('true')
Expand All @@ -293,7 +278,6 @@ describe('modal', () => {
})

expect(wrapper.isVueInstance()).toBe(true)
await waitNT(wrapper.vm)

// Modal title
const $title = wrapper.find('.modal-title')
Expand Down Expand Up @@ -441,6 +425,7 @@ describe('modal', () => {

// Try and close modal (but we prevent it)
$close.trigger('click')
await waitNT(wrapper.vm)
expect(trigger).toEqual('headerclose')
expect(evt).toBeInstanceOf(BvModalEvent)

Expand All @@ -457,6 +442,7 @@ describe('modal', () => {
trigger = null
evt = null
$close.trigger('click')
await waitNT(wrapper.vm)
expect(trigger).toEqual('headerclose')
expect(evt).toBeInstanceOf(BvModalEvent)

Expand Down Expand Up @@ -522,6 +508,7 @@ describe('modal', () => {

// Try and close modal (but we prevent it)
$ok.trigger('click')
await waitNT(wrapper.vm)
expect(trigger).toEqual('ok')

await waitNT(wrapper.vm)
Expand All @@ -536,6 +523,7 @@ describe('modal', () => {
cancelHide = false
trigger = null
$cancel.trigger('click')
await waitNT(wrapper.vm)
expect(trigger).toEqual('cancel')

await waitNT(wrapper.vm)
Expand Down Expand Up @@ -593,6 +581,7 @@ describe('modal', () => {

// Try and close modal via ESC
$modal.trigger('keydown.esc')
await waitNT(wrapper.vm)
expect(trigger).toEqual('esc')

await waitNT(wrapper.vm)
Expand Down Expand Up @@ -651,6 +640,7 @@ describe('modal', () => {

// Try and close modal via click out
$modal.trigger('click')
await waitNT(wrapper.vm)
expect(trigger).toEqual('backdrop')

await waitNT(wrapper.vm)
Expand Down Expand Up @@ -1211,14 +1201,12 @@ describe('modal', () => {
// Try and set focusin on external button
$button.trigger('focusin')
await waitNT(wrapper.vm)
await waitNT(wrapper.vm)
expect(document.activeElement).not.toBe($button.element)
expect(document.activeElement).toBe($content.element)

// Try and set focusin on external button
$button.trigger('focus')
await waitNT(wrapper.vm)
await waitNT(wrapper.vm)
expect(document.activeElement).not.toBe($button.element)
expect(document.activeElement).toBe($content.element)

Expand All @@ -1235,7 +1223,6 @@ describe('modal', () => {
$bottomTrap.trigger('focusin')
$bottomTrap.trigger('focus')
await waitNT(wrapper.vm)
await waitNT(wrapper.vm)
expect(document.activeElement).not.toBe($bottomTrap.element)
expect(document.activeElement).not.toBe($content.element)
// The close (x) button (first tabable in modal) should be focused
Expand All @@ -1254,7 +1241,6 @@ describe('modal', () => {
$topTrap.trigger('focusin')
$topTrap.trigger('focus')
await waitNT(wrapper.vm)
await waitNT(wrapper.vm)
expect(document.activeElement).not.toBe($topTrap.element)
expect(document.activeElement).not.toBe($bottomTrap.element)
expect(document.activeElement).not.toBe($content.element)
Expand Down
12 changes: 7 additions & 5 deletions src/utils/transporter.js
Original file line number Diff line number Diff line change
Expand Up @@ -95,11 +95,13 @@ export const BTransporterSingle = /*#__PURE__*/ Vue.extend({
this.mountTarget()
},
updated() {
// Placed in a nextTick to ensure that children have completed
// updating before rendering in the target
this.$nextTick(() => {
this.updateTarget()
})
// We need to make sure that all children have completed updating
// before rendering in the target
// `vue-simple-portal` has the this in a `$nextTick()`,
// while `portal-vue` doesn't
// Just trying to see if the `$nextTick()` delay is required or not
// Since all slots in Vue 2.6.x are always functions
this.updateTarget()
},
beforeDestroy() {
this.unmountTarget()
Expand Down
4 changes: 2 additions & 2 deletions src/utils/transporter.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ describe('utils/transporter component', () => {
})

expect(wrapper.isVueInstance()).toBe(true)
await waitNT(wrapper.vm)

await waitNT(wrapper.vm)

expect(wrapper.element.nodeType).toBe(Node.COMMENT_NODE)
Expand All @@ -54,7 +54,7 @@ describe('utils/transporter component', () => {
expect(target.parentElement).toBe(document.body)

wrapper.destroy()
await waitNT(wrapper.vm)

await waitNT(wrapper.vm)

expect(target.parentElement).toEqual(null)
Expand Down

0 comments on commit 0e3e7e0

Please sign in to comment.