mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-06 05:37:39 +02:00
Code Issues Releases Wiki Activity

Add getOrCreateInstance method in base-component (#33276)

Browse Source 
Co-authored-by: Rohit Sharma <rohit2sharma95@gmail.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
GeoSot
2021-06-03 18:53:27 +03:00
committed by GitHub
parent 4a5029ea29
commit c98657b830
39 changed files with 744 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
js/src/alert.js
View File

@@ -9,7 +9,6 @@ import {
defineJQueryPlugin,
getElementFromSelector
} from './util/index'
import Data from './dom/data'
import EventHandler from './dom/event-handler'
import BaseComponent from './base-component'
@@ -87,11 +86,7 @@ class Alert extends BaseComponent {
static jQueryInterface(config) {
return this.each(function () {
let data = Data.get(this, DATA_KEY)
if (!data) {
data = new Alert(this)
}
const data = Alert.getOrCreateInstance(this)
if (config === 'close') {
data[config](this)

4
js/src/base-component.js
View File

@@ -51,6 +51,10 @@ class BaseComponent {
return Data.get(element, this.DATA_KEY)
}
static getOrCreateInstance(element, config = {}) {
return this.getInstance(element) || new this(element, typeof config === 'object' ? config : null)
}
static get VERSION() {
return VERSION
}

13
js/src/button.js
View File

@@ -6,7 +6,6 @@
*/
import { defineJQueryPlugin } from './util/index'
import Data from './dom/data'
import EventHandler from './dom/event-handler'
import BaseComponent from './base-component'
@@ -51,11 +50,7 @@ class Button extends BaseComponent {
static jQueryInterface(config) {
return this.each(function () {
let data = Data.get(this, DATA_KEY)
if (!data) {
data = new Button(this)
}
const data = Button.getOrCreateInstance(this)
if (config === 'toggle') {
data[config]()
@@ -74,11 +69,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, event => {
event.preventDefault()
const button = event.target.closest(SELECTOR_DATA_TOGGLE)
let data = Data.get(button, DATA_KEY)
if (!data) {
data = new Button(button)
}
const data = Button.getOrCreateInstance(button)
data.toggle()
})

26
js/src/carousel.js
View File

@@ -15,7 +15,6 @@ import {
triggerTransitionEnd,
typeCheckConfig
} from './util/index'
import Data from './dom/data'
import EventHandler from './dom/event-handler'
import Manipulator from './dom/manipulator'
import SelectorEngine from './dom/selector-engine'
@@ -219,7 +218,8 @@ class Carousel extends BaseComponent {
_getConfig(config) {
config = {
...Default,
...config
...Manipulator.getDataAttributes(this._element),
...(typeof config === 'object' ? config : {})
}
typeCheckConfig(NAME, config, DefaultType)
return config
@@ -496,25 +496,11 @@ class Carousel extends BaseComponent {
// Static
static carouselInterface(element, config) {
let data = Data.get(element, DATA_KEY)
let _config = {
...Default,
...Manipulator.getDataAttributes(element)
}
if (typeof config === 'object') {
_config = {
..._config,
...config
}
}
const data = Carousel.getOrCreateInstance(element, config)
const { _config } = data
const action = typeof config === 'string' ? config : _config.slide
if (!data) {
data = new Carousel(element, _config)
}
if (typeof config === 'number') {
data.to(config)
} else if (typeof action === 'string') {
@@ -555,7 +541,7 @@ class Carousel extends BaseComponent {
Carousel.carouselInterface(target, config)
if (slideIndex) {
Data.get(target, DATA_KEY).to(slideIndex)
Carousel.getInstance(target).to(slideIndex)
}
event.preventDefault()
@@ -574,7 +560,7 @@ EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
const carousels = SelectorEngine.find(SELECTOR_DATA_RIDE)
for (let i = 0, len = carousels.length; i < len; i++) {
Carousel.carouselInterface(carousels[i], Data.get(carousels[i], DATA_KEY))
Carousel.carouselInterface(carousels[i], Carousel.getInstance(carousels[i]))
}
})

6
js/src/collapse.js
View File

@@ -145,7 +145,7 @@ class Collapse extends BaseComponent {
const container = SelectorEngine.findOne(this._selector)
if (actives) {
const tempActiveData = actives.find(elem => container !== elem)
activesData = tempActiveData ? Data.get(tempActiveData, DATA_KEY) : null
activesData = tempActiveData ? Collapse.getInstance(tempActiveData) : null
if (activesData && activesData._isTransitioning) {
return
@@ -310,7 +310,7 @@ class Collapse extends BaseComponent {
// Static
static collapseInterface(element, config) {
let data = Data.get(element, DATA_KEY)
let data = Collapse.getInstance(element)
const _config = {
...Default,
...Manipulator.getDataAttributes(element),
@@ -358,7 +358,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
const selectorElements = SelectorEngine.find(selector)
selectorElements.forEach(element => {
const data = Data.get(element, DATA_KEY)
const data = Collapse.getInstance(element)
let config
if (data) {
// update parent attribute

10
js/src/dropdown.js
View File

@@ -19,7 +19,6 @@ import {
getNextActiveElement,
typeCheckConfig
} from './util/index'
import Data from './dom/data'
import EventHandler from './dom/event-handler'
import Manipulator from './dom/manipulator'
import SelectorEngine from './dom/selector-engine'
@@ -369,12 +368,7 @@ class Dropdown extends BaseComponent {
// Static
static dropdownInterface(element, config) {
let data = Data.get(element, DATA_KEY)
const _config = typeof config === 'object' ? config : null
if (!data) {
data = new Dropdown(element, _config)
}
const data = Dropdown.getOrCreateInstance(element, config)
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
@@ -399,7 +393,7 @@ class Dropdown extends BaseComponent {
const toggles = SelectorEngine.find(SELECTOR_DATA_TOGGLE)
for (let i = 0, len = toggles.length; i < len; i++) {
const context = Data.get(toggles[i], DATA_KEY)
const context = Dropdown.getInstance(toggles[i])
if (!context || context._config.autoClose === false) {
continue
}

6
js/src/modal.js
View File

@@ -209,7 +209,7 @@ class Modal extends BaseComponent {
config = {
...Default,
...Manipulator.getDataAttributes(this._element),
...config
...(typeof config === 'object' ? config : {})
}
typeCheckConfig(NAME, config, DefaultType)
return config
@@ -389,7 +389,7 @@ class Modal extends BaseComponent {
static jQueryInterface(config, relatedTarget) {
return this.each(function () {
const data = Modal.getInstance(this) || new Modal(this, typeof config === 'object' ? config : {})
const data = Modal.getOrCreateInstance(this, config)
if (typeof config !== 'string') {
return
@@ -430,7 +430,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
})
})
const data = Modal.getInstance(target) || new Modal(target)
const data = Modal.getOrCreateInstance(target)
data.toggle(this)
})

12
js/src/offcanvas.js
View File

@@ -13,7 +13,6 @@ import {
typeCheckConfig
} from './util/index'
import { hide as scrollBarHide, reset as scrollBarReset } from './util/scrollbar'
import Data from './dom/data'
import EventHandler from './dom/event-handler'
import BaseComponent from './base-component'
import SelectorEngine from './dom/selector-engine'
@@ -211,7 +210,7 @@ class Offcanvas extends BaseComponent {
static jQueryInterface(config) {
return this.each(function () {
const data = Data.get(this, DATA_KEY) || new Offcanvas(this, typeof config === 'object' ? config : {})
const data = Offcanvas.getOrCreateInstance(this, config)
if (typeof config !== 'string') {
return
@@ -256,14 +255,13 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
Offcanvas.getInstance(allReadyOpen).hide()
}
const data = Data.get(target, DATA_KEY) || new Offcanvas(target)
const data = Offcanvas.getOrCreateInstance(target)
data.toggle(this)
})
EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
SelectorEngine.find(OPEN_SELECTOR).forEach(el => (Data.get(el, DATA_KEY) || new Offcanvas(el)).show())
})
EventHandler.on(window, EVENT_LOAD_DATA_API, () =>
SelectorEngine.find(OPEN_SELECTOR).forEach(el => Offcanvas.getOrCreateInstance(el).show())
)
/**
* ------------------------------------------------------------------------

9
js/src/popover.js
View File

@@ -6,7 +6,6 @@
*/
import { defineJQueryPlugin } from './util/index'
import Data from './dom/data'
import SelectorEngine from './dom/selector-engine'
import Tooltip from './tooltip'
@@ -146,13 +145,7 @@ class Popover extends Tooltip {
static jQueryInterface(config) {
return this.each(function () {
let data = Data.get(this, DATA_KEY)
const _config = typeof config === 'object' ? config : null
if (!data) {
data = new Popover(this, _config)
Data.set(this, DATA_KEY, data)
}
const data = Popover.getOrCreateInstance(this, config)
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {

2
js/src/scrollspy.js
View File

@@ -270,7 +270,7 @@ class ScrollSpy extends BaseComponent {
static jQueryInterface(config) {
return this.each(function () {
const data = ScrollSpy.getInstance(this) || new ScrollSpy(this, typeof config === 'object' ? config : {})
const data = ScrollSpy.getOrCreateInstance(this, config)
if (typeof config !== 'string') {
return

5
js/src/tab.js
View File

@@ -11,7 +11,6 @@ import {
isDisabled,
reflow
} from './util/index'
import Data from './dom/data'
import EventHandler from './dom/event-handler'
import SelectorEngine from './dom/selector-engine'
import BaseComponent from './base-component'
@@ -181,7 +180,7 @@ class Tab extends BaseComponent {
static jQueryInterface(config) {
return this.each(function () {
const data = Data.get(this, DATA_KEY) || new Tab(this)
const data = Tab.getOrCreateInstance(this)
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
@@ -209,7 +208,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
return
}
const data = Data.get(this, DATA_KEY) || new Tab(this)
const data = Tab.getOrCreateInstance(this)
data.show()
})

8
js/src/toast.js
View File

@@ -10,7 +10,6 @@ import {
reflow,
typeCheckConfig
} from './util/index'
import Data from './dom/data'
import EventHandler from './dom/event-handler'
import Manipulator from './dom/manipulator'
import BaseComponent from './base-component'
@@ -218,12 +217,7 @@ class Toast extends BaseComponent {
static jQueryInterface(config) {
return this.each(function () {
let data = Data.get(this, DATA_KEY)
const _config = typeof config === 'object' && config
if (!data) {
data = new Toast(this, _config)
}
const data = Toast.getOrCreateInstance(this, config)
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {

7
js/src/tooltip.js
View File

@@ -722,12 +722,7 @@ class Tooltip extends BaseComponent {
static jQueryInterface(config) {
return this.each(function () {
let data = Data.get(this, DATA_KEY)
const _config = typeof config === 'object' && config
if (!data) {
data = new Tooltip(this, _config)
}
const data = Tooltip.getOrCreateInstance(this, config)
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {

22
js/tests/unit/alert.spec.js
View File

@@ -207,4 +207,26 @@ describe('Alert', () => {
expect(Alert.getInstance(div)).toEqual(null)
})
})
describe('getOrCreateInstance', () => {
it('should return alert instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const alert = new Alert(div)
expect(Alert.getOrCreateInstance(div)).toEqual(alert)
expect(Alert.getInstance(div)).toEqual(Alert.getOrCreateInstance(div, {}))
expect(Alert.getOrCreateInstance(div)).toBeInstanceOf(Alert)
})
it('should return new instance when there is no alert instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Alert.getInstance(div)).toEqual(null)
expect(Alert.getOrCreateInstance(div)).toBeInstanceOf(Alert)
})
})
})

17
js/tests/unit/base-component.spec.js
View File

@@ -112,5 +112,22 @@ describe('Base Component', () => {
expect(DummyClass.getInstance(div)).toEqual(null)
})
})
describe('getOrCreateInstance', () => {
it('should return an instance', () => {
createInstance()
expect(DummyClass.getOrCreateInstance(element)).toEqual(instance)
expect(DummyClass.getInstance(element)).toEqual(DummyClass.getOrCreateInstance(element, {}))
expect(DummyClass.getOrCreateInstance(element)).toBeInstanceOf(DummyClass)
})
it('should return new instance when there is no alert instance', () => {
fixtureEl.innerHTML = '<div id="foo"></div>'
element = fixtureEl.querySelector('#foo')
expect(DummyClass.getInstance(element)).toEqual(null)
expect(DummyClass.getOrCreateInstance(element)).toBeInstanceOf(DummyClass)
})
})
})
})

22
js/tests/unit/button.spec.js
View File

@@ -164,4 +164,26 @@ describe('Button', () => {
expect(Button.getInstance(div)).toEqual(null)
})
})
describe('getOrCreateInstance', () => {
it('should return button instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const button = new Button(div)
expect(Button.getOrCreateInstance(div)).toEqual(button)
expect(Button.getInstance(div)).toEqual(Button.getOrCreateInstance(div, {}))
expect(Button.getOrCreateInstance(div)).toBeInstanceOf(Button)
})
it('should return new instance when there is no button instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Button.getInstance(div)).toEqual(null)
expect(Button.getOrCreateInstance(div)).toBeInstanceOf(Button)
})
})
})

54
js/tests/unit/carousel.spec.js
View File

@@ -1202,6 +1202,60 @@ describe('Carousel', () => {
})
})
describe('getOrCreateInstance', () => {
it('should return carousel instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const carousel = new Carousel(div)
expect(Carousel.getOrCreateInstance(div)).toEqual(carousel)
expect(Carousel.getInstance(div)).toEqual(Carousel.getOrCreateInstance(div, {}))
expect(Carousel.getOrCreateInstance(div)).toBeInstanceOf(Carousel)
})
it('should return new instance when there is no carousel instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Carousel.getInstance(div)).toEqual(null)
expect(Carousel.getOrCreateInstance(div)).toBeInstanceOf(Carousel)
})
it('should return new instance when there is no carousel instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Carousel.getInstance(div)).toEqual(null)
const carousel = Carousel.getOrCreateInstance(div, {
interval: 1
})
expect(carousel).toBeInstanceOf(Carousel)
expect(carousel._config.interval).toEqual(1)
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const carousel = new Carousel(div, {
interval: 1
})
expect(Carousel.getInstance(div)).toEqual(carousel)
const carousel2 = Carousel.getOrCreateInstance(div, {
interval: 2
})
expect(carousel).toBeInstanceOf(Carousel)
expect(carousel2).toEqual(carousel)
expect(carousel2._config.interval).toEqual(1)
})
})
describe('jQueryInterface', () => {
it('should create a carousel', () => {
fixtureEl.innerHTML = '<div></div>'

54
js/tests/unit/collapse.spec.js
View File

@@ -862,4 +862,58 @@ describe('Collapse', () => {
expect(Collapse.getInstance(div)).toEqual(null)
})
})
describe('getOrCreateInstance', () => {
it('should return collapse instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const collapse = new Collapse(div)
expect(Collapse.getOrCreateInstance(div)).toEqual(collapse)
expect(Collapse.getInstance(div)).toEqual(Collapse.getOrCreateInstance(div, {}))
expect(Collapse.getOrCreateInstance(div)).toBeInstanceOf(Collapse)
})
it('should return new instance when there is no collapse instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Collapse.getInstance(div)).toEqual(null)
expect(Collapse.getOrCreateInstance(div)).toBeInstanceOf(Collapse)
})
it('should return new instance when there is no collapse instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Collapse.getInstance(div)).toEqual(null)
const collapse = Collapse.getOrCreateInstance(div, {
toggle: false
})
expect(collapse).toBeInstanceOf(Collapse)
expect(collapse._config.toggle).toEqual(false)
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const collapse = new Collapse(div, {
toggle: false
})
expect(Collapse.getInstance(div)).toEqual(collapse)
const collapse2 = Collapse.getOrCreateInstance(div, {
toggle: true
})
expect(collapse).toBeInstanceOf(Collapse)
expect(collapse2).toEqual(collapse)
expect(collapse2._config.toggle).toEqual(false)
})
})
})

54
js/tests/unit/dropdown.spec.js
View File

@@ -1991,6 +1991,60 @@ describe('Dropdown', () => {
})
})
describe('getOrCreateInstance', () => {
it('should return dropdown instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const dropdown = new Dropdown(div)
expect(Dropdown.getOrCreateInstance(div)).toEqual(dropdown)
expect(Dropdown.getInstance(div)).toEqual(Dropdown.getOrCreateInstance(div, {}))
expect(Dropdown.getOrCreateInstance(div)).toBeInstanceOf(Dropdown)
})
it('should return new instance when there is no dropdown instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Dropdown.getInstance(div)).toEqual(null)
expect(Dropdown.getOrCreateInstance(div)).toBeInstanceOf(Dropdown)
})
it('should return new instance when there is no dropdown instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Dropdown.getInstance(div)).toEqual(null)
const dropdown = Dropdown.getOrCreateInstance(div, {
display: 'dynamic'
})
expect(dropdown).toBeInstanceOf(Dropdown)
expect(dropdown._config.display).toEqual('dynamic')
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const dropdown = new Dropdown(div, {
display: 'dynamic'
})
expect(Dropdown.getInstance(div)).toEqual(dropdown)
const dropdown2 = Dropdown.getOrCreateInstance(div, {
display: 'static'
})
expect(dropdown).toBeInstanceOf(Dropdown)
expect(dropdown2).toEqual(dropdown)
expect(dropdown2._config.display).toEqual('dynamic')
})
})
it('should open dropdown when pressing keydown or keyup', done => {
fixtureEl.innerHTML = [
'<div class="dropdown">',

54
js/tests/unit/modal.spec.js
View File

@@ -1058,4 +1058,58 @@ describe('Modal', () => {
expect(Modal.getInstance(div)).toBeNull()
})
})
describe('getOrCreateInstance', () => {
it('should return modal instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const modal = new Modal(div)
expect(Modal.getOrCreateInstance(div)).toEqual(modal)
expect(Modal.getInstance(div)).toEqual(Modal.getOrCreateInstance(div, {}))
expect(Modal.getOrCreateInstance(div)).toBeInstanceOf(Modal)
})
it('should return new instance when there is no modal instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Modal.getInstance(div)).toEqual(null)
expect(Modal.getOrCreateInstance(div)).toBeInstanceOf(Modal)
})
it('should return new instance when there is no modal instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Modal.getInstance(div)).toEqual(null)
const modal = Modal.getOrCreateInstance(div, {
backdrop: true
})
expect(modal).toBeInstanceOf(Modal)
expect(modal._config.backdrop).toEqual(true)
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const modal = new Modal(div, {
backdrop: true
})
expect(Modal.getInstance(div)).toEqual(modal)
const modal2 = Modal.getOrCreateInstance(div, {
backdrop: false
})
expect(modal).toBeInstanceOf(Modal)
expect(modal2).toEqual(modal)
expect(modal2._config.backdrop).toEqual(true)
})
})
})

88
js/tests/unit/offcanvas.spec.js
View File

@@ -620,38 +620,6 @@ describe('Offcanvas', () => {
}).toThrowError(TypeError, `No method named "${action}"`)
})
it('should throw error on protected method', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const action = '_getConfig'
jQueryMock.fn.offcanvas = Offcanvas.jQueryInterface
jQueryMock.elements = [div]
try {
jQueryMock.fn.offcanvas.call(jQueryMock, action)
} catch (error) {
expect(error.message).toEqual(`No method named "${action}"`)
}
})
it('should throw error if method "constructor" is being called', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const action = 'constructor'
jQueryMock.fn.offcanvas = Offcanvas.jQueryInterface
jQueryMock.elements = [div]
try {
jQueryMock.fn.offcanvas.call(jQueryMock, action)
} catch (error) {
expect(error.message).toEqual(`No method named "${action}"`)
}
})
it('should call offcanvas method', () => {
fixtureEl.innerHTML = '<div></div>'
@@ -675,8 +643,6 @@ describe('Offcanvas', () => {
jQueryMock.elements = [div]
jQueryMock.fn.offcanvas.call(jQueryMock, { scroll: true })
spyOn(Offcanvas.prototype, 'constructor')
expect(Offcanvas.prototype.constructor).not.toHaveBeenCalledWith(div, { scroll: true })
const offcanvas = Offcanvas.getInstance(div)
expect(offcanvas).not.toBeNull()
@@ -703,4 +669,58 @@ describe('Offcanvas', () => {
expect(Offcanvas.getInstance(div)).toBeNull()
})
})
describe('getOrCreateInstance', () => {
it('should return offcanvas instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const offcanvas = new Offcanvas(div)
expect(Offcanvas.getOrCreateInstance(div)).toEqual(offcanvas)
expect(Offcanvas.getInstance(div)).toEqual(Offcanvas.getOrCreateInstance(div, {}))
expect(Offcanvas.getOrCreateInstance(div)).toBeInstanceOf(Offcanvas)
})
it('should return new instance when there is no Offcanvas instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Offcanvas.getInstance(div)).toEqual(null)
expect(Offcanvas.getOrCreateInstance(div)).toBeInstanceOf(Offcanvas)
})
it('should return new instance when there is no offcanvas instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Offcanvas.getInstance(div)).toEqual(null)
const offcanvas = Offcanvas.getOrCreateInstance(div, {
scroll: true
})
expect(offcanvas).toBeInstanceOf(Offcanvas)
expect(offcanvas._config.scroll).toEqual(true)
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const offcanvas = new Offcanvas(div, {
scroll: true
})
expect(Offcanvas.getInstance(div)).toEqual(offcanvas)
const offcanvas2 = Offcanvas.getOrCreateInstance(div, {
scroll: false
})
expect(offcanvas).toBeInstanceOf(Offcanvas)
expect(offcanvas2).toEqual(offcanvas)
expect(offcanvas2._config.scroll).toEqual(true)
})
})
})

54
js/tests/unit/popover.spec.js
View File

@@ -287,4 +287,58 @@ describe('Popover', () => {
expect(Popover.getInstance(popoverEl)).toEqual(null)
})
})
describe('getOrCreateInstance', () => {
it('should return popover instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const popover = new Popover(div)
expect(Popover.getOrCreateInstance(div)).toEqual(popover)
expect(Popover.getInstance(div)).toEqual(Popover.getOrCreateInstance(div, {}))
expect(Popover.getOrCreateInstance(div)).toBeInstanceOf(Popover)
})
it('should return new instance when there is no popover instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Popover.getInstance(div)).toEqual(null)
expect(Popover.getOrCreateInstance(div)).toBeInstanceOf(Popover)
})
it('should return new instance when there is no popover instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Popover.getInstance(div)).toEqual(null)
const popover = Popover.getOrCreateInstance(div, {
placement: 'top'
})
expect(popover).toBeInstanceOf(Popover)
expect(popover._config.placement).toEqual('top')
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const popover = new Popover(div, {
placement: 'top'
})
expect(Popover.getInstance(div)).toEqual(popover)
const popover2 = Popover.getOrCreateInstance(div, {
placement: 'bottom'
})
expect(popover).toBeInstanceOf(Popover)
expect(popover2).toEqual(popover)
expect(popover2._config.placement).toEqual('top')
})
})
})

