0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-18 10:52:19 +01:00

Fix carousel buttons (#34266)

* test(carousel): add test to check if next/prev button work as intended

* fix(carousel): merge passed config with instance config in carouselInterface
This commit is contained in:
alpadev 2021-06-16 06:48:23 +02:00 committed by GitHub
parent 9485172017
commit d62ba935ef
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 36 additions and 1 deletions

View File

@ -498,7 +498,14 @@ class Carousel extends BaseComponent {
static carouselInterface(element, config) {
const data = Carousel.getOrCreateInstance(element, config)
const { _config } = data
let { _config } = data
if (typeof config === 'object') {
_config = {
..._config,
...config
}
}
const action = typeof config === 'string' ? config : _config.slide
if (typeof config === 'number') {

View File

@ -707,6 +707,34 @@ describe('Carousel', () => {
carousel.next()
})
it('should call next()/prev() instance methods when clicking the respective direction buttons', () => {
fixtureEl.innerHTML = [
'<div id="carousel" class="carousel slide">',
' <div class="carousel-inner">',
' <div class="carousel-item active">item 1</div>',
' <div class="carousel-item">item 2</div>',
' <div class="carousel-item">item 3</div>',
' </div>',
' <button class="carousel-control-prev" type="button" data-bs-target="#carousel" data-bs-slide="prev"></button>',
' <button class="carousel-control-next" type="button" data-bs-target="#carousel" data-bs-slide="next"></button>',
'</div>'
].join('')
const carouselEl = fixtureEl.querySelector('#carousel')
const prevBtnEl = fixtureEl.querySelector('.carousel-control-prev')
const nextBtnEl = fixtureEl.querySelector('.carousel-control-next')
const carousel = new Carousel(carouselEl)
const nextSpy = spyOn(carousel, 'next')
const prevSpy = spyOn(carousel, 'prev')
nextBtnEl.click()
prevBtnEl.click()
expect(nextSpy).toHaveBeenCalled()
expect(prevSpy).toHaveBeenCalled()
})
})
describe('nextWhenVisible', () => {