1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-14 09:34:36 +02:00

Make carousel indicators actual buttons

This commit is contained in:
Patrick H. Lauke
2021-01-03 13:06:58 +02:00
committed by XhmikosR
parent 1fd34a1a2c
commit a882614c45
9 changed files with 70 additions and 59 deletions

View File

@@ -659,11 +659,11 @@ describe('Carousel', () => {
it('should update indicators if present', done => {
fixtureEl.innerHTML = [
'<div id="myCarousel" class="carousel slide">',
' <ol class="carousel-indicators">',
' <li data-bs-target="#myCarousel" data-bs-slide-to="0" class="active"></li>',
' <li id="secondIndicator" data-bs-target="#myCarousel" data-bs-slide-to="1"></li>',
' <li data-bs-target="#myCarousel" data-bs-slide-to="2"></li>',
' </ol>',
' <div class="carousel-indicators">',
' <button type="button" id="firstIndicator" data-bs-target="myCarousel" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>',
' <button type="button" id="secondIndicator" data-bs-target="myCarousel" data-bs-slide-to="1" aria-label="Slide 2"></button>',
' <button type="button" data-bs-target="myCarousel" data-bs-slide-to="2" aria-label="Slide 3"></button>',
' </div>',
' <div class="carousel-inner">',
' <div class="carousel-item active">item 1</div>',
' <div class="carousel-item" data-bs-interval="7">item 2</div>',
@@ -673,11 +673,15 @@ describe('Carousel', () => {
].join('')
const carouselEl = fixtureEl.querySelector('#myCarousel')
const firstIndicator = fixtureEl.querySelector('#firstIndicator')
const secondIndicator = fixtureEl.querySelector('#secondIndicator')
const carousel = new Carousel(carouselEl)
carouselEl.addEventListener('slid.bs.carousel', () => {
expect(firstIndicator.classList.contains('active')).toEqual(false)
expect(firstIndicator.hasAttribute('aria-current')).toEqual(false)
expect(secondIndicator.classList.contains('active')).toEqual(true)
expect(secondIndicator.getAttribute('aria-current')).toEqual('true')
done()
})