Fix wrong carousel transformation, direction to order (#33499)

This commit is contained in:
GeoSot 2021-04-07 08:29:31 +03:00 committed by GitHub
parent 800aa622d3
commit 0795a778f2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 26 deletions

View File

@ -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)
}
}
@ -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) {
@ -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

View File

@ -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()
@ -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()
@ -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 = () => {}
@ -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 = () => {}
@ -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)
@ -613,7 +613,7 @@ describe('Carousel', () => {
}
const onSlide2 = e => {
expect(e.direction).toEqual('left')
expect(e.direction).toEqual('right')
done()
}
@ -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)
@ -648,7 +648,7 @@ describe('Carousel', () => {
}
const onSlid2 = e => {
expect(e.direction).toEqual('left')
expect(e.direction).toEqual('right')
done()
}
@ -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', () => {
@ -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'
})
@ -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', () => {
@ -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'
})