54
js/tests/unit/scrollspy.spec.js
View File

@@ -684,6 +684,60 @@ describe('ScrollSpy', () => {
})
})
describe('getOrCreateInstance', () => {
it('should return scrollspy instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const scrollspy = new ScrollSpy(div)
expect(ScrollSpy.getOrCreateInstance(div)).toEqual(scrollspy)
expect(ScrollSpy.getInstance(div)).toEqual(ScrollSpy.getOrCreateInstance(div, {}))
expect(ScrollSpy.getOrCreateInstance(div)).toBeInstanceOf(ScrollSpy)
})
it('should return new instance when there is no scrollspy instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(ScrollSpy.getInstance(div)).toEqual(null)
expect(ScrollSpy.getOrCreateInstance(div)).toBeInstanceOf(ScrollSpy)
})
it('should return new instance when there is no scrollspy instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(ScrollSpy.getInstance(div)).toEqual(null)
const scrollspy = ScrollSpy.getOrCreateInstance(div, {
offset: 1
})
expect(scrollspy).toBeInstanceOf(ScrollSpy)
expect(scrollspy._config.offset).toEqual(1)
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const scrollspy = new ScrollSpy(div, {
offset: 1
})
expect(ScrollSpy.getInstance(div)).toEqual(scrollspy)
const scrollspy2 = ScrollSpy.getOrCreateInstance(div, {
offset: 2
})
expect(scrollspy).toBeInstanceOf(ScrollSpy)
expect(scrollspy2).toEqual(scrollspy)
expect(scrollspy2._config.offset).toEqual(1)
})
})
describe('event handler', () => {
it('should create scrollspy on window load event', () => {
fixtureEl.innerHTML = '<div data-bs-spy="scroll"></div>'

22
js/tests/unit/tab.spec.js
View File

@@ -433,6 +433,28 @@ describe('Tab', () => {
})
})
describe('getOrCreateInstance', () => {
it('should return tab instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const tab = new Tab(div)
expect(Tab.getOrCreateInstance(div)).toEqual(tab)
expect(Tab.getInstance(div)).toEqual(Tab.getOrCreateInstance(div, {}))
expect(Tab.getOrCreateInstance(div)).toBeInstanceOf(Tab)
})
it('should return new instance when there is no tab instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Tab.getInstance(div)).toEqual(null)
expect(Tab.getOrCreateInstance(div)).toBeInstanceOf(Tab)
})
})
describe('data-api', () => {
it('should create dynamically a tab', done => {
fixtureEl.innerHTML = [

54
js/tests/unit/toast.spec.js
View File

@@ -591,4 +591,58 @@ describe('Toast', () => {
expect(Toast.getInstance(div)).toEqual(null)
})
})
describe('getOrCreateInstance', () => {
it('should return toast instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const toast = new Toast(div)
expect(Toast.getOrCreateInstance(div)).toEqual(toast)
expect(Toast.getInstance(div)).toEqual(Toast.getOrCreateInstance(div, {}))
expect(Toast.getOrCreateInstance(div)).toBeInstanceOf(Toast)
})
it('should return new instance when there is no toast instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Toast.getInstance(div)).toEqual(null)
expect(Toast.getOrCreateInstance(div)).toBeInstanceOf(Toast)
})
it('should return new instance when there is no toast instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Toast.getInstance(div)).toEqual(null)
const toast = Toast.getOrCreateInstance(div, {
delay: 1
})
expect(toast).toBeInstanceOf(Toast)
expect(toast._config.delay).toEqual(1)
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const toast = new Toast(div, {
delay: 1
})
expect(Toast.getInstance(div)).toEqual(toast)
const toast2 = Toast.getOrCreateInstance(div, {
delay: 2
})
expect(toast).toBeInstanceOf(Toast)
expect(toast2).toEqual(toast)
expect(toast2._config.delay).toEqual(1)
})
})
})

