Skip to content

Commit

Permalink
Fix wrong carousel transformation, direction to order (#33499)
Browse files Browse the repository at this point in the history
  • Loading branch information
@GeoSot
GeoSot authored Apr 7, 2021
1 parent 800aa62 commit 0795a77
Show file tree
Hide file tree
Showing 2 changed files with 26 additions and 26 deletions.
12 changes: 6 additions & 6 deletions js/src/carousel.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -336,10 +336,10 @@ class Carousel extends BaseComponent {

if (event.key === ARROW_LEFT_KEY) {
event.preventDefault()
this._slide(DIRECTION_LEFT)
this._slide(DIRECTION_RIGHT)
} else if (event.key === ARROW_RIGHT_KEY) {
event.preventDefault()
this._slide(DIRECTION_RIGHT)
this._slide(DIRECTION_LEFT)
}
}

Expand Down Expand Up @@ -509,10 +509,10 @@ class Carousel extends BaseComponent {
}

if (isRTL()) {
return direction === DIRECTION_RIGHT ? ORDER_PREV : ORDER_NEXT
return direction === DIRECTION_LEFT ? ORDER_PREV : ORDER_NEXT
}

return direction === DIRECTION_RIGHT ? ORDER_NEXT : ORDER_PREV
return direction === DIRECTION_LEFT ? ORDER_NEXT : ORDER_PREV
}

_orderToDirection(order) {
Expand All @@ -521,10 +521,10 @@ class Carousel extends BaseComponent {
}

if (isRTL()) {
return order === ORDER_NEXT ? DIRECTION_LEFT : DIRECTION_RIGHT
return order === ORDER_PREV ? DIRECTION_LEFT : DIRECTION_RIGHT
}

return order === ORDER_NEXT ? DIRECTION_RIGHT : DIRECTION_LEFT
return order === ORDER_PREV ? DIRECTION_RIGHT : DIRECTION_LEFT
}

// Static
Expand Down
40 changes: 20 additions & 20 deletions js/tests/unit/carousel.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -317,7 +317,7 @@ describe('Carousel', () => {
expect(carousel._addTouchEventListeners).toHaveBeenCalled()
})

it('should allow swiperight and call _slide with pointer events', done => {
it('should allow swiperight and call _slide (prev) with pointer events', done => {
if (!supportPointerEvent) {
expect().nothing()
done()
Expand Down Expand Up @@ -362,7 +362,7 @@ describe('Carousel', () => {
})
})

it('should allow swipeleft and call previous with pointer events', done => {
it('should allow swipeleft and call next with pointer events', done => {
if (!supportPointerEvent) {
expect().nothing()
done()
Expand Down Expand Up @@ -408,7 +408,7 @@ describe('Carousel', () => {
})
})

it('should allow swiperight and call _slide with touch events', done => {
it('should allow swiperight and call _slide (prev) with touch events', done => {
Simulator.setType('touch')
clearPointerEvents()
document.documentElement.ontouchstart = () => {}
Expand Down Expand Up @@ -447,7 +447,7 @@ describe('Carousel', () => {
})
})

it('should allow swipeleft and call _slide with touch events', done => {
it('should allow swipeleft and call _slide (next) with touch events', done => {
Simulator.setType('touch')
clearPointerEvents()
document.documentElement.ontouchstart = () => {}
Expand Down Expand Up @@ -601,7 +601,7 @@ describe('Carousel', () => {
const carousel = new Carousel(carouselEl, {})

const onSlide = e => {
expect(e.direction).toEqual('right')
expect(e.direction).toEqual('left')
expect(e.relatedTarget.classList.contains('carousel-item')).toEqual(true)
expect(e.from).toEqual(0)
expect(e.to).toEqual(1)
Expand All @@ -613,7 +613,7 @@ describe('Carousel', () => {
}

const onSlide2 = e => {
expect(e.direction).toEqual('left')
expect(e.direction).toEqual('right')
done()
}

Expand All @@ -636,7 +636,7 @@ describe('Carousel', () => {
const carousel = new Carousel(carouselEl, {})

const onSlid = e => {
expect(e.direction).toEqual('right')
expect(e.direction).toEqual('left')
expect(e.relatedTarget.classList.contains('carousel-item')).toEqual(true)
expect(e.from).toEqual(0)
expect(e.to).toEqual(1)
Expand All @@ -648,7 +648,7 @@ describe('Carousel', () => {
}

const onSlid2 = e => {
expect(e.direction).toEqual('left')
expect(e.direction).toEqual('right')
done()
}

Expand Down Expand Up @@ -1069,13 +1069,13 @@ describe('Carousel', () => {
const carouselEl = fixtureEl.querySelector('div')
const carousel = new Carousel(carouselEl, {})

expect(carousel._directionToOrder('left')).toEqual('prev')
expect(carousel._directionToOrder('left')).toEqual('next')
expect(carousel._directionToOrder('prev')).toEqual('prev')
expect(carousel._directionToOrder('right')).toEqual('next')
expect(carousel._directionToOrder('right')).toEqual('prev')
expect(carousel._directionToOrder('next')).toEqual('next')

expect(carousel._orderToDirection('next')).toEqual('right')
expect(carousel._orderToDirection('prev')).toEqual('left')
expect(carousel._orderToDirection('next')).toEqual('left')
expect(carousel._orderToDirection('prev')).toEqual('right')
})

it('"_directionToOrder" and "_orderToDirection" must return the right results when rtl=true', () => {
Expand All @@ -1086,13 +1086,13 @@ describe('Carousel', () => {
const carousel = new Carousel(carouselEl, {})
expect(util.isRTL()).toEqual(true, 'rtl has to be true')

expect(carousel._directionToOrder('left')).toEqual('next')
expect(carousel._directionToOrder('left')).toEqual('prev')
expect(carousel._directionToOrder('prev')).toEqual('prev')
expect(carousel._directionToOrder('right')).toEqual('prev')
expect(carousel._directionToOrder('right')).toEqual('next')
expect(carousel._directionToOrder('next')).toEqual('next')

expect(carousel._orderToDirection('next')).toEqual('left')
expect(carousel._orderToDirection('prev')).toEqual('right')
expect(carousel._orderToDirection('next')).toEqual('right')
expect(carousel._orderToDirection('prev')).toEqual('left')
document.documentElement.dir = 'ltl'
})

Expand All @@ -1106,11 +1106,11 @@ describe('Carousel', () => {

carousel._slide('left')
expect(spy).toHaveBeenCalledWith('left')
expect(spy2).toHaveBeenCalledWith('prev')
expect(spy2).toHaveBeenCalledWith('next')

carousel._slide('right')
expect(spy).toHaveBeenCalledWith('right')
expect(spy2).toHaveBeenCalledWith('next')
expect(spy2).toHaveBeenCalledWith('prev')
})

it('"_slide" has to call "_directionToOrder" and "_orderToDirection" when rtl=true', () => {
Expand All @@ -1124,11 +1124,11 @@ describe('Carousel', () => {

carousel._slide('left')
expect(spy).toHaveBeenCalledWith('left')
expect(spy2).toHaveBeenCalledWith('next')
expect(spy2).toHaveBeenCalledWith('prev')

carousel._slide('right')
expect(spy).toHaveBeenCalledWith('right')
expect(spy2).toHaveBeenCalledWith('prev')
expect(spy2).toHaveBeenCalledWith('next')

document.documentElement.dir = 'ltl'
})
Expand Down

0 comments on commit 0795a77

Please sign in to comment.