diff --git a/js/src/dropdown.js b/js/src/dropdown.js
index 9190b3ed5704..96094a3e6577 100644
--- a/js/src/dropdown.js
+++ b/js/src/dropdown.js
@@ -320,7 +320,7 @@ class Dropdown extends BaseComponent {
return {
...defaultBsPopperConfig,
- ...execute(this._config.popperConfig, [defaultBsPopperConfig])
+ ...execute(this._config.popperConfig, [undefined, defaultBsPopperConfig])
}
}
diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index 6a6cfeff218b..92d455349336 100644
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -392,7 +392,7 @@ class Tooltip extends BaseComponent {
}
_resolvePossibleFunction(arg) {
- return execute(arg, [this._element])
+ return execute(arg, [this._element, this._element])
}
_getPopperConfig(attachment) {
@@ -438,7 +438,7 @@ class Tooltip extends BaseComponent {
return {
...defaultBsPopperConfig,
- ...execute(this._config.popperConfig, [defaultBsPopperConfig])
+ ...execute(this._config.popperConfig, [undefined, defaultBsPopperConfig])
}
}
diff --git a/js/src/util/index.js b/js/src/util/index.js
index 2adf19e3b19a..c271cc5368ca 100644
--- a/js/src/util/index.js
+++ b/js/src/util/index.js
@@ -223,7 +223,7 @@ const defineJQueryPlugin = plugin => {
}
const execute = (possibleCallback, args = [], defaultValue = possibleCallback) => {
- return typeof possibleCallback === 'function' ? possibleCallback(...args) : defaultValue
+ return typeof possibleCallback === 'function' ? possibleCallback.call(...args) : defaultValue
}
const executeAfterTransition = (callback, transitionElement, waitForTransition = true) => {
diff --git a/js/src/util/template-factory.js b/js/src/util/template-factory.js
index f73589bcc785..6d1532b4d4bb 100644
--- a/js/src/util/template-factory.js
+++ b/js/src/util/template-factory.js
@@ -143,7 +143,7 @@ class TemplateFactory extends Config {
}
_resolvePossibleFunction(arg) {
- return execute(arg, [this])
+ return execute(arg, [undefined, this])
}
_putElementInTemplate(element, templateElement) {
diff --git a/js/tests/unit/dropdown.spec.js b/js/tests/unit/dropdown.spec.js
index 156005588dbe..63ae4bd102bc 100644
--- a/js/tests/unit/dropdown.spec.js
+++ b/js/tests/unit/dropdown.spec.js
@@ -172,7 +172,10 @@ describe('Dropdown', () => {
const popperConfig = dropdown._getPopperConfig()
- expect(getPopperConfig).toHaveBeenCalled()
+ // Ensure that the function was called with the default config.
+ expect(getPopperConfig).toHaveBeenCalledWith(jasmine.objectContaining({
+ placement: jasmine.any(String)
+ }))
expect(popperConfig.placement).toEqual('left')
})
})
diff --git a/js/tests/unit/popover.spec.js b/js/tests/unit/popover.spec.js
index 53dc7d89ea6d..ba38ebe06629 100644
--- a/js/tests/unit/popover.spec.js
+++ b/js/tests/unit/popover.spec.js
@@ -95,6 +95,60 @@ describe('Popover', () => {
})
})
+ it('should call content and title functions with trigger element', () => {
+ return new Promise(resolve => {
+ fixtureEl.innerHTML = 'BS twitter'
+
+ const popoverEl = fixtureEl.querySelector('a')
+ const popover = new Popover(popoverEl, {
+ title(el) {
+ return el.dataset.foo
+ },
+ content(el) {
+ return el.dataset.foo
+ }
+ })
+
+ popoverEl.addEventListener('shown.bs.popover', () => {
+ const popoverDisplayed = document.querySelector('.popover')
+
+ expect(popoverDisplayed).not.toBeNull()
+ expect(popoverDisplayed.querySelector('.popover-header').textContent).toEqual('bar')
+ expect(popoverDisplayed.querySelector('.popover-body').textContent).toEqual('bar')
+ resolve()
+ })
+
+ popover.show()
+ })
+ })
+
+ it('should call content and title functions with correct this value', () => {
+ return new Promise(resolve => {
+ fixtureEl.innerHTML = 'BS twitter'
+
+ const popoverEl = fixtureEl.querySelector('a')
+ const popover = new Popover(popoverEl, {
+ title() {
+ return this.dataset.foo
+ },
+ content() {
+ return this.dataset.foo
+ }
+ })
+
+ popoverEl.addEventListener('shown.bs.popover', () => {
+ const popoverDisplayed = document.querySelector('.popover')
+
+ expect(popoverDisplayed).not.toBeNull()
+ expect(popoverDisplayed.querySelector('.popover-header').textContent).toEqual('bar')
+ expect(popoverDisplayed.querySelector('.popover-body').textContent).toEqual('bar')
+ resolve()
+ })
+
+ popover.show()
+ })
+ })
+
it('should show a popover with just content without having header', () => {
return new Promise(resolve => {
fixtureEl.innerHTML = 'Nice link'
diff --git a/js/tests/unit/tooltip.spec.js b/js/tests/unit/tooltip.spec.js
index ceb8de41e1a0..37f2c230d037 100644
--- a/js/tests/unit/tooltip.spec.js
+++ b/js/tests/unit/tooltip.spec.js
@@ -177,7 +177,10 @@ describe('Tooltip', () => {
const popperConfig = tooltip._getPopperConfig('top')
- expect(getPopperConfig).toHaveBeenCalled()
+ // Ensure that the function was called with the default config.
+ expect(getPopperConfig).toHaveBeenCalledWith(jasmine.objectContaining({
+ placement: jasmine.any(String)
+ }))
expect(popperConfig.placement).toEqual('left')
})
@@ -919,10 +922,12 @@ describe('Tooltip', () => {
it('should show a tooltip with custom class provided as a function in config', () => {
return new Promise(resolve => {
- fixtureEl.innerHTML = ''
+ fixtureEl.innerHTML = ''
- const spy = jasmine.createSpy('customClass').and.returnValue('custom-class')
const tooltipEl = fixtureEl.querySelector('a')
+ const spy = jasmine.createSpy('customClass').and.callFake(function (el) {
+ return `${el.dataset.classA} ${this.dataset.classB}`
+ })
const tooltip = new Tooltip(tooltipEl, {
customClass: spy
})
@@ -931,7 +936,8 @@ describe('Tooltip', () => {
const tip = document.querySelector('.tooltip')
expect(tip).not.toBeNull()
expect(spy).toHaveBeenCalled()
- expect(tip).toHaveClass('custom-class')
+ expect(tip).toHaveClass('custom-class-a')
+ expect(tip).toHaveClass('custom-class-b')
resolve()
})
@@ -1337,6 +1343,32 @@ describe('Tooltip', () => {
expect(tooltip._getTitle()).toEqual('test')
})
+
+ it('should call title function with trigger element', () => {
+ fixtureEl.innerHTML = ''
+
+ const tooltipEl = fixtureEl.querySelector('a')
+ const tooltip = new Tooltip(tooltipEl, {
+ title(el) {
+ return el.dataset.foo
+ }
+ })
+
+ expect(tooltip._getTitle()).toEqual('bar')
+ })
+
+ it('should call title function with correct this value', () => {
+ fixtureEl.innerHTML = ''
+
+ const tooltipEl = fixtureEl.querySelector('a')
+ const tooltip = new Tooltip(tooltipEl, {
+ title() {
+ return this.dataset.foo
+ }
+ })
+
+ expect(tooltip._getTitle()).toEqual('bar')
+ })
})
describe('getInstance', () => {
diff --git a/js/tests/unit/util/index.spec.js b/js/tests/unit/util/index.spec.js
index 4065a9168032..9e154818f288 100644
--- a/js/tests/unit/util/index.spec.js
+++ b/js/tests/unit/util/index.spec.js
@@ -521,10 +521,10 @@ describe('Util', () => {
it('should execute if arg is function & return the result', () => {
const functionFoo = (num1, num2 = 10) => num1 + num2
- const resultFoo = Util.execute(functionFoo, [4, 5])
+ const resultFoo = Util.execute(functionFoo, [undefined, 4, 5])
expect(resultFoo).toBe(9)
- const resultFoo1 = Util.execute(functionFoo, [4])
+ const resultFoo1 = Util.execute(functionFoo, [undefined, 4])
expect(resultFoo1).toBe(14)
const functionBar = () => 'foo'