56
js/tests/unit/tooltip.spec.js
View File

@@ -3,7 +3,7 @@ import EventHandler from '../../src/dom/event-handler'
import { noop } from '../../src/util/index'
/** Test helpers */
import { getFixture, clearFixture, jQueryMock, createEvent } from '../helpers/fixture'
import { clearFixture, createEvent, getFixture, jQueryMock } from '../helpers/fixture'
describe('Tooltip', () => {
let fixtureEl
@@ -1306,6 +1306,60 @@ describe('Tooltip', () => {
})
})
describe('getOrCreateInstance', () => {
it('should return tooltip instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const tooltip = new Tooltip(div)
expect(Tooltip.getOrCreateInstance(div)).toEqual(tooltip)
expect(Tooltip.getInstance(div)).toEqual(Tooltip.getOrCreateInstance(div, {}))
expect(Tooltip.getOrCreateInstance(div)).toBeInstanceOf(Tooltip)
})
it('should return new instance when there is no tooltip instance', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Tooltip.getInstance(div)).toEqual(null)
expect(Tooltip.getOrCreateInstance(div)).toBeInstanceOf(Tooltip)
})
it('should return new instance when there is no tooltip instance with given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
expect(Tooltip.getInstance(div)).toEqual(null)
const tooltip = Tooltip.getOrCreateInstance(div, {
title: () => 'test'
})
expect(tooltip).toBeInstanceOf(Tooltip)
expect(tooltip.getTitle()).toEqual('test')
})
it('should return the instance when exists without given configuration', () => {
fixtureEl.innerHTML = '<div></div>'
const div = fixtureEl.querySelector('div')
const tooltip = new Tooltip(div, {
title: () => 'nothing'
})
expect(Tooltip.getInstance(div)).toEqual(tooltip)
const tooltip2 = Tooltip.getOrCreateInstance(div, {
title: () => 'test'
})
expect(tooltip).toBeInstanceOf(Tooltip)
expect(tooltip2).toEqual(tooltip)
expect(tooltip2.getTitle()).toEqual('nothing')
})
})
describe('jQueryInterface', () => {
it('should create a tooltip', () => {
fixtureEl.innerHTML = '<div></div>'