From eb54e1a1ce9d0080a65eb7a8532503a399e506ee Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Thu, 14 Oct 2021 18:16:54 +0300 Subject: tests: tweak Jasmine's matchers usage Use: * toBeNull * toEqual * toBeTrue * toBeFalse * toHaveSize * toHaveClass --- js/tests/unit/modal.spec.js | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 613b0a0a1..dd501aa7b 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -234,12 +234,12 @@ describe('Modal', () => { modalEl.addEventListener('show.bs.modal', () => { setTimeout(() => { - expect(modal._isTransitioning).toEqual(true) + expect(modal._isTransitioning).toBeTrue() }) }) modalEl.addEventListener('shown.bs.modal', () => { - expect(modal._isTransitioning).toEqual(false) + expect(modal._isTransitioning).toBeFalse() done() }) @@ -474,7 +474,7 @@ describe('Modal', () => { const shownCallback = () => { setTimeout(() => { - expect(modal._isShown).toEqual(true) + expect(modal._isShown).toBeTrue() done() }, 10) } @@ -501,7 +501,7 @@ describe('Modal', () => { const shownCallback = () => { setTimeout(() => { - expect(modal._isShown).toEqual(true) + expect(modal._isShown).toBeTrue() done() }, 10) } @@ -529,7 +529,7 @@ describe('Modal', () => { const shownCallback = () => { setTimeout(() => { - expect(modal._isShown).toEqual(false) + expect(modal._isShown).toBeFalse() done() }, 10) } @@ -555,7 +555,7 @@ describe('Modal', () => { const shownCallback = () => { setTimeout(() => { - expect(modal._isShown).toEqual(true) + expect(modal._isShown).toBeTrue() done() }, 10) } @@ -719,7 +719,7 @@ describe('Modal', () => { const hideCallback = () => { setTimeout(() => { - expect(modal._isShown).toEqual(true) + expect(modal._isShown).toBeTrue() done() }, 10) } @@ -1026,7 +1026,7 @@ describe('Modal', () => { }) modalEl1.addEventListener('hidden.bs.modal', () => { expect(Modal.getInstance(modalEl2)).not.toBeNull() - expect(modalEl2.classList.contains('show')).toBeTrue() + expect(modalEl2).toHaveClass('show') done() }) modal1.show() @@ -1061,7 +1061,7 @@ describe('Modal', () => { const modal = Modal.getInstance(div) expect(modal).not.toBeNull() - expect(modal._config.keyboard).toBe(false) + expect(modal._config.keyboard).toBeFalse() }) it('should not re create a modal', () => { @@ -1161,7 +1161,7 @@ describe('Modal', () => { const div = fixtureEl.querySelector('div') - expect(Modal.getInstance(div)).toEqual(null) + expect(Modal.getInstance(div)).toBeNull() expect(Modal.getOrCreateInstance(div)).toBeInstanceOf(Modal) }) @@ -1170,13 +1170,13 @@ describe('Modal', () => { const div = fixtureEl.querySelector('div') - expect(Modal.getInstance(div)).toEqual(null) + expect(Modal.getInstance(div)).toBeNull() const modal = Modal.getOrCreateInstance(div, { backdrop: true }) expect(modal).toBeInstanceOf(Modal) - expect(modal._config.backdrop).toEqual(true) + expect(modal._config.backdrop).toBeTrue() }) it('should return the instance when exists without given configuration', () => { @@ -1194,7 +1194,7 @@ describe('Modal', () => { expect(modal).toBeInstanceOf(Modal) expect(modal2).toEqual(modal) - expect(modal2._config.backdrop).toEqual(true) + expect(modal2._config.backdrop).toBeTrue() }) }) }) -- cgit v1.2.3 From f8f9dc3b5cfda049f38eb069b1ee008a3a6dd704 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Fri, 26 Nov 2021 09:16:59 +0200 Subject: tests: remove extra spaces, unneeded arrays and add missing newlines --- js/tests/unit/modal.spec.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index dd501aa7b..5729942e5 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -57,9 +57,7 @@ describe('Modal', () => { describe('toggle', () => { it('should call ScrollBarHelper to handle scrollBar on body', done => { - fixtureEl.innerHTML = [ - '
' - ].join('') + fixtureEl.innerHTML = '
' spyOn(ScrollBarHelper.prototype, 'hide').and.callThrough() spyOn(ScrollBarHelper.prototype, 'reset').and.callThrough() -- cgit v1.2.3 From d8999dd5666336dcf6976cc65bc0d562a4baec5a Mon Sep 17 00:00:00 2001 From: Louis-Maxime Piton Date: Thu, 2 Dec 2021 11:01:11 +0100 Subject: Tests: Minor fixes (#35455) --- js/tests/unit/modal.spec.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 5729942e5..84a95c86a 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -277,8 +277,7 @@ describe('Modal', () => { fixtureEl.innerHTML = [ '', '' ].join('') @@ -303,8 +302,7 @@ describe('Modal', () => { it('should set .modal\'s scroll top to 0', done => { fixtureEl.innerHTML = [ '
', - '
', - '
', + '
', '
' ].join('') -- cgit v1.2.3 From aa650f0f1e30279f0868433a4afab9c3efa93b2c Mon Sep 17 00:00:00 2001 From: GeoSot Date: Sun, 30 Jan 2022 14:30:04 +0200 Subject: tests: replace 'done' callback with 'Promise' to fix deprecation errors (#35659) Reference: https://jasmine.github.io/tutorials/async 'DEPRECATION: An asynchronous function called its 'done' callback more than once. This is a bug in the spec, beforeAll, beforeEach, afterAll, or afterEach function in question. This will be treated as an error in a future version. See for more information. --- js/tests/unit/modal.spec.js | 1362 +++++++++++++++++++++++-------------------- 1 file changed, 714 insertions(+), 648 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 84a95c86a..bf796411b 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -56,93 +56,101 @@ describe('Modal', () => { }) describe('toggle', () => { - it('should call ScrollBarHelper to handle scrollBar on body', done => { - fixtureEl.innerHTML = '
' + it('should call ScrollBarHelper to handle scrollBar on body', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' + + spyOn(ScrollBarHelper.prototype, 'hide').and.callThrough() + spyOn(ScrollBarHelper.prototype, 'reset').and.callThrough() + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) + + modalEl.addEventListener('shown.bs.modal', () => { + expect(ScrollBarHelper.prototype.hide).toHaveBeenCalled() + modal.toggle() + }) - spyOn(ScrollBarHelper.prototype, 'hide').and.callThrough() - spyOn(ScrollBarHelper.prototype, 'reset').and.callThrough() - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(ScrollBarHelper.prototype.reset).toHaveBeenCalled() + resolve() + }) - modalEl.addEventListener('shown.bs.modal', () => { - expect(ScrollBarHelper.prototype.hide).toHaveBeenCalled() modal.toggle() }) - - modalEl.addEventListener('hidden.bs.modal', () => { - expect(ScrollBarHelper.prototype.reset).toHaveBeenCalled() - done() - }) - - modal.toggle() }) }) describe('show', () => { - it('should show a modal', done => { - fixtureEl.innerHTML = '
' + it('should show a modal', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - modalEl.addEventListener('show.bs.modal', event => { - expect(event).toBeDefined() - }) + modalEl.addEventListener('show.bs.modal', event => { + expect(event).toBeDefined() + }) - modalEl.addEventListener('shown.bs.modal', () => { - expect(modalEl.getAttribute('aria-modal')).toEqual('true') - expect(modalEl.getAttribute('role')).toEqual('dialog') - expect(modalEl.getAttribute('aria-hidden')).toBeNull() - expect(modalEl.style.display).toEqual('block') - expect(document.querySelector('.modal-backdrop')).not.toBeNull() - done() - }) + modalEl.addEventListener('shown.bs.modal', () => { + expect(modalEl.getAttribute('aria-modal')).toEqual('true') + expect(modalEl.getAttribute('role')).toEqual('dialog') + expect(modalEl.getAttribute('aria-hidden')).toBeNull() + expect(modalEl.style.display).toEqual('block') + expect(document.querySelector('.modal-backdrop')).not.toBeNull() + resolve() + }) - modal.show() + modal.show() + }) }) - it('should show a modal without backdrop', done => { - fixtureEl.innerHTML = '
' + it('should show a modal without backdrop', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl, { - backdrop: false - }) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl, { + backdrop: false + }) - modalEl.addEventListener('show.bs.modal', event => { - expect(event).toBeDefined() - }) + modalEl.addEventListener('show.bs.modal', event => { + expect(event).toBeDefined() + }) - modalEl.addEventListener('shown.bs.modal', () => { - expect(modalEl.getAttribute('aria-modal')).toEqual('true') - expect(modalEl.getAttribute('role')).toEqual('dialog') - expect(modalEl.getAttribute('aria-hidden')).toBeNull() - expect(modalEl.style.display).toEqual('block') - expect(document.querySelector('.modal-backdrop')).toBeNull() - done() - }) + modalEl.addEventListener('shown.bs.modal', () => { + expect(modalEl.getAttribute('aria-modal')).toEqual('true') + expect(modalEl.getAttribute('role')).toEqual('dialog') + expect(modalEl.getAttribute('aria-hidden')).toBeNull() + expect(modalEl.style.display).toEqual('block') + expect(document.querySelector('.modal-backdrop')).toBeNull() + resolve() + }) - modal.show() + modal.show() + }) }) - it('should show a modal and append the element', done => { - const modalEl = document.createElement('div') - const id = 'dynamicModal' + it('should show a modal and append the element', () => { + return new Promise(resolve => { + const modalEl = document.createElement('div') + const id = 'dynamicModal' - modalEl.setAttribute('id', id) - modalEl.classList.add('modal') - modalEl.innerHTML = '
' + modalEl.setAttribute('id', id) + modalEl.classList.add('modal') + modalEl.innerHTML = '
' - const modal = new Modal(modalEl) + const modal = new Modal(modalEl) - modalEl.addEventListener('shown.bs.modal', () => { - const dynamicModal = document.getElementById(id) - expect(dynamicModal).not.toBeNull() - dynamicModal.remove() - done() - }) + modalEl.addEventListener('shown.bs.modal', () => { + const dynamicModal = document.getElementById(id) + expect(dynamicModal).not.toBeNull() + dynamicModal.remove() + resolve() + }) - modal.show() + modal.show() + }) }) it('should do nothing if a modal is shown', () => { @@ -173,511 +181,551 @@ describe('Modal', () => { expect(EventHandler.trigger).not.toHaveBeenCalled() }) - it('should not fire shown event when show is prevented', done => { - fixtureEl.innerHTML = '
' + it('should not fire shown event when show is prevented', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - modalEl.addEventListener('show.bs.modal', event => { - event.preventDefault() + modalEl.addEventListener('show.bs.modal', event => { + event.preventDefault() - const expectedDone = () => { - expect().nothing() - done() - } + const expectedDone = () => { + expect().nothing() + resolve() + } - setTimeout(expectedDone, 10) - }) + setTimeout(expectedDone, 10) + }) - modalEl.addEventListener('shown.bs.modal', () => { - throw new Error('shown event triggered') - }) + modalEl.addEventListener('shown.bs.modal', () => { + throw new Error('shown event triggered') + }) - modal.show() + modal.show() + }) }) - it('should be shown after the first call to show() has been prevented while fading is enabled ', done => { - fixtureEl.innerHTML = '
' + it('should be shown after the first call to show() has been prevented while fading is enabled ', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - let prevented = false - modalEl.addEventListener('show.bs.modal', event => { - if (!prevented) { - event.preventDefault() - prevented = true + let prevented = false + modalEl.addEventListener('show.bs.modal', event => { + if (!prevented) { + event.preventDefault() + prevented = true - setTimeout(() => { - modal.show() - }) - } - }) + setTimeout(() => { + modal.show() + }) + } + }) - modalEl.addEventListener('shown.bs.modal', () => { - expect(prevented).toBeTrue() - expect(modal._isAnimated()).toBeTrue() - done() - }) + modalEl.addEventListener('shown.bs.modal', () => { + expect(prevented).toBeTrue() + expect(modal._isAnimated()).toBeTrue() + resolve() + }) - modal.show() + modal.show() + }) }) + it('should set is transitioning if fade class is present', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - it('should set is transitioning if fade class is present', done => { - fixtureEl.innerHTML = '
' + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + modalEl.addEventListener('show.bs.modal', () => { + setTimeout(() => { + expect(modal._isTransitioning).toBeTrue() + }) + }) - modalEl.addEventListener('show.bs.modal', () => { - setTimeout(() => { - expect(modal._isTransitioning).toBeTrue() + modalEl.addEventListener('shown.bs.modal', () => { + expect(modal._isTransitioning).toBeFalse() + resolve() }) - }) - modalEl.addEventListener('shown.bs.modal', () => { - expect(modal._isTransitioning).toBeFalse() - done() + modal.show() }) - - modal.show() }) - it('should close modal when a click occurred on data-bs-dismiss="modal" inside modal', done => { - fixtureEl.innerHTML = [ - '
', - '
', - '
', - ' ', - '
', - '
', - '
' - ].join('') - - const modalEl = fixtureEl.querySelector('.modal') - const btnClose = fixtureEl.querySelector('[data-bs-dismiss="modal"]') - const modal = new Modal(modalEl) - - spyOn(modal, 'hide').and.callThrough() + it('should close modal when a click occurred on data-bs-dismiss="modal" inside modal', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '
', + '
', + '
', + ' ', + '
', + '
', + '
' + ].join('') + + const modalEl = fixtureEl.querySelector('.modal') + const btnClose = fixtureEl.querySelector('[data-bs-dismiss="modal"]') + const modal = new Modal(modalEl) + + spyOn(modal, 'hide').and.callThrough() + + modalEl.addEventListener('shown.bs.modal', () => { + btnClose.click() + }) - modalEl.addEventListener('shown.bs.modal', () => { - btnClose.click() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(modal.hide).toHaveBeenCalled() + resolve() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(modal.hide).toHaveBeenCalled() - done() + modal.show() }) - - modal.show() }) - it('should close modal when a click occurred on a data-bs-dismiss="modal" with "bs-target" outside of modal element', done => { - fixtureEl.innerHTML = [ - '', - '' - ].join('') + it('should close modal when a click occurred on a data-bs-dismiss="modal" with "bs-target" outside of modal element', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '' + ].join('') - const modalEl = fixtureEl.querySelector('.modal') - const btnClose = fixtureEl.querySelector('[data-bs-dismiss="modal"]') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const btnClose = fixtureEl.querySelector('[data-bs-dismiss="modal"]') + const modal = new Modal(modalEl) - spyOn(modal, 'hide').and.callThrough() + spyOn(modal, 'hide').and.callThrough() - modalEl.addEventListener('shown.bs.modal', () => { - btnClose.click() - }) + modalEl.addEventListener('shown.bs.modal', () => { + btnClose.click() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(modal.hide).toHaveBeenCalled() - done() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(modal.hide).toHaveBeenCalled() + resolve() + }) - modal.show() + modal.show() + }) }) - it('should set .modal\'s scroll top to 0', done => { - fixtureEl.innerHTML = [ - '
', - '
', - '
' - ].join('') + it('should set .modal\'s scroll top to 0', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '
', + '
', + '
' + ].join('') - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - modalEl.addEventListener('shown.bs.modal', () => { - expect(modalEl.scrollTop).toEqual(0) - done() - }) + modalEl.addEventListener('shown.bs.modal', () => { + expect(modalEl.scrollTop).toEqual(0) + resolve() + }) - modal.show() + modal.show() + }) }) - it('should set modal body scroll top to 0 if modal body do not exists', done => { - fixtureEl.innerHTML = [ - '
', - '
', - '
', - '
', - '
' - ].join('') - - const modalEl = fixtureEl.querySelector('.modal') - const modalBody = modalEl.querySelector('.modal-body') - const modal = new Modal(modalEl) + it('should set modal body scroll top to 0 if modal body do not exists', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '
', + '
', + '
', + '
', + '
' + ].join('') + + const modalEl = fixtureEl.querySelector('.modal') + const modalBody = modalEl.querySelector('.modal-body') + const modal = new Modal(modalEl) + + modalEl.addEventListener('shown.bs.modal', () => { + expect(modalBody.scrollTop).toEqual(0) + resolve() + }) - modalEl.addEventListener('shown.bs.modal', () => { - expect(modalBody.scrollTop).toEqual(0) - done() + modal.show() }) - - modal.show() }) - it('should not trap focus if focus equal to false', done => { - fixtureEl.innerHTML = '
' + it('should not trap focus if focus equal to false', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl, { - focus: false - }) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl, { + focus: false + }) - spyOn(modal._focustrap, 'activate').and.callThrough() + spyOn(modal._focustrap, 'activate').and.callThrough() - modalEl.addEventListener('shown.bs.modal', () => { - expect(modal._focustrap.activate).not.toHaveBeenCalled() - done() - }) + modalEl.addEventListener('shown.bs.modal', () => { + expect(modal._focustrap.activate).not.toHaveBeenCalled() + resolve() + }) - modal.show() + modal.show() + }) }) - it('should add listener when escape touch is pressed', done => { - fixtureEl.innerHTML = '
' + it('should add listener when escape touch is pressed', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - spyOn(modal, 'hide').and.callThrough() + spyOn(modal, 'hide').and.callThrough() - modalEl.addEventListener('shown.bs.modal', () => { - const keydownEscape = createEvent('keydown') - keydownEscape.key = 'Escape' + modalEl.addEventListener('shown.bs.modal', () => { + const keydownEscape = createEvent('keydown') + keydownEscape.key = 'Escape' - modalEl.dispatchEvent(keydownEscape) - }) + modalEl.dispatchEvent(keydownEscape) + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(modal.hide).toHaveBeenCalled() - done() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(modal.hide).toHaveBeenCalled() + resolve() + }) - modal.show() + modal.show() + }) }) - it('should do nothing when the pressed key is not escape', done => { - fixtureEl.innerHTML = '
' + it('should do nothing when the pressed key is not escape', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - spyOn(modal, 'hide') + spyOn(modal, 'hide') - const expectDone = () => { - expect(modal.hide).not.toHaveBeenCalled() + const expectDone = () => { + expect(modal.hide).not.toHaveBeenCalled() - done() - } + resolve() + } - modalEl.addEventListener('shown.bs.modal', () => { - const keydownTab = createEvent('keydown') - keydownTab.key = 'Tab' + modalEl.addEventListener('shown.bs.modal', () => { + const keydownTab = createEvent('keydown') + keydownTab.key = 'Tab' - modalEl.dispatchEvent(keydownTab) - setTimeout(expectDone, 30) - }) + modalEl.dispatchEvent(keydownTab) + setTimeout(expectDone, 30) + }) - modal.show() + modal.show() + }) }) - it('should adjust dialog on resize', done => { - fixtureEl.innerHTML = '
' + it('should adjust dialog on resize', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) + + spyOn(modal, '_adjustDialog').and.callThrough() - spyOn(modal, '_adjustDialog').and.callThrough() + const expectDone = () => { + expect(modal._adjustDialog).toHaveBeenCalled() - const expectDone = () => { - expect(modal._adjustDialog).toHaveBeenCalled() + resolve() + } - done() - } + modalEl.addEventListener('shown.bs.modal', () => { + const resizeEvent = createEvent('resize') - modalEl.addEventListener('shown.bs.modal', () => { - const resizeEvent = createEvent('resize') + window.dispatchEvent(resizeEvent) + setTimeout(expectDone, 10) + }) - window.dispatchEvent(resizeEvent) - setTimeout(expectDone, 10) + modal.show() }) - - modal.show() }) - it('should not close modal when clicking on modal-content', done => { - fixtureEl.innerHTML = [ - '
', - '
', - '
', - '
', - '
' - ].join('') + it('should not close modal when clicking on modal-content', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '
', + '
', + '
', + '
', + '
' + ].join('') - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) - - const shownCallback = () => { - setTimeout(() => { - expect(modal._isShown).toEqual(true) - done() - }, 10) - } - - modalEl.addEventListener('shown.bs.modal', () => { - fixtureEl.querySelector('.modal-dialog').click() - fixtureEl.querySelector('.modal-content').click() - shownCallback() - }) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('Should not hide a modal') - }) + const shownCallback = () => { + setTimeout(() => { + expect(modal._isShown).toEqual(true) + resolve() + }, 10) + } - modal.show() - }) + modalEl.addEventListener('shown.bs.modal', () => { + fixtureEl.querySelector('.modal-dialog').click() + fixtureEl.querySelector('.modal-content').click() + shownCallback() + }) - it('should not close modal when clicking outside of modal-content if backdrop = false', done => { - fixtureEl.innerHTML = '
' + modalEl.addEventListener('hidden.bs.modal', () => { + throw new Error('Should not hide a modal') + }) - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl, { - backdrop: false + modal.show() }) + }) - const shownCallback = () => { - setTimeout(() => { - expect(modal._isShown).toBeTrue() - done() - }, 10) - } + it('should not close modal when clicking outside of modal-content if backdrop = false', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - modalEl.addEventListener('shown.bs.modal', () => { - modalEl.click() - shownCallback() - }) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl, { + backdrop: false + }) - modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('Should not hide a modal') - }) + const shownCallback = () => { + setTimeout(() => { + expect(modal._isShown).toBeTrue() + resolve() + }, 10) + } - modal.show() - }) + modalEl.addEventListener('shown.bs.modal', () => { + modalEl.click() + shownCallback() + }) - it('should not close modal when clicking outside of modal-content if backdrop = static', done => { - fixtureEl.innerHTML = '
' + modalEl.addEventListener('hidden.bs.modal', () => { + throw new Error('Should not hide a modal') + }) - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl, { - backdrop: 'static' + modal.show() }) + }) - const shownCallback = () => { - setTimeout(() => { - expect(modal._isShown).toBeTrue() - done() - }, 10) - } + it('should not close modal when clicking outside of modal-content if backdrop = static', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - modalEl.addEventListener('shown.bs.modal', () => { - modalEl.click() - shownCallback() - }) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl, { + backdrop: 'static' + }) - modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('Should not hide a modal') - }) + const shownCallback = () => { + setTimeout(() => { + expect(modal._isShown).toBeTrue() + resolve() + }, 10) + } - modal.show() - }) + modalEl.addEventListener('shown.bs.modal', () => { + modalEl.click() + shownCallback() + }) - it('should close modal when escape key is pressed with keyboard = true and backdrop is static', done => { - fixtureEl.innerHTML = '
' + modalEl.addEventListener('hidden.bs.modal', () => { + throw new Error('Should not hide a modal') + }) - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl, { - backdrop: 'static', - keyboard: true + modal.show() }) + }) + it('should close modal when escape key is pressed with keyboard = true and backdrop is static', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' + + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl, { + backdrop: 'static', + keyboard: true + }) - const shownCallback = () => { - setTimeout(() => { - expect(modal._isShown).toBeFalse() - done() - }, 10) - } + const shownCallback = () => { + setTimeout(() => { + expect(modal._isShown).toBeFalse() + resolve() + }, 10) + } - modalEl.addEventListener('shown.bs.modal', () => { - const keydownEscape = createEvent('keydown') - keydownEscape.key = 'Escape' + modalEl.addEventListener('shown.bs.modal', () => { + const keydownEscape = createEvent('keydown') + keydownEscape.key = 'Escape' - modalEl.dispatchEvent(keydownEscape) - shownCallback() - }) + modalEl.dispatchEvent(keydownEscape) + shownCallback() + }) - modal.show() + modal.show() + }) }) - it('should not close modal when escape key is pressed with keyboard = false', done => { - fixtureEl.innerHTML = '
' + it('should not close modal when escape key is pressed with keyboard = false', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl, { - keyboard: false - }) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl, { + keyboard: false + }) - const shownCallback = () => { - setTimeout(() => { - expect(modal._isShown).toBeTrue() - done() - }, 10) - } + const shownCallback = () => { + setTimeout(() => { + expect(modal._isShown).toBeTrue() + resolve() + }, 10) + } - modalEl.addEventListener('shown.bs.modal', () => { - const keydownEscape = createEvent('keydown') - keydownEscape.key = 'Escape' + modalEl.addEventListener('shown.bs.modal', () => { + const keydownEscape = createEvent('keydown') + keydownEscape.key = 'Escape' - modalEl.dispatchEvent(keydownEscape) - shownCallback() - }) + modalEl.dispatchEvent(keydownEscape) + shownCallback() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('Should not hide a modal') - }) + modalEl.addEventListener('hidden.bs.modal', () => { + throw new Error('Should not hide a modal') + }) - modal.show() + modal.show() + }) }) - it('should not overflow when clicking outside of modal-content if backdrop = static', done => { - fixtureEl.innerHTML = '
' + it('should not overflow when clicking outside of modal-content if backdrop = static', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl, { - backdrop: 'static' - }) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl, { + backdrop: 'static' + }) - modalEl.addEventListener('shown.bs.modal', () => { - modalEl.click() - setTimeout(() => { - expect(modalEl.clientHeight).toEqual(modalEl.scrollHeight) - done() - }, 20) - }) + modalEl.addEventListener('shown.bs.modal', () => { + modalEl.click() + setTimeout(() => { + expect(modalEl.clientHeight).toEqual(modalEl.scrollHeight) + resolve() + }, 20) + }) - modal.show() + modal.show() + }) }) - it('should not queue multiple callbacks when clicking outside of modal-content and backdrop = static', done => { - fixtureEl.innerHTML = '
' + it('should not queue multiple callbacks when clicking outside of modal-content and backdrop = static', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl, { - backdrop: 'static' - }) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl, { + backdrop: 'static' + }) - modalEl.addEventListener('shown.bs.modal', () => { - const spy = spyOn(modal, '_queueCallback').and.callThrough() + modalEl.addEventListener('shown.bs.modal', () => { + const spy = spyOn(modal, '_queueCallback').and.callThrough() - modalEl.click() - modalEl.click() + modalEl.click() + modalEl.click() - setTimeout(() => { - expect(spy).toHaveBeenCalledTimes(1) - done() - }, 20) - }) + setTimeout(() => { + expect(spy).toHaveBeenCalledTimes(1) + resolve() + }, 20) + }) - modal.show() + modal.show() + }) }) - it('should trap focus', done => { - fixtureEl.innerHTML = '
' + it('should trap focus', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - spyOn(modal._focustrap, 'activate').and.callThrough() + spyOn(modal._focustrap, 'activate').and.callThrough() - modalEl.addEventListener('shown.bs.modal', () => { - expect(modal._focustrap.activate).toHaveBeenCalled() - done() - }) + modalEl.addEventListener('shown.bs.modal', () => { + expect(modal._focustrap.activate).toHaveBeenCalled() + resolve() + }) - modal.show() + modal.show() + }) }) }) describe('hide', () => { - it('should hide a modal', done => { - fixtureEl.innerHTML = '
' + it('should hide a modal', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) - const backdropSpy = spyOn(modal._backdrop, 'hide').and.callThrough() + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) + const backdropSpy = spyOn(modal._backdrop, 'hide').and.callThrough() - modalEl.addEventListener('shown.bs.modal', () => { - modal.hide() - }) + modalEl.addEventListener('shown.bs.modal', () => { + modal.hide() + }) - modalEl.addEventListener('hide.bs.modal', event => { - expect(event).toBeDefined() - }) + modalEl.addEventListener('hide.bs.modal', event => { + expect(event).toBeDefined() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(modalEl.getAttribute('aria-modal')).toBeNull() - expect(modalEl.getAttribute('role')).toBeNull() - expect(modalEl.getAttribute('aria-hidden')).toEqual('true') - expect(modalEl.style.display).toEqual('none') - expect(backdropSpy).toHaveBeenCalled() - done() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(modalEl.getAttribute('aria-modal')).toBeNull() + expect(modalEl.getAttribute('role')).toBeNull() + expect(modalEl.getAttribute('aria-hidden')).toEqual('true') + expect(modalEl.style.display).toEqual('none') + expect(backdropSpy).toHaveBeenCalled() + resolve() + }) - modal.show() + modal.show() + }) }) - it('should close modal when clicking outside of modal-content', done => { - fixtureEl.innerHTML = '
' + it('should close modal when clicking outside of modal-content', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - modalEl.addEventListener('shown.bs.modal', () => { - modalEl.click() - }) + modalEl.addEventListener('shown.bs.modal', () => { + modalEl.click() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(modalEl.getAttribute('aria-modal')).toBeNull() - expect(modalEl.getAttribute('role')).toBeNull() - expect(modalEl.getAttribute('aria-hidden')).toEqual('true') - expect(modalEl.style.display).toEqual('none') - expect(document.querySelector('.modal-backdrop')).toBeNull() - done() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(modalEl.getAttribute('aria-modal')).toBeNull() + expect(modalEl.getAttribute('role')).toBeNull() + expect(modalEl.getAttribute('aria-hidden')).toEqual('true') + expect(modalEl.style.display).toEqual('none') + expect(document.querySelector('.modal-backdrop')).toBeNull() + resolve() + }) - modal.show() + modal.show() + }) }) it('should do nothing is the modal is not shown', () => { @@ -703,52 +751,56 @@ describe('Modal', () => { expect().nothing() }) - it('should not hide a modal if hide is prevented', done => { - fixtureEl.innerHTML = '
' + it('should not hide a modal if hide is prevented', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) - modalEl.addEventListener('shown.bs.modal', () => { - modal.hide() - }) + modalEl.addEventListener('shown.bs.modal', () => { + modal.hide() + }) - const hideCallback = () => { - setTimeout(() => { - expect(modal._isShown).toBeTrue() - done() - }, 10) - } + const hideCallback = () => { + setTimeout(() => { + expect(modal._isShown).toBeTrue() + resolve() + }, 10) + } - modalEl.addEventListener('hide.bs.modal', event => { - event.preventDefault() - hideCallback() - }) + modalEl.addEventListener('hide.bs.modal', event => { + event.preventDefault() + hideCallback() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('should not trigger hidden') - }) + modalEl.addEventListener('hidden.bs.modal', () => { + throw new Error('should not trigger hidden') + }) - modal.show() + modal.show() + }) }) - it('should release focus trap', done => { - fixtureEl.innerHTML = '
' + it('should release focus trap', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = '
' - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) - spyOn(modal._focustrap, 'deactivate').and.callThrough() + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) + spyOn(modal._focustrap, 'deactivate').and.callThrough() - modalEl.addEventListener('shown.bs.modal', () => { - modal.hide() - }) + modalEl.addEventListener('shown.bs.modal', () => { + modal.hide() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(modal._focustrap.deactivate).toHaveBeenCalled() - done() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(modal._focustrap.deactivate).toHaveBeenCalled() + resolve() + }) - modal.show() + modal.show() + }) }) }) @@ -789,246 +841,260 @@ describe('Modal', () => { }) describe('data-api', () => { - it('should toggle modal', done => { - fixtureEl.innerHTML = [ - '', - '' - ].join('') + it('should toggle modal', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '' + ].join('') + + const modalEl = fixtureEl.querySelector('.modal') + const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') + + modalEl.addEventListener('shown.bs.modal', () => { + expect(modalEl.getAttribute('aria-modal')).toEqual('true') + expect(modalEl.getAttribute('role')).toEqual('dialog') + expect(modalEl.getAttribute('aria-hidden')).toBeNull() + expect(modalEl.style.display).toEqual('block') + expect(document.querySelector('.modal-backdrop')).not.toBeNull() + setTimeout(() => trigger.click(), 10) + }) - const modalEl = fixtureEl.querySelector('.modal') - const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - - modalEl.addEventListener('shown.bs.modal', () => { - expect(modalEl.getAttribute('aria-modal')).toEqual('true') - expect(modalEl.getAttribute('role')).toEqual('dialog') - expect(modalEl.getAttribute('aria-hidden')).toBeNull() - expect(modalEl.style.display).toEqual('block') - expect(document.querySelector('.modal-backdrop')).not.toBeNull() - setTimeout(() => trigger.click(), 10) - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(modalEl.getAttribute('aria-modal')).toBeNull() + expect(modalEl.getAttribute('role')).toBeNull() + expect(modalEl.getAttribute('aria-hidden')).toEqual('true') + expect(modalEl.style.display).toEqual('none') + expect(document.querySelector('.modal-backdrop')).toBeNull() + resolve() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(modalEl.getAttribute('aria-modal')).toBeNull() - expect(modalEl.getAttribute('role')).toBeNull() - expect(modalEl.getAttribute('aria-hidden')).toEqual('true') - expect(modalEl.style.display).toEqual('none') - expect(document.querySelector('.modal-backdrop')).toBeNull() - done() + trigger.click() }) - - trigger.click() }) - it('should not recreate a new modal', done => { - fixtureEl.innerHTML = [ - '', - '' - ].join('') + it('should not recreate a new modal', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '' + ].join('') - const modalEl = fixtureEl.querySelector('.modal') - const modal = new Modal(modalEl) - const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') + const modalEl = fixtureEl.querySelector('.modal') + const modal = new Modal(modalEl) + const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - spyOn(modal, 'show').and.callThrough() + spyOn(modal, 'show').and.callThrough() - modalEl.addEventListener('shown.bs.modal', () => { - expect(modal.show).toHaveBeenCalled() - done() - }) + modalEl.addEventListener('shown.bs.modal', () => { + expect(modal.show).toHaveBeenCalled() + resolve() + }) - trigger.click() + trigger.click() + }) }) - it('should prevent default when the trigger is or ', done => { - fixtureEl.innerHTML = [ - '', - '' - ].join('') + it('should prevent default when the trigger is or ', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '' + ].join('') + + const modalEl = fixtureEl.querySelector('.modal') + const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') + + spyOn(Event.prototype, 'preventDefault').and.callThrough() + + modalEl.addEventListener('shown.bs.modal', () => { + expect(modalEl.getAttribute('aria-modal')).toEqual('true') + expect(modalEl.getAttribute('role')).toEqual('dialog') + expect(modalEl.getAttribute('aria-hidden')).toBeNull() + expect(modalEl.style.display).toEqual('block') + expect(document.querySelector('.modal-backdrop')).not.toBeNull() + expect(Event.prototype.preventDefault).toHaveBeenCalled() + resolve() + }) - const modalEl = fixtureEl.querySelector('.modal') - const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - - spyOn(Event.prototype, 'preventDefault').and.callThrough() - - modalEl.addEventListener('shown.bs.modal', () => { - expect(modalEl.getAttribute('aria-modal')).toEqual('true') - expect(modalEl.getAttribute('role')).toEqual('dialog') - expect(modalEl.getAttribute('aria-hidden')).toBeNull() - expect(modalEl.style.display).toEqual('block') - expect(document.querySelector('.modal-backdrop')).not.toBeNull() - expect(Event.prototype.preventDefault).toHaveBeenCalled() - done() + trigger.click() }) - - trigger.click() }) - it('should focus the trigger on hide', done => { - fixtureEl.innerHTML = [ - '', - '' - ].join('') + it('should focus the trigger on hide', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '' + ].join('') - const modalEl = fixtureEl.querySelector('.modal') - const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') + const modalEl = fixtureEl.querySelector('.modal') + const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - spyOn(trigger, 'focus') + spyOn(trigger, 'focus') - modalEl.addEventListener('shown.bs.modal', () => { - const modal = Modal.getInstance(modalEl) + modalEl.addEventListener('shown.bs.modal', () => { + const modal = Modal.getInstance(modalEl) - modal.hide() - }) + modal.hide() + }) - const hideListener = () => { - setTimeout(() => { - expect(trigger.focus).toHaveBeenCalled() - done() - }, 20) - } + const hideListener = () => { + setTimeout(() => { + expect(trigger.focus).toHaveBeenCalled() + resolve() + }, 20) + } - modalEl.addEventListener('hidden.bs.modal', () => { - hideListener() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + hideListener() + }) - trigger.click() + trigger.click() + }) }) + it('should not prevent default when a click occurred on data-bs-dismiss="modal" where tagName is DIFFERENT than or ', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '
', + '
', + ' ', + '
', + '
' + ].join('') + + const modalEl = fixtureEl.querySelector('.modal') + const btnClose = fixtureEl.querySelector('button[data-bs-dismiss="modal"]') + const modal = new Modal(modalEl) + + spyOn(Event.prototype, 'preventDefault').and.callThrough() + + modalEl.addEventListener('shown.bs.modal', () => { + btnClose.click() + }) - it('should not prevent default when a click occurred on data-bs-dismiss="modal" where tagName is DIFFERENT than or ', done => { - fixtureEl.innerHTML = [ - '
', - '
', - ' ', - '
', - '
' - ].join('') - - const modalEl = fixtureEl.querySelector('.modal') - const btnClose = fixtureEl.querySelector('button[data-bs-dismiss="modal"]') - const modal = new Modal(modalEl) - - spyOn(Event.prototype, 'preventDefault').and.callThrough() - - modalEl.addEventListener('shown.bs.modal', () => { - btnClose.click() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(Event.prototype.preventDefault).not.toHaveBeenCalled() + resolve() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(Event.prototype.preventDefault).not.toHaveBeenCalled() - done() + modal.show() }) - - modal.show() }) - it('should prevent default when a click occurred on data-bs-dismiss="modal" where tagName is or ', done => { - fixtureEl.innerHTML = [ - '
', - '
', - ' ', - '
', - '
' - ].join('') + it('should prevent default when a click occurred on data-bs-dismiss="modal" where tagName is or ', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '
', + '
', + ' ', + '
', + '
' + ].join('') - const modalEl = fixtureEl.querySelector('.modal') - const btnClose = fixtureEl.querySelector('a[data-bs-dismiss="modal"]') - const modal = new Modal(modalEl) + const modalEl = fixtureEl.querySelector('.modal') + const btnClose = fixtureEl.querySelector('a[data-bs-dismiss="modal"]') + const modal = new Modal(modalEl) - spyOn(Event.prototype, 'preventDefault').and.callThrough() + spyOn(Event.prototype, 'preventDefault').and.callThrough() - modalEl.addEventListener('shown.bs.modal', () => { - btnClose.click() - }) + modalEl.addEventListener('shown.bs.modal', () => { + btnClose.click() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - expect(Event.prototype.preventDefault).toHaveBeenCalled() - done() - }) + modalEl.addEventListener('hidden.bs.modal', () => { + expect(Event.prototype.preventDefault).toHaveBeenCalled() + resolve() + }) - modal.show() + modal.show() + }) }) + it('should not focus the trigger if the modal is not visible', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '' + ].join('') - it('should not focus the trigger if the modal is not visible', done => { - fixtureEl.innerHTML = [ - '', - '' - ].join('') + const modalEl = fixtureEl.querySelector('.modal') + const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - const modalEl = fixtureEl.querySelector('.modal') - const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') + spyOn(trigger, 'focus') - spyOn(trigger, 'focus') + modalEl.addEventListener('shown.bs.modal', () => { + const modal = Modal.getInstance(modalEl) - modalEl.addEventListener('shown.bs.modal', () => { - const modal = Modal.getInstance(modalEl) + modal.hide() + }) - modal.hide() - }) + const hideListener = () => { + setTimeout(() => { + expect(trigger.focus).not.toHaveBeenCalled() + resolve() + }, 20) + } - const hideListener = () => { - setTimeout(() => { - expect(trigger.focus).not.toHaveBeenCalled() - done() - }, 20) - } + modalEl.addEventListener('hidden.bs.modal', () => { + hideListener() + }) - modalEl.addEventListener('hidden.bs.modal', () => { - hideListener() + trigger.click() }) - - trigger.click() }) + it('should not focus the trigger if the modal is not shown', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '' + ].join('') - it('should not focus the trigger if the modal is not shown', done => { - fixtureEl.innerHTML = [ - '', - '' - ].join('') + const modalEl = fixtureEl.querySelector('.modal') + const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - const modalEl = fixtureEl.querySelector('.modal') - const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') + spyOn(trigger, 'focus') - spyOn(trigger, 'focus') + const showListener = () => { + setTimeout(() => { + expect(trigger.focus).not.toHaveBeenCalled() + resolve() + }, 10) + } - const showListener = () => { - setTimeout(() => { - expect(trigger.focus).not.toHaveBeenCalled() - done() - }, 10) - } + modalEl.addEventListener('show.bs.modal', event => { + event.preventDefault() + showListener() + }) - modalEl.addEventListener('show.bs.modal', event => { - event.preventDefault() - showListener() + trigger.click() }) - - trigger.click() }) - it('should call hide first, if another modal is open', done => { - fixtureEl.innerHTML = [ - '', - '', - '' - ].join('') - - const trigger2 = fixtureEl.querySelector('button') - const modalEl1 = document.querySelector('#modal1') - const modalEl2 = document.querySelector('#modal2') - const modal1 = new Modal(modalEl1) - - modalEl1.addEventListener('shown.bs.modal', () => { - trigger2.click() - }) - modalEl1.addEventListener('hidden.bs.modal', () => { - expect(Modal.getInstance(modalEl2)).not.toBeNull() - expect(modalEl2).toHaveClass('show') - done() + it('should call hide first, if another modal is open', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '', + '' + ].join('') + + const trigger2 = fixtureEl.querySelector('button') + const modalEl1 = document.querySelector('#modal1') + const modalEl2 = document.querySelector('#modal2') + const modal1 = new Modal(modalEl1) + + modalEl1.addEventListener('shown.bs.modal', () => { + trigger2.click() + }) + modalEl1.addEventListener('hidden.bs.modal', () => { + expect(Modal.getInstance(modalEl2)).not.toBeNull() + expect(modalEl2).toHaveClass('show') + resolve() + }) + modal1.show() }) - modal1.show() }) }) - describe('jQueryInterface', () => { it('should create a modal', () => { fixtureEl.innerHTML = '
' -- cgit v1.2.3 From 28c9002573e6cb6982697e50e1d1ebfe2ae0fc4c Mon Sep 17 00:00:00 2001 From: GeoSot Date: Wed, 15 Dec 2021 19:54:02 +0200 Subject: Modal: handle click event from backdrop callback --- js/tests/unit/modal.spec.js | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index bf796411b..5d3f5cd9d 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -642,8 +642,11 @@ describe('Modal', () => { modalEl.addEventListener('shown.bs.modal', () => { const spy = spyOn(modal, '_queueCallback').and.callThrough() - modalEl.click() - modalEl.click() + const mouseOverEvent = createEvent('mousedown') + const backdrop = document.querySelector('.modal-backdrop') + + backdrop.dispatchEvent(mouseOverEvent) + backdrop.dispatchEvent(mouseOverEvent) setTimeout(() => { expect(spy).toHaveBeenCalledTimes(1) @@ -710,9 +713,9 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - modalEl.addEventListener('shown.bs.modal', () => { - modalEl.click() + const mouseOverEvent = createEvent('mousedown') + document.querySelector('.modal-backdrop').dispatchEvent(mouseOverEvent) }) modalEl.addEventListener('hidden.bs.modal', () => { -- cgit v1.2.3 From dcbe7b6f31d5383ea9e0203fd68c0a5e99fa97b7 Mon Sep 17 00:00:00 2001 From: GeoSot Date: Wed, 15 Dec 2021 19:55:05 +0200 Subject: Modal.js: remove unnecessary checks from test --- js/tests/unit/modal.spec.js | 4 ---- 1 file changed, 4 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 5d3f5cd9d..0471a1b9f 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -719,10 +719,6 @@ describe('Modal', () => { }) modalEl.addEventListener('hidden.bs.modal', () => { - expect(modalEl.getAttribute('aria-modal')).toBeNull() - expect(modalEl.getAttribute('role')).toBeNull() - expect(modalEl.getAttribute('aria-hidden')).toEqual('true') - expect(modalEl.style.display).toEqual('none') expect(document.querySelector('.modal-backdrop')).toBeNull() resolve() }) -- cgit v1.2.3 From 4b17868fb47abf6ed2e994b6c1d0961b34b912a9 Mon Sep 17 00:00:00 2001 From: GeoSot Date: Sat, 19 Feb 2022 16:08:16 +0200 Subject: tests: revisit all tests using Promise.reject instead of throwing an error (#35765) --- js/tests/unit/modal.spec.js | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 0471a1b9f..a04eb2cc2 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -182,7 +182,7 @@ describe('Modal', () => { }) it('should not fire shown event when show is prevented', () => { - return new Promise(resolve => { + return new Promise((resolve, reject) => { fixtureEl.innerHTML = '
' const modalEl = fixtureEl.querySelector('.modal') @@ -200,7 +200,7 @@ describe('Modal', () => { }) modalEl.addEventListener('shown.bs.modal', () => { - throw new Error('shown event triggered') + reject(new Error('shown event triggered')) }) modal.show() @@ -458,7 +458,7 @@ describe('Modal', () => { }) it('should not close modal when clicking on modal-content', () => { - return new Promise(resolve => { + return new Promise((resolve, reject) => { fixtureEl.innerHTML = [ '
', '
', @@ -484,7 +484,7 @@ describe('Modal', () => { }) modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('Should not hide a modal') + reject(new Error('Should not hide a modal')) }) modal.show() @@ -492,7 +492,7 @@ describe('Modal', () => { }) it('should not close modal when clicking outside of modal-content if backdrop = false', () => { - return new Promise(resolve => { + return new Promise((resolve, reject) => { fixtureEl.innerHTML = '
' const modalEl = fixtureEl.querySelector('.modal') @@ -513,7 +513,7 @@ describe('Modal', () => { }) modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('Should not hide a modal') + reject(new Error('Should not hide a modal')) }) modal.show() @@ -521,7 +521,7 @@ describe('Modal', () => { }) it('should not close modal when clicking outside of modal-content if backdrop = static', () => { - return new Promise(resolve => { + return new Promise((resolve, reject) => { fixtureEl.innerHTML = '
' const modalEl = fixtureEl.querySelector('.modal') @@ -542,7 +542,7 @@ describe('Modal', () => { }) modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('Should not hide a modal') + reject(new Error('Should not hide a modal')) }) modal.show() @@ -578,7 +578,7 @@ describe('Modal', () => { }) it('should not close modal when escape key is pressed with keyboard = false', () => { - return new Promise(resolve => { + return new Promise((resolve, reject) => { fixtureEl.innerHTML = '
' const modalEl = fixtureEl.querySelector('.modal') @@ -602,7 +602,7 @@ describe('Modal', () => { }) modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('Should not hide a modal') + reject(new Error('Should not hide a modal')) }) modal.show() @@ -751,7 +751,7 @@ describe('Modal', () => { }) it('should not hide a modal if hide is prevented', () => { - return new Promise(resolve => { + return new Promise((resolve, reject) => { fixtureEl.innerHTML = '
' const modalEl = fixtureEl.querySelector('.modal') @@ -774,7 +774,7 @@ describe('Modal', () => { }) modalEl.addEventListener('hidden.bs.modal', () => { - throw new Error('should not trigger hidden') + reject(new Error('should not trigger hidden')) }) modal.show() -- cgit v1.2.3 From 63f30ac8ee28d12b5044c1f98e3b6ca7720a1f81 Mon Sep 17 00:00:00 2001 From: GeoSot Date: Tue, 1 Mar 2022 17:08:12 +0200 Subject: Modal: refactor listeners to reduce some code noise (#35902) --- js/tests/unit/modal.spec.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index a04eb2cc2..bf26377fe 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -438,10 +438,10 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - spyOn(modal, '_adjustDialog').and.callThrough() + const spy = spyOn(modal, '_adjustDialog').and.callThrough() const expectDone = () => { - expect(modal._adjustDialog).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() } -- cgit v1.2.3 From b167420bdf3c23ad9fb6c57818048c3c0e8da702 Mon Sep 17 00:00:00 2001 From: GeoSot Date: Fri, 13 May 2022 07:20:04 +0300 Subject: Revert backdrop utilization, handling clicks over modal (#36324) * refactor(Modal.js): stop using backdrop class to handle clicks over modal * Revert #35554 and backdrop callback usage Explanation: In order to bypass `.modal`, was applied a css rule `pointer-events:none` which caused the side effect, and user couldn't scroll "long content modals" * Update .bundlewatch.config.json Co-authored-by: Mark Otto --- js/tests/unit/modal.spec.js | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index bf26377fe..a12779234 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -642,11 +642,8 @@ describe('Modal', () => { modalEl.addEventListener('shown.bs.modal', () => { const spy = spyOn(modal, '_queueCallback').and.callThrough() - const mouseOverEvent = createEvent('mousedown') - const backdrop = document.querySelector('.modal-backdrop') - - backdrop.dispatchEvent(mouseOverEvent) - backdrop.dispatchEvent(mouseOverEvent) + modalEl.click() + modalEl.click() setTimeout(() => { expect(spy).toHaveBeenCalledTimes(1) @@ -714,8 +711,7 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) modalEl.addEventListener('shown.bs.modal', () => { - const mouseOverEvent = createEvent('mousedown') - document.querySelector('.modal-backdrop').dispatchEvent(mouseOverEvent) + modalEl.click() }) modalEl.addEventListener('hidden.bs.modal', () => { -- cgit v1.2.3 From d388bd6e1b0a21733a157182e1098b02a0449274 Mon Sep 17 00:00:00 2001 From: Louis-Maxime Piton Date: Tue, 31 May 2022 10:18:32 +0200 Subject: JS: tests fixes & standardization of spies usage (#36398) * Fix carousel spec typo * Change carousel test name in align with testing method * Make the spies declarations the same everywhere --- js/tests/unit/modal.spec.js | 96 ++++++++++++++++++++++----------------------- 1 file changed, 48 insertions(+), 48 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index a12779234..318410a8c 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -60,18 +60,18 @@ describe('Modal', () => { return new Promise(resolve => { fixtureEl.innerHTML = '
' - spyOn(ScrollBarHelper.prototype, 'hide').and.callThrough() - spyOn(ScrollBarHelper.prototype, 'reset').and.callThrough() + const spyHide = spyOn(ScrollBarHelper.prototype, 'hide').and.callThrough() + const spyReset = spyOn(ScrollBarHelper.prototype, 'reset').and.callThrough() const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) modalEl.addEventListener('shown.bs.modal', () => { - expect(ScrollBarHelper.prototype.hide).toHaveBeenCalled() + expect(spyHide).toHaveBeenCalled() modal.toggle() }) modalEl.addEventListener('hidden.bs.modal', () => { - expect(ScrollBarHelper.prototype.reset).toHaveBeenCalled() + expect(spyReset).toHaveBeenCalled() resolve() }) @@ -159,12 +159,12 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - spyOn(EventHandler, 'trigger') + const spy = spyOn(EventHandler, 'trigger') modal._isShown = true modal.show() - expect(EventHandler.trigger).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() }) it('should do nothing if a modal is transitioning', () => { @@ -173,12 +173,12 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - spyOn(EventHandler, 'trigger') + const spy = spyOn(EventHandler, 'trigger') modal._isTransitioning = true modal.show() - expect(EventHandler.trigger).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() }) it('should not fire shown event when show is prevented', () => { @@ -273,14 +273,14 @@ describe('Modal', () => { const btnClose = fixtureEl.querySelector('[data-bs-dismiss="modal"]') const modal = new Modal(modalEl) - spyOn(modal, 'hide').and.callThrough() + const spy = spyOn(modal, 'hide').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { btnClose.click() }) modalEl.addEventListener('hidden.bs.modal', () => { - expect(modal.hide).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) @@ -301,14 +301,14 @@ describe('Modal', () => { const btnClose = fixtureEl.querySelector('[data-bs-dismiss="modal"]') const modal = new Modal(modalEl) - spyOn(modal, 'hide').and.callThrough() + const spy = spyOn(modal, 'hide').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { btnClose.click() }) modalEl.addEventListener('hidden.bs.modal', () => { - expect(modal.hide).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) @@ -368,10 +368,10 @@ describe('Modal', () => { focus: false }) - spyOn(modal._focustrap, 'activate').and.callThrough() + const spy = spyOn(modal._focustrap, 'activate').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { - expect(modal._focustrap.activate).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() resolve() }) @@ -386,7 +386,7 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - spyOn(modal, 'hide').and.callThrough() + const spy = spyOn(modal, 'hide').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { const keydownEscape = createEvent('keydown') @@ -396,7 +396,7 @@ describe('Modal', () => { }) modalEl.addEventListener('hidden.bs.modal', () => { - expect(modal.hide).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) @@ -411,10 +411,10 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - spyOn(modal, 'hide') + const spy = spyOn(modal, 'hide') const expectDone = () => { - expect(modal.hide).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() resolve() } @@ -662,10 +662,10 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - spyOn(modal._focustrap, 'activate').and.callThrough() + const spy = spyOn(modal._focustrap, 'activate').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { - expect(modal._focustrap.activate).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) @@ -783,14 +783,14 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - spyOn(modal._focustrap, 'deactivate').and.callThrough() + const spy = spyOn(modal._focustrap, 'deactivate').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { modal.hide() }) modalEl.addEventListener('hidden.bs.modal', () => { - expect(modal._focustrap.deactivate).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) @@ -806,17 +806,17 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) const focustrap = modal._focustrap - spyOn(focustrap, 'deactivate').and.callThrough() + const spyDeactivate = spyOn(focustrap, 'deactivate').and.callThrough() expect(Modal.getInstance(modalEl)).toEqual(modal) - spyOn(EventHandler, 'off') + const spyOff = spyOn(EventHandler, 'off') modal.dispose() expect(Modal.getInstance(modalEl)).toBeNull() - expect(EventHandler.off).toHaveBeenCalledTimes(3) - expect(focustrap.deactivate).toHaveBeenCalled() + expect(spyOff).toHaveBeenCalledTimes(3) + expect(spyDeactivate).toHaveBeenCalled() }) }) @@ -827,11 +827,11 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const modal = new Modal(modalEl) - spyOn(modal, '_adjustDialog') + const spy = spyOn(modal, '_adjustDialog') modal.handleUpdate() - expect(modal._adjustDialog).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() }) }) @@ -879,10 +879,10 @@ describe('Modal', () => { const modal = new Modal(modalEl) const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - spyOn(modal, 'show').and.callThrough() + const spy = spyOn(modal, 'show').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { - expect(modal.show).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) @@ -900,7 +900,7 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - spyOn(Event.prototype, 'preventDefault').and.callThrough() + const spy = spyOn(Event.prototype, 'preventDefault').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { expect(modalEl.getAttribute('aria-modal')).toEqual('true') @@ -908,7 +908,7 @@ describe('Modal', () => { expect(modalEl.getAttribute('aria-hidden')).toBeNull() expect(modalEl.style.display).toEqual('block') expect(document.querySelector('.modal-backdrop')).not.toBeNull() - expect(Event.prototype.preventDefault).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) @@ -926,7 +926,7 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - spyOn(trigger, 'focus') + const spy = spyOn(trigger, 'focus') modalEl.addEventListener('shown.bs.modal', () => { const modal = Modal.getInstance(modalEl) @@ -936,7 +936,7 @@ describe('Modal', () => { const hideListener = () => { setTimeout(() => { - expect(trigger.focus).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }, 20) } @@ -962,14 +962,14 @@ describe('Modal', () => { const btnClose = fixtureEl.querySelector('button[data-bs-dismiss="modal"]') const modal = new Modal(modalEl) - spyOn(Event.prototype, 'preventDefault').and.callThrough() + const spy = spyOn(Event.prototype, 'preventDefault').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { btnClose.click() }) modalEl.addEventListener('hidden.bs.modal', () => { - expect(Event.prototype.preventDefault).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() resolve() }) @@ -991,14 +991,14 @@ describe('Modal', () => { const btnClose = fixtureEl.querySelector('a[data-bs-dismiss="modal"]') const modal = new Modal(modalEl) - spyOn(Event.prototype, 'preventDefault').and.callThrough() + const spy = spyOn(Event.prototype, 'preventDefault').and.callThrough() modalEl.addEventListener('shown.bs.modal', () => { btnClose.click() }) modalEl.addEventListener('hidden.bs.modal', () => { - expect(Event.prototype.preventDefault).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) @@ -1015,7 +1015,7 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - spyOn(trigger, 'focus') + const spy = spyOn(trigger, 'focus') modalEl.addEventListener('shown.bs.modal', () => { const modal = Modal.getInstance(modalEl) @@ -1025,7 +1025,7 @@ describe('Modal', () => { const hideListener = () => { setTimeout(() => { - expect(trigger.focus).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() resolve() }, 20) } @@ -1047,11 +1047,11 @@ describe('Modal', () => { const modalEl = fixtureEl.querySelector('.modal') const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') - spyOn(trigger, 'focus') + const spy = spyOn(trigger, 'focus') const showListener = () => { setTimeout(() => { - expect(trigger.focus).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() resolve() }, 10) } @@ -1113,8 +1113,8 @@ describe('Modal', () => { jQueryMock.elements = [div] jQueryMock.fn.modal.call(jQueryMock, { keyboard: false }) - spyOn(Modal.prototype, 'constructor') - expect(Modal.prototype.constructor).not.toHaveBeenCalledWith(div, { keyboard: false }) + const spy = spyOn(Modal.prototype, 'constructor') + expect(spy).not.toHaveBeenCalledWith(div, { keyboard: false }) const modal = Modal.getInstance(div) expect(modal).not.toBeNull() @@ -1158,11 +1158,11 @@ describe('Modal', () => { jQueryMock.fn.modal = Modal.jQueryInterface jQueryMock.elements = [div] - spyOn(modal, 'show') + const spy = spyOn(modal, 'show') jQueryMock.fn.modal.call(jQueryMock, 'show') - expect(modal.show).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() }) it('should not call show method', () => { @@ -1173,11 +1173,11 @@ describe('Modal', () => { jQueryMock.fn.modal = Modal.jQueryInterface jQueryMock.elements = [div] - spyOn(Modal.prototype, 'show') + const spy = spyOn(Modal.prototype, 'show') jQueryMock.fn.modal.call(jQueryMock) - expect(Modal.prototype.show).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() }) }) -- cgit v1.2.3 From d05c42a3979be30efc7a932c3c0f483098841b19 Mon Sep 17 00:00:00 2001 From: GeoSot Date: Tue, 21 Jun 2022 11:03:57 +0300 Subject: fix: change dismiss handler, listening to key down, instead of click (#36401) --- js/tests/unit/modal.spec.js | 19 +++++++++++++------ 1 file changed, 13 insertions(+), 6 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 318410a8c..9e463d2be 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -641,9 +641,10 @@ describe('Modal', () => { modalEl.addEventListener('shown.bs.modal', () => { const spy = spyOn(modal, '_queueCallback').and.callThrough() + const mouseDown = createEvent('mousedown') - modalEl.click() - modalEl.click() + modalEl.dispatchEvent(mouseDown) + modalEl.dispatchEvent(mouseDown) setTimeout(() => { expect(spy).toHaveBeenCalledTimes(1) @@ -709,13 +710,19 @@ describe('Modal', () => { fixtureEl.innerHTML = '
' const modalEl = fixtureEl.querySelector('.modal') + const dialogEl = modalEl.querySelector('.modal-dialog') const modal = new Modal(modalEl) + + spyOn(modal, 'hide') + modalEl.addEventListener('shown.bs.modal', () => { - modalEl.click() - }) + const mouseDown = createEvent('mousedown') - modalEl.addEventListener('hidden.bs.modal', () => { - expect(document.querySelector('.modal-backdrop')).toBeNull() + dialogEl.dispatchEvent(mouseDown) + expect(modal.hide).not.toHaveBeenCalled() + + modalEl.dispatchEvent(mouseDown) + expect(modal.hide).toHaveBeenCalled() resolve() }) -- cgit v1.2.3 From aa8d0b34399b647c1e89f58a9d244a396846cd64 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Julien=20D=C3=A9ramond?= Date: Fri, 15 Jul 2022 15:52:03 +0200 Subject: Standardization of `spyOn` usage (#36742) --- js/tests/unit/modal.spec.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 9e463d2be..1bdf4e66a 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -713,16 +713,16 @@ describe('Modal', () => { const dialogEl = modalEl.querySelector('.modal-dialog') const modal = new Modal(modalEl) - spyOn(modal, 'hide') + const spy = spyOn(modal, 'hide') modalEl.addEventListener('shown.bs.modal', () => { const mouseDown = createEvent('mousedown') dialogEl.dispatchEvent(mouseDown) - expect(modal.hide).not.toHaveBeenCalled() + expect(spy).not.toHaveBeenCalled() modalEl.dispatchEvent(mouseDown) - expect(modal.hide).toHaveBeenCalled() + expect(spy).toHaveBeenCalled() resolve() }) -- cgit v1.2.3 From 23fb7a79156d1ea4ce2ab5713debbbc251b4e22f Mon Sep 17 00:00:00 2001 From: GeoSot Date: Wed, 7 Sep 2022 11:56:33 +0300 Subject: Fix modal event-listeners during dismiss click (#36863) ref: #36855 --- js/tests/unit/modal.spec.js | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 1bdf4e66a..e774fc4e8 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -644,7 +644,9 @@ describe('Modal', () => { const mouseDown = createEvent('mousedown') modalEl.dispatchEvent(mouseDown) + modalEl.click() modalEl.dispatchEvent(mouseDown) + modalEl.click() setTimeout(() => { expect(spy).toHaveBeenCalledTimes(1) @@ -719,9 +721,11 @@ describe('Modal', () => { const mouseDown = createEvent('mousedown') dialogEl.dispatchEvent(mouseDown) + modalEl.click() expect(spy).not.toHaveBeenCalled() modalEl.dispatchEvent(mouseDown) + modalEl.click() expect(spy).toHaveBeenCalled() resolve() }) -- cgit v1.2.3 From 6f65df4faea2694840572626f8a02f4399bd0dca Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20Broutier?= Date: Thu, 15 Sep 2022 12:30:51 +0200 Subject: Fix modal event listeners (#37128) * Fix modal event listeners (#37126) Co-authored-by: GeoSot --- js/tests/unit/modal.spec.js | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index e774fc4e8..fdee29e95 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -734,6 +734,36 @@ describe('Modal', () => { }) }) + it('should not close modal when clicking on an element removed from modal content', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '
', + '
', + ' ', + '
', + '
' + ].join('') + + const modalEl = fixtureEl.querySelector('.modal') + const buttonEl = modalEl.querySelector('.btn') + const modal = new Modal(modalEl) + + const spy = spyOn(modal, 'hide') + buttonEl.addEventListener('click', () => { + buttonEl.remove() + }) + + modalEl.addEventListener('shown.bs.modal', () => { + modalEl.dispatchEvent(createEvent('mousedown')) + buttonEl.click() + expect(spy).not.toHaveBeenCalled() + resolve() + }) + + modal.show() + }) + }) + it('should do nothing is the modal is not shown', () => { fixtureEl.innerHTML = '
' -- cgit v1.2.3 From ae43f0c48bf7acede8a325b24197001fe2b2f416 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Wed, 29 Mar 2023 20:49:30 +0300 Subject: Tweak and re-organize ESLint config (#38369) * Tweak and re-organize ESLint config * merge individual configs to the root config * enable more eslint-plugin-import rules * lint markdown files * Lint --- js/tests/unit/modal.spec.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index fdee29e95..6434d8b3c 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -1,7 +1,7 @@ -import Modal from '../../src/modal' -import EventHandler from '../../src/dom/event-handler' -import ScrollBarHelper from '../../src/util/scrollbar' -import { clearBodyAndDocument, clearFixture, createEvent, getFixture, jQueryMock } from '../helpers/fixture' +import EventHandler from '../../src/dom/event-handler.js' +import Modal from '../../src/modal.js' +import ScrollBarHelper from '../../src/util/scrollbar.js' +import { clearBodyAndDocument, clearFixture, createEvent, getFixture, jQueryMock } from '../helpers/fixture.js' describe('Modal', () => { let fixtureEl -- cgit v1.2.3 From 40c6d8a4bc9813e5c54cf7753b1f0785fed92715 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 6 Feb 2024 21:46:52 +0200 Subject: Build(deps-dev): Bump eslint-config-xo from 0.43.1 to 0.44.0 (#39651) * Build(deps-dev): Bump eslint-config-xo from 0.43.1 to 0.44.0 Bumps [eslint-config-xo](https://github.com/xojs/eslint-config-xo) from 0.43.1 to 0.44.0. - [Release notes](https://github.com/xojs/eslint-config-xo/releases) - [Commits](https://github.com/xojs/eslint-config-xo/compare/v0.43.1...v0.44.0) --- updated-dependencies: - dependency-name: eslint-config-xo dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] * Update .eslintrc.json * Update .eslintrc.json * autofix --------- Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: XhmikosR --- js/tests/unit/modal.spec.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index 6434d8b3c..b5c031312 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -1,7 +1,9 @@ import EventHandler from '../../src/dom/event-handler.js' import Modal from '../../src/modal.js' import ScrollBarHelper from '../../src/util/scrollbar.js' -import { clearBodyAndDocument, clearFixture, createEvent, getFixture, jQueryMock } from '../helpers/fixture.js' +import { + clearBodyAndDocument, clearFixture, createEvent, getFixture, jQueryMock +} from '../helpers/fixture.js' describe('Modal', () => { let fixtureEl -- cgit v1.2.3 From 6ed1cdd43e7a063ce9a668f5623e8dae02fa8d37 Mon Sep 17 00:00:00 2001 From: GeoSot Date: Sun, 18 Feb 2024 08:58:07 +0200 Subject: Selector Engine: fix multiple IDs (#39201) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: regression of #38989 * Add unit test in selector-engine.spec.js --------- Co-authored-by: Julien Déramond Co-authored-by: XhmikosR --- js/tests/unit/modal.spec.js | 29 +++++++++++++++++++++++++++++ 1 file changed, 29 insertions(+) (limited to 'js/tests/unit/modal.spec.js') diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js index b5c031312..2aa0b7655 100644 --- a/js/tests/unit/modal.spec.js +++ b/js/tests/unit/modal.spec.js @@ -991,6 +991,35 @@ describe('Modal', () => { trigger.click() }) }) + + it('should open modal, having special characters in its id', () => { + return new Promise(resolve => { + fixtureEl.innerHTML = [ + '', + '' + ].join('') + + const modalEl = fixtureEl.querySelector('.modal') + const trigger = fixtureEl.querySelector('[data-bs-toggle="modal"]') + + modalEl.addEventListener('shown.bs.modal', () => { + resolve() + }) + + trigger.click() + }) + }) + it('should not prevent default when a click occurred on data-bs-dismiss="modal" where tagName is DIFFERENT than or ', () => { return new Promise(resolve => { fixtureEl.innerHTML = [ -- cgit v1.2.3