mirror of
https://github.com/twbs/bootstrap.git
synced 2025-09-02 01:42:36 +02:00
Switch from QUnit to Jasmine.
This commit is contained in:
131
js/src/dom/data.spec.js
Normal file
131
js/src/dom/data.spec.js
Normal file
@@ -0,0 +1,131 @@
|
||||
import Data from './data'
|
||||
|
||||
/** Test helpers */
|
||||
import { getFixture, clearFixture } from '../../tests/helpers/fixture'
|
||||
|
||||
describe('Data', () => {
|
||||
let fixtureEl
|
||||
|
||||
beforeAll(() => {
|
||||
fixtureEl = getFixture()
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
clearFixture()
|
||||
})
|
||||
|
||||
describe('setData', () => {
|
||||
it('should set data in an element by adding a key attribute', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
const data = {
|
||||
test: 'bsData'
|
||||
}
|
||||
|
||||
Data.setData(div, 'test', data)
|
||||
expect(div.key).toBeDefined()
|
||||
})
|
||||
|
||||
it('should change data if something is already stored', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
const data = {
|
||||
test: 'bsData'
|
||||
}
|
||||
|
||||
Data.setData(div, 'test', data)
|
||||
|
||||
data.test = 'bsData2'
|
||||
Data.setData(div, 'test', data)
|
||||
|
||||
expect(div.key).toBeDefined()
|
||||
})
|
||||
})
|
||||
|
||||
describe('getData', () => {
|
||||
it('should return stored data', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
const data = {
|
||||
test: 'bsData'
|
||||
}
|
||||
|
||||
Data.setData(div, 'test', data)
|
||||
expect(Data.getData(div, 'test')).toEqual(data)
|
||||
})
|
||||
|
||||
it('should return null on undefined element', () => {
|
||||
expect(Data.getData(null)).toEqual(null)
|
||||
expect(Data.getData(undefined)).toEqual(null)
|
||||
})
|
||||
|
||||
it('should return null when an element have nothing stored', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
expect(Data.getData(div, 'test')).toEqual(null)
|
||||
})
|
||||
|
||||
it('should return null when an element have nothing stored with the provided key', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
const data = {
|
||||
test: 'bsData'
|
||||
}
|
||||
|
||||
Data.setData(div, 'test', data)
|
||||
|
||||
expect(Data.getData(div, 'test2')).toEqual(null)
|
||||
})
|
||||
})
|
||||
|
||||
describe('removeData', () => {
|
||||
it('should do nothing when an element have nothing stored', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
Data.removeData(div, 'test')
|
||||
expect().nothing()
|
||||
})
|
||||
|
||||
it('should should do nothing if it\'s not a valid key provided', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
const data = {
|
||||
test: 'bsData'
|
||||
}
|
||||
|
||||
Data.setData(div, 'test', data)
|
||||
|
||||
expect(div.key).toBeDefined()
|
||||
|
||||
Data.removeData(div, 'test2')
|
||||
|
||||
expect(div.key).toBeDefined()
|
||||
})
|
||||
|
||||
it('should remove data if something is stored', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
const data = {
|
||||
test: 'bsData'
|
||||
}
|
||||
|
||||
Data.setData(div, 'test', data)
|
||||
|
||||
expect(div.key).toBeDefined()
|
||||
|
||||
Data.removeData(div, 'test')
|
||||
|
||||
expect(div.key).toBeUndefined()
|
||||
})
|
||||
})
|
||||
})
|
@@ -192,7 +192,9 @@ function addHandler(element, originalTypeEvent, handler, delegationFn, oneOff) {
|
||||
}
|
||||
|
||||
const uid = getUidEvent(originalHandler, originalTypeEvent.replace(namespaceRegex, ''))
|
||||
const fn = delegation ? bootstrapDelegationHandler(element, handler, delegationFn) : bootstrapHandler(element, handler)
|
||||
const fn = delegation ?
|
||||
bootstrapDelegationHandler(element, handler, delegationFn) :
|
||||
bootstrapHandler(element, handler)
|
||||
|
||||
fn.delegationSelector = delegation ? handler : null
|
||||
fn.originalHandler = originalHandler
|
||||
|
327
js/src/dom/event-handler.spec.js
Normal file
327
js/src/dom/event-handler.spec.js
Normal file
@@ -0,0 +1,327 @@
|
||||
import EventHandler from './event-handler'
|
||||
|
||||
/** Test helpers */
|
||||
import { getFixture, clearFixture } from '../../tests/helpers/fixture'
|
||||
|
||||
describe('EventHandler', () => {
|
||||
let fixtureEl
|
||||
|
||||
beforeAll(() => {
|
||||
fixtureEl = getFixture()
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
clearFixture()
|
||||
})
|
||||
|
||||
describe('on', () => {
|
||||
it('should not add event listener if the event is not a string', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
EventHandler.on(div, null, () => {})
|
||||
EventHandler.on(null, 'click', () => {})
|
||||
|
||||
expect().nothing()
|
||||
})
|
||||
|
||||
it('should add event listener', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
EventHandler.on(div, 'click', () => {
|
||||
expect().nothing()
|
||||
done()
|
||||
})
|
||||
|
||||
div.click()
|
||||
})
|
||||
|
||||
it('should add namespaced event listener', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
EventHandler.on(div, 'bs.namespace', () => {
|
||||
expect().nothing()
|
||||
done()
|
||||
})
|
||||
|
||||
EventHandler.trigger(div, 'bs.namespace')
|
||||
})
|
||||
|
||||
it('should add native namespaced event listener', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
EventHandler.on(div, 'click.namespace', () => {
|
||||
expect().nothing()
|
||||
done()
|
||||
})
|
||||
|
||||
EventHandler.trigger(div, 'click')
|
||||
})
|
||||
|
||||
it('should handle event delegation', done => {
|
||||
EventHandler.on(document, 'click', '.test', () => {
|
||||
expect().nothing()
|
||||
done()
|
||||
})
|
||||
|
||||
fixtureEl.innerHTML = '<div class="test"></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
div.click()
|
||||
})
|
||||
})
|
||||
|
||||
describe('one', () => {
|
||||
it('should call listener just one', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
let called = 0
|
||||
const div = fixtureEl.querySelector('div')
|
||||
const obj = {
|
||||
oneListener() {
|
||||
called++
|
||||
}
|
||||
}
|
||||
|
||||
EventHandler.one(div, 'bootstrap', obj.oneListener)
|
||||
|
||||
EventHandler.trigger(div, 'bootstrap')
|
||||
EventHandler.trigger(div, 'bootstrap')
|
||||
|
||||
setTimeout(() => {
|
||||
expect(called).toEqual(1)
|
||||
done()
|
||||
}, 20)
|
||||
})
|
||||
})
|
||||
|
||||
describe('off', () => {
|
||||
it('should not remove a listener', () => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
EventHandler.off(div, null, () => {})
|
||||
EventHandler.off(null, 'click', () => {})
|
||||
expect().nothing()
|
||||
})
|
||||
|
||||
it('should remove a listener', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
let called = 0
|
||||
const handler = () => {
|
||||
called++
|
||||
}
|
||||
|
||||
EventHandler.on(div, 'foobar', handler)
|
||||
EventHandler.trigger(div, 'foobar')
|
||||
|
||||
EventHandler.off(div, 'foobar', handler)
|
||||
EventHandler.trigger(div, 'foobar')
|
||||
|
||||
setTimeout(() => {
|
||||
expect(called).toEqual(1)
|
||||
done()
|
||||
}, 20)
|
||||
})
|
||||
|
||||
it('should remove all the events', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
let called = 0
|
||||
|
||||
EventHandler.on(div, 'foobar', () => {
|
||||
called++
|
||||
})
|
||||
EventHandler.on(div, 'foobar', () => {
|
||||
called++
|
||||
})
|
||||
EventHandler.trigger(div, 'foobar')
|
||||
|
||||
EventHandler.off(div, 'foobar')
|
||||
EventHandler.trigger(div, 'foobar')
|
||||
|
||||
setTimeout(() => {
|
||||
expect(called).toEqual(2)
|
||||
done()
|
||||
}, 20)
|
||||
})
|
||||
|
||||
it('should remove all the namespaced listeners if namespace is passed', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
let called = 0
|
||||
|
||||
EventHandler.on(div, 'foobar.namespace', () => {
|
||||
called++
|
||||
})
|
||||
EventHandler.on(div, 'foofoo.namespace', () => {
|
||||
called++
|
||||
})
|
||||
EventHandler.trigger(div, 'foobar.namespace')
|
||||
EventHandler.trigger(div, 'foofoo.namespace')
|
||||
|
||||
EventHandler.off(div, '.namespace')
|
||||
EventHandler.trigger(div, 'foobar.namespace')
|
||||
EventHandler.trigger(div, 'foofoo.namespace')
|
||||
|
||||
setTimeout(() => {
|
||||
expect(called).toEqual(2)
|
||||
done()
|
||||
}, 20)
|
||||
})
|
||||
|
||||
it('should remove the namespaced listeners', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
let calledCallback1 = 0
|
||||
let calledCallback2 = 0
|
||||
|
||||
EventHandler.on(div, 'foobar.namespace', () => {
|
||||
calledCallback1++
|
||||
})
|
||||
EventHandler.on(div, 'foofoo.namespace', () => {
|
||||
calledCallback2++
|
||||
})
|
||||
|
||||
EventHandler.trigger(div, 'foobar.namespace')
|
||||
EventHandler.off(div, 'foobar.namespace')
|
||||
EventHandler.trigger(div, 'foobar.namespace')
|
||||
|
||||
EventHandler.trigger(div, 'foofoo.namespace')
|
||||
|
||||
setTimeout(() => {
|
||||
expect(calledCallback1).toEqual(1)
|
||||
expect(calledCallback2).toEqual(1)
|
||||
done()
|
||||
}, 20)
|
||||
})
|
||||
|
||||
it('should remove the all the namespaced listeners for native events', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
let called = 0
|
||||
|
||||
EventHandler.on(div, 'click.namespace', () => {
|
||||
called++
|
||||
})
|
||||
EventHandler.on(div, 'click.namespace2', () => {
|
||||
called++
|
||||
})
|
||||
|
||||
EventHandler.trigger(div, 'click')
|
||||
EventHandler.off(div, 'click')
|
||||
EventHandler.trigger(div, 'click')
|
||||
|
||||
setTimeout(() => {
|
||||
expect(called).toEqual(2)
|
||||
done()
|
||||
}, 20)
|
||||
})
|
||||
|
||||
it('should remove the specified namespaced listeners for native events', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
const div = fixtureEl.querySelector('div')
|
||||
|
||||
let called1 = 0
|
||||
let called2 = 0
|
||||
|
||||
EventHandler.on(div, 'click.namespace', () => {
|
||||
called1++
|
||||
})
|
||||
EventHandler.on(div, 'click.namespace2', () => {
|
||||
called2++
|
||||
})
|
||||
EventHandler.trigger(div, 'click')
|
||||
|
||||
EventHandler.off(div, 'click.namespace')
|
||||
EventHandler.trigger(div, 'click')
|
||||
|
||||
setTimeout(() => {
|
||||
expect(called1).toEqual(1)
|
||||
expect(called2).toEqual(2)
|
||||
done()
|
||||
}, 20)
|
||||
})
|
||||
|
||||
it('should remove a listener registered by .one', done => {
|
||||
fixtureEl.innerHTML = '<div></div>'
|
||||
|
||||
const div = fixtureEl.querySelector('div')
|
||||
const handler = () => {
|
||||
throw new Error('called')
|
||||
}
|
||||
|
||||
EventHandler.one(div, 'foobar', handler)
|
||||
EventHandler.off(div, 'foobar', handler)
|
||||
|
||||
EventHandler.trigger(div, 'foobar')
|
||||
setTimeout(() => {
|
||||
expect().nothing()
|
||||
done()
|
||||
}, 20)
|
||||
})
|
||||
|
||||
it('should remove the correct delegated event listener', () => {
|
||||
const element = document.createElement('div')
|
||||
const subelement = document.createElement('span')
|
||||
element.appendChild(subelement)
|
||||
|
||||
const anchor = document.createElement('a')
|
||||
element.appendChild(anchor)
|
||||
|
||||
let i = 0
|
||||
const handler = () => {
|
||||
i++
|
||||
}
|
||||
|
||||
EventHandler.on(element, 'click', 'a', handler)
|
||||
EventHandler.on(element, 'click', 'span', handler)
|
||||
|
||||
fixtureEl.appendChild(element)
|
||||
|
||||
EventHandler.trigger(anchor, 'click')
|
||||
EventHandler.trigger(subelement, 'click')
|
||||
|
||||
// first listeners called
|
||||
expect(i === 2).toEqual(true)
|
||||
|
||||
EventHandler.off(element, 'click', 'span', handler)
|
||||
EventHandler.trigger(subelement, 'click')
|
||||
|
||||
// removed listener not called
|
||||
expect(i === 2).toEqual(true)
|
||||
|
||||
EventHandler.trigger(anchor, 'click')
|
||||
|
||||
// not removed listener called
|
||||
expect(i === 3).toEqual(true)
|
||||
|
||||
EventHandler.on(element, 'click', 'span', handler)
|
||||
EventHandler.trigger(anchor, 'click')
|
||||
EventHandler.trigger(subelement, 'click')
|
||||
|
||||
// listener re-registered
|
||||
expect(i === 5).toEqual(true)
|
||||
|
||||
EventHandler.off(element, 'click', 'span')
|
||||
EventHandler.trigger(subelement, 'click')
|
||||
|
||||
// listener removed again
|
||||
expect(i === 5).toEqual(true)
|
||||
})
|
||||
})
|
||||
})
|
Reference in New Issue
Block a user