mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-18 19:31:35 +02:00
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<https://jasmine.github.io/tutorials/upgrading_to_Jasmine_4.0#deprecations-due-to-calling-done-multiple-times> for more information.
This commit is contained in:
GeoSot
GitHub
@@ -23,267 +23,297 @@ describe('Backdrop', () => {
|
||||
})
|
||||
|
||||
describe('show', () => {
|
||||
it('should append the backdrop html once on show and include the "show" class if it is "shown"', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: false
|
||||
})
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
it('should append the backdrop html once on show and include the "show" class if it is "shown"', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: false
|
||||
})
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
|
||||
expect(getElements()).toHaveSize(0)
|
||||
|
||||
instance.show()
|
||||
instance.show(() => {
|
||||
expect(getElements()).toHaveSize(1)
|
||||
for (const el of getElements()) {
|
||||
expect(el).toHaveClass(CLASS_NAME_SHOW)
|
||||
}
|
||||
|
||||
done()
|
||||
})
|
||||
})
|
||||
|
||||
it('should not append the backdrop html if it is not "shown"', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: false,
|
||||
isAnimated: true
|
||||
})
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
|
||||
expect(getElements()).toHaveSize(0)
|
||||
instance.show(() => {
|
||||
expect(getElements()).toHaveSize(0)
|
||||
done()
|
||||
|
||||
instance.show()
|
||||
instance.show(() => {
|
||||
expect(getElements()).toHaveSize(1)
|
||||
for (const el of getElements()) {
|
||||
expect(el).toHaveClass(CLASS_NAME_SHOW)
|
||||
}
|
||||
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('should append the backdrop html once and include the "fade" class if it is "shown" and "animated"', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true
|
||||
it('should not append the backdrop html if it is not "shown"', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: false,
|
||||
isAnimated: true
|
||||
})
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
|
||||
expect(getElements()).toHaveSize(0)
|
||||
instance.show(() => {
|
||||
expect(getElements()).toHaveSize(0)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
})
|
||||
|
||||
expect(getElements()).toHaveSize(0)
|
||||
it('should append the backdrop html once and include the "fade" class if it is "shown" and "animated"', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true
|
||||
})
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
|
||||
instance.show(() => {
|
||||
expect(getElements()).toHaveSize(1)
|
||||
for (const el of getElements()) {
|
||||
expect(el).toHaveClass(CLASS_NAME_FADE)
|
||||
}
|
||||
expect(getElements()).toHaveSize(0)
|
||||
|
||||
done()
|
||||
instance.show(() => {
|
||||
expect(getElements()).toHaveSize(1)
|
||||
for (const el of getElements()) {
|
||||
expect(el).toHaveClass(CLASS_NAME_FADE)
|
||||
}
|
||||
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('hide', () => {
|
||||
it('should remove the backdrop html', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true
|
||||
})
|
||||
it('should remove the backdrop html', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true
|
||||
})
|
||||
|
||||
const getElements = () => document.body.querySelectorAll(CLASS_BACKDROP)
|
||||
const getElements = () => document.body.querySelectorAll(CLASS_BACKDROP)
|
||||
|
||||
expect(getElements()).toHaveSize(0)
|
||||
instance.show(() => {
|
||||
expect(getElements()).toHaveSize(1)
|
||||
instance.hide(() => {
|
||||
expect(getElements()).toHaveSize(0)
|
||||
done()
|
||||
expect(getElements()).toHaveSize(0)
|
||||
instance.show(() => {
|
||||
expect(getElements()).toHaveSize(1)
|
||||
instance.hide(() => {
|
||||
expect(getElements()).toHaveSize(0)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('should remove the "show" class', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true
|
||||
})
|
||||
const elem = instance._getElement()
|
||||
it('should remove the "show" class', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true
|
||||
})
|
||||
const elem = instance._getElement()
|
||||
|
||||
instance.show()
|
||||
instance.hide(() => {
|
||||
expect(elem).not.toHaveClass(CLASS_NAME_SHOW)
|
||||
done()
|
||||
})
|
||||
})
|
||||
|
||||
it('should not try to remove Node on remove method if it is not "shown"', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: false,
|
||||
isAnimated: true
|
||||
})
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
const spy = spyOn(instance, 'dispose').and.callThrough()
|
||||
|
||||
expect(getElements()).toHaveSize(0)
|
||||
expect(instance._isAppended).toBeFalse()
|
||||
instance.show(() => {
|
||||
instance.show()
|
||||
instance.hide(() => {
|
||||
expect(getElements()).toHaveSize(0)
|
||||
expect(spy).not.toHaveBeenCalled()
|
||||
expect(instance._isAppended).toBeFalse()
|
||||
done()
|
||||
expect(elem).not.toHaveClass(CLASS_NAME_SHOW)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('should not error if the backdrop no longer has a parent', done => {
|
||||
fixtureEl.innerHTML = '<div id="wrapper"></div>'
|
||||
it('should not try to remove Node on remove method if it is not "shown"', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: false,
|
||||
isAnimated: true
|
||||
})
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
const spy = spyOn(instance, 'dispose').and.callThrough()
|
||||
|
||||
const wrapper = fixtureEl.querySelector('#wrapper')
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true,
|
||||
rootElement: wrapper
|
||||
expect(getElements()).toHaveSize(0)
|
||||
expect(instance._isAppended).toBeFalse()
|
||||
instance.show(() => {
|
||||
instance.hide(() => {
|
||||
expect(getElements()).toHaveSize(0)
|
||||
expect(spy).not.toHaveBeenCalled()
|
||||
expect(instance._isAppended).toBeFalse()
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
it('should not error if the backdrop no longer has a parent', () => {
|
||||
return new Promise(resolve => {
|
||||
fixtureEl.innerHTML = '<div id="wrapper"></div>'
|
||||
|
||||
instance.show(() => {
|
||||
wrapper.remove()
|
||||
instance.hide(() => {
|
||||
expect(getElements()).toHaveSize(0)
|
||||
done()
|
||||
const wrapper = fixtureEl.querySelector('#wrapper')
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true,
|
||||
rootElement: wrapper
|
||||
})
|
||||
|
||||
const getElements = () => document.querySelectorAll(CLASS_BACKDROP)
|
||||
|
||||
instance.show(() => {
|
||||
wrapper.remove()
|
||||
instance.hide(() => {
|
||||
expect(getElements()).toHaveSize(0)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('click callback', () => {
|
||||
it('should execute callback on click', done => {
|
||||
const spy = jasmine.createSpy('spy')
|
||||
it('should execute callback on click', () => {
|
||||
return new Promise(resolve => {
|
||||
const spy = jasmine.createSpy('spy')
|
||||
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: false,
|
||||
clickCallback: () => spy()
|
||||
})
|
||||
const endTest = () => {
|
||||
setTimeout(() => {
|
||||
expect(spy).toHaveBeenCalled()
|
||||
done()
|
||||
}, 10)
|
||||
}
|
||||
|
||||
instance.show(() => {
|
||||
const clickEvent = new Event('mousedown', { bubbles: true, cancelable: true })
|
||||
document.querySelector(CLASS_BACKDROP).dispatchEvent(clickEvent)
|
||||
endTest()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('animation callbacks', () => {
|
||||
it('should show and hide backdrop after counting transition duration if it is animated', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true
|
||||
})
|
||||
const spy2 = jasmine.createSpy('spy2')
|
||||
|
||||
const execDone = () => {
|
||||
setTimeout(() => {
|
||||
expect(spy2).toHaveBeenCalledTimes(2)
|
||||
done()
|
||||
}, 10)
|
||||
}
|
||||
|
||||
instance.show(spy2)
|
||||
instance.hide(() => {
|
||||
spy2()
|
||||
execDone()
|
||||
})
|
||||
expect(spy2).not.toHaveBeenCalled()
|
||||
})
|
||||
|
||||
it('should show and hide backdrop without a delay if it is not animated', done => {
|
||||
const spy = jasmine.createSpy('spy', getTransitionDurationFromElement)
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: false
|
||||
})
|
||||
const spy2 = jasmine.createSpy('spy2')
|
||||
|
||||
instance.show(spy2)
|
||||
instance.hide(spy2)
|
||||
|
||||
setTimeout(() => {
|
||||
expect(spy2).toHaveBeenCalled()
|
||||
expect(spy).not.toHaveBeenCalled()
|
||||
done()
|
||||
}, 10)
|
||||
})
|
||||
|
||||
it('should not call delay callbacks if it is not "shown"', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: false,
|
||||
isAnimated: true
|
||||
})
|
||||
const spy = jasmine.createSpy('spy', getTransitionDurationFromElement)
|
||||
|
||||
instance.show()
|
||||
instance.hide(() => {
|
||||
expect(spy).not.toHaveBeenCalled()
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('Config', () => {
|
||||
describe('rootElement initialization', () => {
|
||||
it('should be appended on "document.body" by default', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true
|
||||
})
|
||||
const getElement = () => document.querySelector(CLASS_BACKDROP)
|
||||
instance.show(() => {
|
||||
expect(getElement().parentElement).toEqual(document.body)
|
||||
done()
|
||||
})
|
||||
})
|
||||
|
||||
it('should find the rootElement if passed as a string', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
rootElement: 'body'
|
||||
isAnimated: false,
|
||||
clickCallback: () => spy()
|
||||
})
|
||||
const getElement = () => document.querySelector(CLASS_BACKDROP)
|
||||
instance.show(() => {
|
||||
expect(getElement().parentElement).toEqual(document.body)
|
||||
done()
|
||||
})
|
||||
})
|
||||
const endTest = () => {
|
||||
setTimeout(() => {
|
||||
expect(spy).toHaveBeenCalled()
|
||||
resolve()
|
||||
}, 10)
|
||||
}
|
||||
|
||||
it('should be appended on any element given by the proper config', done => {
|
||||
fixtureEl.innerHTML = '<div id="wrapper"></div>'
|
||||
|
||||
const wrapper = fixtureEl.querySelector('#wrapper')
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
rootElement: wrapper
|
||||
})
|
||||
const getElement = () => document.querySelector(CLASS_BACKDROP)
|
||||
instance.show(() => {
|
||||
expect(getElement().parentElement).toEqual(wrapper)
|
||||
done()
|
||||
const clickEvent = new Event('mousedown', { bubbles: true, cancelable: true })
|
||||
document.querySelector(CLASS_BACKDROP).dispatchEvent(clickEvent)
|
||||
endTest()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('ClassName', () => {
|
||||
it('should allow configuring className', done => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
className: 'foo'
|
||||
describe('animation callbacks', () => {
|
||||
it('should show and hide backdrop after counting transition duration if it is animated', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: true
|
||||
})
|
||||
const spy2 = jasmine.createSpy('spy2')
|
||||
|
||||
const execDone = () => {
|
||||
setTimeout(() => {
|
||||
expect(spy2).toHaveBeenCalledTimes(2)
|
||||
resolve()
|
||||
}, 10)
|
||||
}
|
||||
|
||||
instance.show(spy2)
|
||||
instance.hide(() => {
|
||||
spy2()
|
||||
execDone()
|
||||
})
|
||||
expect(spy2).not.toHaveBeenCalled()
|
||||
})
|
||||
const getElement = () => document.querySelector('.foo')
|
||||
instance.show(() => {
|
||||
expect(getElement()).toEqual(instance._getElement())
|
||||
instance.dispose()
|
||||
done()
|
||||
})
|
||||
|
||||
it('should show and hide backdrop without a delay if it is not animated', () => {
|
||||
return new Promise(resolve => {
|
||||
const spy = jasmine.createSpy('spy', getTransitionDurationFromElement)
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
isAnimated: false
|
||||
})
|
||||
const spy2 = jasmine.createSpy('spy2')
|
||||
|
||||
instance.show(spy2)
|
||||
instance.hide(spy2)
|
||||
|
||||
setTimeout(() => {
|
||||
expect(spy2).toHaveBeenCalled()
|
||||
expect(spy).not.toHaveBeenCalled()
|
||||
resolve()
|
||||
}, 10)
|
||||
})
|
||||
})
|
||||
|
||||
it('should not call delay callbacks if it is not "shown"', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: false,
|
||||
isAnimated: true
|
||||
})
|
||||
const spy = jasmine.createSpy('spy', getTransitionDurationFromElement)
|
||||
|
||||
instance.show()
|
||||
instance.hide(() => {
|
||||
expect(spy).not.toHaveBeenCalled()
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('Config', () => {
|
||||
describe('rootElement initialization', () => {
|
||||
it('should be appended on "document.body" by default', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true
|
||||
})
|
||||
const getElement = () => document.querySelector(CLASS_BACKDROP)
|
||||
instance.show(() => {
|
||||
expect(getElement().parentElement).toEqual(document.body)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('should find the rootElement if passed as a string', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
rootElement: 'body'
|
||||
})
|
||||
const getElement = () => document.querySelector(CLASS_BACKDROP)
|
||||
instance.show(() => {
|
||||
expect(getElement().parentElement).toEqual(document.body)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
it('should be appended on any element given by the proper config', () => {
|
||||
return new Promise(resolve => {
|
||||
fixtureEl.innerHTML = '<div id="wrapper"></div>'
|
||||
|
||||
const wrapper = fixtureEl.querySelector('#wrapper')
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
rootElement: wrapper
|
||||
})
|
||||
const getElement = () => document.querySelector(CLASS_BACKDROP)
|
||||
instance.show(() => {
|
||||
expect(getElement().parentElement).toEqual(wrapper)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('ClassName', () => {
|
||||
it('should allow configuring className', () => {
|
||||
return new Promise(resolve => {
|
||||
const instance = new Backdrop({
|
||||
isVisible: true,
|
||||
className: 'foo'
|
||||
})
|
||||
const getElement = () => document.querySelector('.foo')
|
||||
instance.show(() => {
|
||||
expect(getElement()).toEqual(instance._getElement())
|
||||
instance.dispose()
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user