Skip to content

Commit

Permalink
Risky Changes
Browse files Browse the repository at this point in the history
  • Loading branch information
@GeoSot
GeoSot committed Nov 4, 2021
1 parent 03e831d commit 527dbee
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 106 deletions.
35 changes: 8 additions & 27 deletions js/src/carousel.js
View file
Expand Up @@ -60,7 +60,6 @@ const SELECTOR_ACTIVE = '.active'
const SELECTOR_ITEM = '.carousel-item'
const SELECTOR_ACTIVE_ITEM = SELECTOR_ACTIVE + SELECTOR_ITEM
const SELECTOR_ITEM_IMG = '.carousel-item img'
const SELECTOR_NEXT_PREV = '.carousel-item-next, .carousel-item-prev'
const SELECTOR_INDICATORS = '.carousel-indicators'
const SELECTOR_DATA_SLIDE = '[data-bs-slide], [data-bs-slide-to]'
const SELECTOR_DATA_RIDE = '[data-bs-ride="carousel"]'
Expand Down Expand Up @@ -97,7 +96,6 @@ class Carousel extends BaseComponent {
super(element)

this._interval = null
this._isPaused = false
this._isSliding = false
this.touchTimeout = null
this._swipeHelper = null
Expand Down Expand Up @@ -133,26 +131,15 @@ class Carousel extends BaseComponent {
this._slide(ORDER_PREV)
}

pause(event) {
if (!event) {
this._isPaused = true
}

if (SelectorEngine.findOne(SELECTOR_NEXT_PREV, this._element)) {
triggerTransitionEnd(this._element)
this.cycle(true)
}
pause() {
triggerTransitionEnd(this._element) // just to execute remaining queued Callback

this._clearInterval()
}

cycle(event) {
if (!event) {
this._isPaused = false
}

cycle() {
this._clearInterval()
if (this._config.interval && !this._isPaused) {
if (this._config.interval) {
this._updateInterval()

this._interval = setInterval((this.nextWhenVisible).bind(this), this._config.interval)
Expand All @@ -171,8 +158,6 @@ class Carousel extends BaseComponent {

const activeIndex = this._getItemIndex(this._getActive())
if (activeIndex === index) {
this.pause()
this.cycle()
return
}

Expand Down Expand Up @@ -209,8 +194,8 @@ class Carousel extends BaseComponent {
}

if (this._config.pause === 'hover') {
EventHandler.on(this._element, EVENT_MOUSEENTER, event => this.pause(event))
EventHandler.on(this._element, EVENT_MOUSELEAVE, event => this.cycle(event))
EventHandler.on(this._element, EVENT_MOUSEENTER, () => this.pause())
EventHandler.on(this._element, EVENT_MOUSELEAVE, () => this.cycle())
}

if (this._config.touch && Swipe.isSupported()) {
Expand Down Expand Up @@ -238,7 +223,7 @@ class Carousel extends BaseComponent {
clearTimeout(this.touchTimeout)
}

this.touchTimeout = setTimeout(event => this.cycle(event), TOUCHEVENT_COMPAT_WAIT + this._config.interval)
this.touchTimeout = setTimeout(() => this.cycle(), TOUCHEVENT_COMPAT_WAIT + this._config.interval)
}
}

Expand Down Expand Up @@ -356,13 +341,10 @@ class Carousel extends BaseComponent {
this._isSliding = false

triggerEvent(EVENT_SLID)
this.cycle()
}

this._queueCallback(completeCallBack, activeElement, this._isAnimated())

if (this._interval) {
this.cycle()
}
}

_isAnimated() {
Expand Down Expand Up @@ -437,7 +419,6 @@ class Carousel extends BaseComponent {
}

if (_config.interval && _config.ride) {
data.pause()
data.cycle()
}
})
Expand Down
82 changes: 3 additions & 79 deletions js/tests/unit/carousel.spec.js
View file
Expand Up @@ -839,32 +839,6 @@ describe('Carousel', () => {
})

describe('pause', () => {
it('should call cycle if the carousel have carousel-item-next and carousel-item-prev class', () => {
fixtureEl.innerHTML = [
'<div id="myCarousel" class="carousel slide">',
' <div class="carousel-inner">',
' <div class="carousel-item active">item 1</div>',
' <div class="carousel-item carousel-item-next">item 2</div>',
' <div class="carousel-item">item 3</div>',
' </div>',
' <div class="carousel-control-prev"></div>',
' <div class="carousel-control-next"></div>',
'</div>'
].join('')

const carouselEl = fixtureEl.querySelector('#myCarousel')
const carousel = new Carousel(carouselEl)

spyOn(carousel, 'cycle')
spyOn(carousel, '_clearInterval')

carousel.pause()

expect(carousel.cycle).toHaveBeenCalledWith(true)
expect(carousel._clearInterval).toHaveBeenCalled()
expect(carousel._isPaused).toEqual(true)
})

it('should not call cycle if nothing is in transition', () => {
fixtureEl.innerHTML = [
'<div id="myCarousel" class="carousel slide">',
Expand All @@ -888,32 +862,6 @@ describe('Carousel', () => {

expect(carousel.cycle).not.toHaveBeenCalled()
expect(carousel._clearInterval).toHaveBeenCalled()
expect(carousel._isPaused).toEqual(true)
})

it('should not set is paused at true if an event is passed', () => {
fixtureEl.innerHTML = [
'<div id="myCarousel" 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>',
' <div class="carousel-control-prev"></div>',
' <div class="carousel-control-next"></div>',
'</div>'
].join('')

const carouselEl = fixtureEl.querySelector('#myCarousel')
const carousel = new Carousel(carouselEl)
const event = createEvent('mouseenter')

spyOn(carousel, '_clearInterval')

carousel.pause(event)

expect(carousel._clearInterval).toHaveBeenCalled()
expect(carousel._isPaused).toEqual(false)
})
})

Expand Down Expand Up @@ -941,30 +889,6 @@ describe('Carousel', () => {
expect(window.setInterval).toHaveBeenCalled()
})

it('should not set interval if the carousel is paused', () => {
fixtureEl.innerHTML = [
'<div id="myCarousel" 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>',
' <div class="carousel-control-prev"></div>',
' <div class="carousel-control-next"></div>',
'</div>'
].join('')

const carouselEl = fixtureEl.querySelector('#myCarousel')
const carousel = new Carousel(carouselEl)

spyOn(window, 'setInterval').and.callThrough()

carousel._isPaused = true
carousel.cycle(true)

expect(window.setInterval).not.toHaveBeenCalled()
})

it('should clear interval if there is one', () => {
fixtureEl.innerHTML = [
'<div id="myCarousel" class="carousel slide">',
Expand Down Expand Up @@ -1098,7 +1022,7 @@ describe('Carousel', () => {
expect(spy).not.toHaveBeenCalled()
})

it('should call pause and cycle is the provided is the same compare to the current one', () => {
it('should NOT call `pause` and `cycle` if the provided is the same compare to the current one', () => {
fixtureEl.innerHTML = [
'<div id="myCarousel" class="carousel slide">',
' <div class="carousel-inner">',
Expand All @@ -1119,8 +1043,8 @@ describe('Carousel', () => {
carousel.to(0)

expect(carousel._slide).not.toHaveBeenCalled()
expect(carousel.pause).toHaveBeenCalled()
expect(carousel.cycle).toHaveBeenCalled()
expect(carousel.pause).not.toHaveBeenCalled()
expect(carousel.cycle).not.toHaveBeenCalled()
})

it('should wait before performing to if a slide is sliding', done => {
Expand Down

0 comments on commit 527dbee

Please sign in to comment.