From 3cc61a61784156b8a2992ef1e07372d445255f36 Mon Sep 17 00:00:00 2001 From: Marek Rozmus Date: Sat, 6 Feb 2021 14:28:29 +0100 Subject: [PATCH] Disable old test --- src/__tests__/SwipeableList.test.js | 436 +++++------ src/__tests__/SwipeableListItem.test.js | 926 ++++++++++++------------ 2 files changed, 691 insertions(+), 671 deletions(-) diff --git a/src/__tests__/SwipeableList.test.js b/src/__tests__/SwipeableList.test.js index 1c64b54..25bfcd4 100644 --- a/src/__tests__/SwipeableList.test.js +++ b/src/__tests__/SwipeableList.test.js @@ -13,249 +13,251 @@ import { afterEach(cleanup); -test('list rendering with items', () => { - const { container, getByText } = render( - - - Item content 1 - - - Item content 2 - - - ); +describe.skip('SwipeableList', () => { + test('list rendering with items', () => { + const { container, getByText } = render( + + + Item content 1 + + + Item content 2 + + + ); - expect(getByText('Item content 1')).toBeInTheDocument(); - expect(getByText('Item content 2')).toBeInTheDocument(); - expect(container.firstChild).toHaveClass('swipeable-list'); -}); + expect(getByText('Item content 1')).toBeInTheDocument(); + expect(getByText('Item content 2')).toBeInTheDocument(); + expect(container.firstChild).toHaveClass('swipeable-list'); + }); -test('list rendering with items when child as function', () => { - const { container, getByText } = render( - - {props => ( - <> - - Item content 1 - - - Item content 2 - - - )} - - ); + test('list rendering with items when child as function', () => { + const { container, getByText } = render( + + {props => ( + <> + + Item content 1 + + + Item content 2 + + + )} + + ); - expect(getByText('Item content 1')).toBeInTheDocument(); - expect(getByText('Item content 2')).toBeInTheDocument(); - expect(container.firstChild).not.toHaveClass('swipeable-list'); -}); + expect(getByText('Item content 1')).toBeInTheDocument(); + expect(getByText('Item content 2')).toBeInTheDocument(); + expect(container.firstChild).not.toHaveClass('swipeable-list'); + }); -test('passing className to child function', () => { - const { container, getByTestId } = render( - - {({ className }) => ( -
-
-
- )} - - ); + test('passing className to child function', () => { + const { container, getByTestId } = render( + + {({ className }) => ( +
+
+
+ )} + + ); - expect(container.firstChild).not.toHaveClass('swipeable-list'); - expect(getByTestId('tested-div')).toHaveClass('swipeable-list'); -}); + expect(container.firstChild).not.toHaveClass('swipeable-list'); + expect(getByTestId('tested-div')).toHaveClass('swipeable-list'); + }); -test('blocking swipe on scroll', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); + test('blocking swipe on scroll', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); - const { queryAllByTestId } = render( - - Left swipe content, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - action: callbackRight, - }} - > - Item content 1 - - - ); + const { queryAllByTestId } = render( + + Left swipe content, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + action: callbackRight, + }} + > + Item content 1 + + + ); - const listItem = queryAllByTestId('content')[0]; + const listItem = queryAllByTestId('content')[0]; - makeMouseGesture(listItem, [Direction.North]); - makeMouseGesture(listItem, [Direction.NorthEast]); - makeMouseGesture(listItem, [Direction.NorthWest]); - makeMouseGesture(listItem, [Direction.South]); - makeMouseGesture(listItem, [Direction.SouthEast]); - makeMouseGesture(listItem, [Direction.SouthWest]); - makeMouseGesture(listItem, [Direction.North, Direction.East]); - makeMouseGesture(listItem, [Direction.North, Direction.West]); - makeMouseGesture(listItem, [Direction.NorthEast, Direction.East]); - makeMouseGesture(listItem, [Direction.NorthEast, Direction.West]); - makeMouseGesture(listItem, [Direction.NorthWest, Direction.East]); - makeMouseGesture(listItem, [Direction.NorthWest, Direction.West]); - makeMouseGesture(listItem, [Direction.South, Direction.East]); - makeMouseGesture(listItem, [Direction.South, Direction.West]); - makeMouseGesture(listItem, [Direction.SouthEast, Direction.East]); - makeMouseGesture(listItem, [Direction.SouthEast, Direction.West]); - makeMouseGesture(listItem, [Direction.SouthWest, Direction.East]); - makeMouseGesture(listItem, [Direction.SouthWest, Direction.West]); - expect(callbackLeft).toHaveBeenCalledTimes(0); - expect(callbackRight).toHaveBeenCalledTimes(0); + makeMouseGesture(listItem, [Direction.North]); + makeMouseGesture(listItem, [Direction.NorthEast]); + makeMouseGesture(listItem, [Direction.NorthWest]); + makeMouseGesture(listItem, [Direction.South]); + makeMouseGesture(listItem, [Direction.SouthEast]); + makeMouseGesture(listItem, [Direction.SouthWest]); + makeMouseGesture(listItem, [Direction.North, Direction.East]); + makeMouseGesture(listItem, [Direction.North, Direction.West]); + makeMouseGesture(listItem, [Direction.NorthEast, Direction.East]); + makeMouseGesture(listItem, [Direction.NorthEast, Direction.West]); + makeMouseGesture(listItem, [Direction.NorthWest, Direction.East]); + makeMouseGesture(listItem, [Direction.NorthWest, Direction.West]); + makeMouseGesture(listItem, [Direction.South, Direction.East]); + makeMouseGesture(listItem, [Direction.South, Direction.West]); + makeMouseGesture(listItem, [Direction.SouthEast, Direction.East]); + makeMouseGesture(listItem, [Direction.SouthEast, Direction.West]); + makeMouseGesture(listItem, [Direction.SouthWest, Direction.East]); + makeMouseGesture(listItem, [Direction.SouthWest, Direction.West]); + expect(callbackLeft).toHaveBeenCalledTimes(0); + expect(callbackRight).toHaveBeenCalledTimes(0); - makeTouchGesture(listItem, [Direction.North]); - makeTouchGesture(listItem, [Direction.NorthEast]); - makeTouchGesture(listItem, [Direction.NorthWest]); - makeTouchGesture(listItem, [Direction.South]); - makeTouchGesture(listItem, [Direction.SouthEast]); - makeTouchGesture(listItem, [Direction.SouthWest]); - makeTouchGesture(listItem, [Direction.North, Direction.East]); - makeTouchGesture(listItem, [Direction.North, Direction.West]); - makeTouchGesture(listItem, [Direction.NorthEast, Direction.East]); - makeTouchGesture(listItem, [Direction.NorthEast, Direction.West]); - makeTouchGesture(listItem, [Direction.NorthWest, Direction.East]); - makeTouchGesture(listItem, [Direction.NorthWest, Direction.West]); - makeTouchGesture(listItem, [Direction.South, Direction.East]); - makeTouchGesture(listItem, [Direction.South, Direction.West]); - makeTouchGesture(listItem, [Direction.SouthEast, Direction.East]); - makeTouchGesture(listItem, [Direction.SouthEast, Direction.West]); - makeTouchGesture(listItem, [Direction.SouthWest, Direction.East]); - makeTouchGesture(listItem, [Direction.SouthWest, Direction.West]); - expect(callbackLeft).toHaveBeenCalledTimes(0); - expect(callbackRight).toHaveBeenCalledTimes(0); + makeTouchGesture(listItem, [Direction.North]); + makeTouchGesture(listItem, [Direction.NorthEast]); + makeTouchGesture(listItem, [Direction.NorthWest]); + makeTouchGesture(listItem, [Direction.South]); + makeTouchGesture(listItem, [Direction.SouthEast]); + makeTouchGesture(listItem, [Direction.SouthWest]); + makeTouchGesture(listItem, [Direction.North, Direction.East]); + makeTouchGesture(listItem, [Direction.North, Direction.West]); + makeTouchGesture(listItem, [Direction.NorthEast, Direction.East]); + makeTouchGesture(listItem, [Direction.NorthEast, Direction.West]); + makeTouchGesture(listItem, [Direction.NorthWest, Direction.East]); + makeTouchGesture(listItem, [Direction.NorthWest, Direction.West]); + makeTouchGesture(listItem, [Direction.South, Direction.East]); + makeTouchGesture(listItem, [Direction.South, Direction.West]); + makeTouchGesture(listItem, [Direction.SouthEast, Direction.East]); + makeTouchGesture(listItem, [Direction.SouthEast, Direction.West]); + makeTouchGesture(listItem, [Direction.SouthWest, Direction.East]); + makeTouchGesture(listItem, [Direction.SouthWest, Direction.West]); + expect(callbackLeft).toHaveBeenCalledTimes(0); + expect(callbackRight).toHaveBeenCalledTimes(0); - makeMouseGesture(listItem, [Direction.East]); - expect(callbackRight).toHaveBeenCalledTimes(1); + makeMouseGesture(listItem, [Direction.East]); + expect(callbackRight).toHaveBeenCalledTimes(1); - makeTouchGesture(listItem, [Direction.East]); - expect(callbackRight).toHaveBeenCalledTimes(2); + makeTouchGesture(listItem, [Direction.East]); + expect(callbackRight).toHaveBeenCalledTimes(2); - makeMouseGesture(listItem, [Direction.West]); - expect(callbackLeft).toHaveBeenCalledTimes(1); + makeMouseGesture(listItem, [Direction.West]); + expect(callbackLeft).toHaveBeenCalledTimes(1); - makeTouchGesture(listItem, [Direction.West]); - expect(callbackLeft).toHaveBeenCalledTimes(2); -}); + makeTouchGesture(listItem, [Direction.West]); + expect(callbackLeft).toHaveBeenCalledTimes(2); + }); -test('swipe start threshold', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); + test('swipe start threshold', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); - const { queryAllByTestId } = render( - - Left swipe content, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - action: callbackRight, - }} - > - Item content 1 - - - ); + const { queryAllByTestId } = render( + + Left swipe content, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + action: callbackRight, + }} + > + Item content 1 + + + ); - const listItem = queryAllByTestId('content')[0]; + const listItem = queryAllByTestId('content')[0]; - makeMouseGesture(listItem, [Direction.East]); - expect(callbackRight).toHaveBeenCalledTimes(0); + makeMouseGesture(listItem, [Direction.East]); + expect(callbackRight).toHaveBeenCalledTimes(0); - makeMouseGesture(listItem, [Direction.West]); - expect(callbackLeft).toHaveBeenCalledTimes(0); + makeMouseGesture(listItem, [Direction.West]); + expect(callbackLeft).toHaveBeenCalledTimes(0); - makeTouchGesture(listItem, [Direction.East]); - expect(callbackRight).toHaveBeenCalledTimes(0); + makeTouchGesture(listItem, [Direction.East]); + expect(callbackRight).toHaveBeenCalledTimes(0); - makeTouchGesture(listItem, [Direction.West]); - expect(callbackLeft).toHaveBeenCalledTimes(0); -}); + makeTouchGesture(listItem, [Direction.West]); + expect(callbackLeft).toHaveBeenCalledTimes(0); + }); -test('blocking scroll on swipe', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); + test('blocking scroll on swipe', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); - const { queryAllByTestId } = render( - - Left swipe content, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - action: callbackRight, - }} - > - Item content 1 - - - ); + const { queryAllByTestId } = render( + + Left swipe content, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + action: callbackRight, + }} + > + Item content 1 + + + ); - const listItem = queryAllByTestId('content')[0]; + const listItem = queryAllByTestId('content')[0]; - makeMouseGesture(listItem, [ - Direction.North, - Direction.East, - Direction.East, - Direction.East, - ]); - makeMouseGesture(listItem, [ - Direction.South, - Direction.East, - Direction.East, - Direction.East, - ]); - makeMouseGesture(listItem, [ - Direction.North, - Direction.West, - Direction.West, - Direction.West, - ]); - makeMouseGesture(listItem, [ - Direction.South, - Direction.West, - Direction.West, - Direction.West, - ]); + makeMouseGesture(listItem, [ + Direction.North, + Direction.East, + Direction.East, + Direction.East, + ]); + makeMouseGesture(listItem, [ + Direction.South, + Direction.East, + Direction.East, + Direction.East, + ]); + makeMouseGesture(listItem, [ + Direction.North, + Direction.West, + Direction.West, + Direction.West, + ]); + makeMouseGesture(listItem, [ + Direction.South, + Direction.West, + Direction.West, + Direction.West, + ]); - expect(callbackLeft).toHaveBeenCalledTimes(2); - expect(callbackRight).toHaveBeenCalledTimes(2); + expect(callbackLeft).toHaveBeenCalledTimes(2); + expect(callbackRight).toHaveBeenCalledTimes(2); - makeTouchGesture(listItem, [ - Direction.North, - Direction.East, - Direction.East, - Direction.East, - ]); - makeTouchGesture(listItem, [ - Direction.South, - Direction.East, - Direction.East, - Direction.East, - ]); - makeTouchGesture(listItem, [ - Direction.North, - Direction.West, - Direction.West, - Direction.West, - ]); - makeTouchGesture(listItem, [ - Direction.South, - Direction.West, - Direction.West, - Direction.West, - ]); + makeTouchGesture(listItem, [ + Direction.North, + Direction.East, + Direction.East, + Direction.East, + ]); + makeTouchGesture(listItem, [ + Direction.South, + Direction.East, + Direction.East, + Direction.East, + ]); + makeTouchGesture(listItem, [ + Direction.North, + Direction.West, + Direction.West, + Direction.West, + ]); + makeTouchGesture(listItem, [ + Direction.South, + Direction.West, + Direction.West, + Direction.West, + ]); - expect(callbackLeft).toHaveBeenCalledTimes(4); - expect(callbackRight).toHaveBeenCalledTimes(4); + expect(callbackLeft).toHaveBeenCalledTimes(4); + expect(callbackRight).toHaveBeenCalledTimes(4); + }); }); diff --git a/src/__tests__/SwipeableListItem.test.js b/src/__tests__/SwipeableListItem.test.js index f6f0446..6327c2f 100644 --- a/src/__tests__/SwipeableListItem.test.js +++ b/src/__tests__/SwipeableListItem.test.js @@ -12,458 +12,476 @@ import { afterEach(cleanup); -test('item rendering without any swipe content', () => { - const { getByText, queryByTestId } = render( - - Item content - - ); - - expect(getByText('Item content')).toBeInTheDocument(); - expect(queryByTestId('swipe-left-content')).not.toBeInTheDocument(); - expect(queryByTestId('swipe-right-content')).not.toBeInTheDocument(); -}); - -test('item rendering with left swipe content only', () => { - const { queryByTestId, getByText } = render( - Left swipe content, - action: jest.fn(), - }} - > - Item content - - ); - - expect(getByText('Item content')).toBeInTheDocument(); - expect(queryByTestId('swipe-left-content')).toBeInTheDocument(); - expect(queryByTestId('swipe-right-content')).not.toBeInTheDocument(); - expect(getByText('Left swipe content')).toBeInTheDocument(); -}); - -test('item rendering with right swipe content only', () => { - const { queryByTestId, getByText } = render( - Right swipe content, - action: jest.fn(), - }} - > - Item content - - ); - - expect(getByText('Item content')).toBeInTheDocument(); - expect(queryByTestId('swipe-right-content')).toBeInTheDocument(); - expect(queryByTestId('swipe-left-content')).not.toBeInTheDocument(); - expect(getByText('Right swipe content')).toBeInTheDocument(); -}); - -test('item rendering with left and right swipe content', () => { - const { queryByTestId, getByText } = render( - Left swipe content, - action: jest.fn(), - }} - swipeRight={{ - content: Right swipe content, - action: jest.fn(), - }} - > - Item content - - ); - - expect(getByText('Item content')).toBeInTheDocument(); - expect(queryByTestId('swipe-right-content')).toBeInTheDocument(); - expect(queryByTestId('swipe-left-content')).toBeInTheDocument(); - expect(getByText('Right swipe content')).toBeInTheDocument(); - expect(getByText('Left swipe content')).toBeInTheDocument(); -}); - -test('left swipe action triggering', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - action: callbackRight, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - swipeLeftMouse(contentContainer); - swipeLeftTouch(contentContainer); - - expect(callbackLeft).toHaveBeenCalledTimes(2); - expect(callbackRight).toHaveBeenCalledTimes(0); -}); - -test('right swipe action triggering', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - action: callbackRight, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - swipeRightMouse(contentContainer); - swipeRightTouch(contentContainer); - - expect(callbackLeft).toHaveBeenCalledTimes(0); - expect(callbackRight).toHaveBeenCalledTimes(2); -}); - -test('swipe actions blocking on click (mouse/touch down/up)', () => { - const callbackLeft = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - action: callbackLeft, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - fireEvent.mouseDown(contentContainer, { clientX: 250, clientY: 20 }); - fireEvent.mouseUp(contentContainer, { clientX: 100, clientY: 20 }); - fireEvent.mouseMove(contentContainer, { clientX: 100, clientY: 20 }); - fireEvent.mouseDown(contentContainer, { clientX: 100, clientY: 20 }); - fireEvent.mouseUp(contentContainer, { clientX: 100, clientY: 20 }); - - expect(callbackLeft).toHaveBeenCalledTimes(0); -}); - -test('left swipe action triggering if no right swipe defined', () => { - const callbackLeft = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - action: callbackLeft, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - swipeLeftMouse(contentContainer); - swipeLeftTouch(contentContainer); - swipeRightMouse(contentContainer); - swipeRightTouch(contentContainer); - - expect(callbackLeft).toHaveBeenCalledTimes(2); -}); - -test('right swipe action triggering if no left swipe defined', () => { - const callbackRight = jest.fn(); - - const { getByTestId } = render( - Right swipe content, - action: callbackRight, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - swipeLeftMouse(contentContainer); - swipeLeftTouch(contentContainer); - swipeRightMouse(contentContainer); - swipeRightTouch(contentContainer); - - expect(callbackRight).toHaveBeenCalledTimes(2); -}); - -test('swipe actions triggering if block swipe prop is set', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - action: callbackRight, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - swipeLeftMouse(contentContainer); - swipeLeftTouch(contentContainer); - swipeRightMouse(contentContainer); - swipeRightTouch(contentContainer); - - expect(callbackLeft).toHaveBeenCalledTimes(0); - expect(callbackRight).toHaveBeenCalledTimes(0); -}); - -test('start and end callbacks not triggered if swipe content not defined', () => { - const callbackSwipeStart = jest.fn(); - const callbackSwipeEnd = jest.fn(); - - const { getByTestId } = render( - - Item content - - ); - - const contentContainer = getByTestId('content'); - swipeLeftMouse(contentContainer); - swipeLeftTouch(contentContainer); - swipeRightMouse(contentContainer); - swipeRightTouch(contentContainer); - - expect(callbackSwipeStart).toHaveBeenCalledTimes(0); - expect(callbackSwipeEnd).toHaveBeenCalledTimes(0); -}); - -test('start and end callbacks not triggered if blockSwipe is set', () => { - const callbackSwipeStart = jest.fn(); - const callbackSwipeEnd = jest.fn(); - const callbackLeft = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - action: callbackLeft, - }} - onSwipeEnd={callbackSwipeEnd} - onSwipeStart={callbackSwipeStart} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - swipeLeftMouse(contentContainer); - swipeLeftTouch(contentContainer); - swipeRightMouse(contentContainer); - swipeRightTouch(contentContainer); - - expect(callbackSwipeStart).toHaveBeenCalledTimes(0); - expect(callbackSwipeEnd).toHaveBeenCalledTimes(0); -}); - -test('start and end callbacks triggered if swipe content is defined', () => { - const callbackSwipeStart = jest.fn(); - const callbackSwipeEnd = jest.fn(); - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - action: callbackRight, - }} - onSwipeEnd={callbackSwipeEnd} - onSwipeStart={callbackSwipeStart} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - swipeLeftMouse(contentContainer); - swipeLeftTouch(contentContainer); - swipeRightMouse(contentContainer); - swipeRightTouch(contentContainer); - - expect(callbackSwipeStart).toHaveBeenCalledTimes(4); - expect(callbackSwipeEnd).toHaveBeenCalledTimes(4); -}); - -test('if remove animation is applied', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - actionAnimation: ActionAnimations.REMOVE, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - actionAnimation: ActionAnimations.REMOVE, - action: callbackRight, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - swipeLeftMouse(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content--remove'); - - swipeLeftTouch(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content--remove'); - - swipeRightMouse(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content--remove'); - - swipeRightTouch(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content--remove'); - - expect(callbackLeft).toBeCalledTimes(2); - expect(callbackRight).toBeCalledTimes(2); -}); - -test('if return animation is applied', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - actionAnimation: ActionAnimations.RETURN, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - action: callbackRight, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - swipeLeftMouse(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content--return'); - - swipeLeftTouch(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content--return'); - - swipeRightMouse(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content--return'); - - swipeRightTouch(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content--return'); - - expect(callbackLeft).toBeCalledTimes(2); - expect(callbackRight).toBeCalledTimes(2); -}); - -test('if none animation is applied', () => { - const callbackLeft = jest.fn(); - const callbackRight = jest.fn(); - - const { getByTestId } = render( - Left swipe content, - actionAnimation: ActionAnimations.NONE, - action: callbackLeft, - }} - swipeRight={{ - content: Right swipe content, - actionAnimation: ActionAnimations.NONE, - action: callbackRight, - }} - > - Item content - - ); - - const contentContainer = getByTestId('content'); - - swipeLeftMouse(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content'); - expect(contentContainer).not.toHaveClass( - 'swipeable-list-item__content--return' - ); - expect(contentContainer).not.toHaveClass( - 'swipeable-list-item__content--remove' - ); - - swipeLeftTouch(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content'); - expect(contentContainer).not.toHaveClass( - 'swipeable-list-item__content--return' - ); - expect(contentContainer).not.toHaveClass( - 'swipeable-list-item__content--remove' - ); - - swipeRightMouse(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content'); - expect(contentContainer).not.toHaveClass( - 'swipeable-list-item__content--return' - ); - expect(contentContainer).not.toHaveClass( - 'swipeable-list-item__content--remove' - ); - - swipeRightTouch(contentContainer); - expect(contentContainer).toHaveClass('swipeable-list-item__content'); - expect(contentContainer).not.toHaveClass( - 'swipeable-list-item__content--return' - ); - expect(contentContainer).not.toHaveClass( - 'swipeable-list-item__content--remove' - ); - - expect(callbackLeft).toBeCalledTimes(2); - expect(callbackRight).toBeCalledTimes(2); +describe.skip('SwipeableListItem', () => { + test('item rendering without any swipe content', () => { + const { getByText, queryByTestId } = render( + + Item content + + ); + + expect(getByText('Item content')).toBeInTheDocument(); + expect(queryByTestId('swipe-left-content')).not.toBeInTheDocument(); + expect(queryByTestId('swipe-right-content')).not.toBeInTheDocument(); + }); + + test('item rendering with left swipe content only', () => { + const { queryByTestId, getByText } = render( + Left swipe content, + action: jest.fn(), + }} + > + Item content + + ); + + expect(getByText('Item content')).toBeInTheDocument(); + expect(queryByTestId('swipe-left-content')).toBeInTheDocument(); + expect(queryByTestId('swipe-right-content')).not.toBeInTheDocument(); + expect(getByText('Left swipe content')).toBeInTheDocument(); + }); + + test('item rendering with right swipe content only', () => { + const { queryByTestId, getByText } = render( + Right swipe content, + action: jest.fn(), + }} + > + Item content + + ); + + expect(getByText('Item content')).toBeInTheDocument(); + expect(queryByTestId('swipe-right-content')).toBeInTheDocument(); + expect(queryByTestId('swipe-left-content')).not.toBeInTheDocument(); + expect(getByText('Right swipe content')).toBeInTheDocument(); + }); + + test('item rendering with left and right swipe content', () => { + const { queryByTestId, getByText } = render( + Left swipe content, + action: jest.fn(), + }} + swipeRight={{ + content: Right swipe content, + action: jest.fn(), + }} + > + Item content + + ); + + expect(getByText('Item content')).toBeInTheDocument(); + expect(queryByTestId('swipe-right-content')).toBeInTheDocument(); + expect(queryByTestId('swipe-left-content')).toBeInTheDocument(); + expect(getByText('Right swipe content')).toBeInTheDocument(); + expect(getByText('Left swipe content')).toBeInTheDocument(); + }); + + test('left swipe action triggering', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + action: callbackRight, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + swipeLeftMouse(contentContainer); + swipeLeftTouch(contentContainer); + + expect(callbackLeft).toHaveBeenCalledTimes(2); + expect(callbackRight).toHaveBeenCalledTimes(0); + }); + + test('right swipe action triggering', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + action: callbackRight, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + swipeRightMouse(contentContainer); + swipeRightTouch(contentContainer); + + expect(callbackLeft).toHaveBeenCalledTimes(0); + expect(callbackRight).toHaveBeenCalledTimes(2); + }); + + test('swipe actions blocking on click (mouse/touch down/up)', () => { + const callbackLeft = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + action: callbackLeft, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + fireEvent.mouseDown(contentContainer, { clientX: 250, clientY: 20 }); + fireEvent.mouseUp(contentContainer, { clientX: 100, clientY: 20 }); + fireEvent.mouseMove(contentContainer, { clientX: 100, clientY: 20 }); + fireEvent.mouseDown(contentContainer, { clientX: 100, clientY: 20 }); + fireEvent.mouseUp(contentContainer, { clientX: 100, clientY: 20 }); + + expect(callbackLeft).toHaveBeenCalledTimes(0); + }); + + test('left swipe action triggering if no right swipe defined', () => { + const callbackLeft = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + action: callbackLeft, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + swipeLeftMouse(contentContainer); + swipeLeftTouch(contentContainer); + swipeRightMouse(contentContainer); + swipeRightTouch(contentContainer); + + expect(callbackLeft).toHaveBeenCalledTimes(2); + }); + + test('right swipe action triggering if no left swipe defined', () => { + const callbackRight = jest.fn(); + + const { getByTestId } = render( + Right swipe content, + action: callbackRight, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + swipeLeftMouse(contentContainer); + swipeLeftTouch(contentContainer); + swipeRightMouse(contentContainer); + swipeRightTouch(contentContainer); + + expect(callbackRight).toHaveBeenCalledTimes(2); + }); + + test('swipe actions triggering if block swipe prop is set', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + action: callbackRight, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + swipeLeftMouse(contentContainer); + swipeLeftTouch(contentContainer); + swipeRightMouse(contentContainer); + swipeRightTouch(contentContainer); + + expect(callbackLeft).toHaveBeenCalledTimes(0); + expect(callbackRight).toHaveBeenCalledTimes(0); + }); + + test('start and end callbacks not triggered if swipe content not defined', () => { + const callbackSwipeStart = jest.fn(); + const callbackSwipeEnd = jest.fn(); + + const { getByTestId } = render( + + Item content + + ); + + const contentContainer = getByTestId('content'); + swipeLeftMouse(contentContainer); + swipeLeftTouch(contentContainer); + swipeRightMouse(contentContainer); + swipeRightTouch(contentContainer); + + expect(callbackSwipeStart).toHaveBeenCalledTimes(0); + expect(callbackSwipeEnd).toHaveBeenCalledTimes(0); + }); + + test('start and end callbacks not triggered if blockSwipe is set', () => { + const callbackSwipeStart = jest.fn(); + const callbackSwipeEnd = jest.fn(); + const callbackLeft = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + action: callbackLeft, + }} + onSwipeEnd={callbackSwipeEnd} + onSwipeStart={callbackSwipeStart} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + swipeLeftMouse(contentContainer); + swipeLeftTouch(contentContainer); + swipeRightMouse(contentContainer); + swipeRightTouch(contentContainer); + + expect(callbackSwipeStart).toHaveBeenCalledTimes(0); + expect(callbackSwipeEnd).toHaveBeenCalledTimes(0); + }); + + test('start and end callbacks triggered if swipe content is defined', () => { + const callbackSwipeStart = jest.fn(); + const callbackSwipeEnd = jest.fn(); + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + action: callbackRight, + }} + onSwipeEnd={callbackSwipeEnd} + onSwipeStart={callbackSwipeStart} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + swipeLeftMouse(contentContainer); + swipeLeftTouch(contentContainer); + swipeRightMouse(contentContainer); + swipeRightTouch(contentContainer); + + expect(callbackSwipeStart).toHaveBeenCalledTimes(4); + expect(callbackSwipeEnd).toHaveBeenCalledTimes(4); + }); + + test('if remove animation is applied', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + actionAnimation: ActionAnimations.REMOVE, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + actionAnimation: ActionAnimations.REMOVE, + action: callbackRight, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + swipeLeftMouse(contentContainer); + expect(contentContainer).toHaveClass( + 'swipeable-list-item__content--remove' + ); + + swipeLeftTouch(contentContainer); + expect(contentContainer).toHaveClass( + 'swipeable-list-item__content--remove' + ); + + swipeRightMouse(contentContainer); + expect(contentContainer).toHaveClass( + 'swipeable-list-item__content--remove' + ); + + swipeRightTouch(contentContainer); + expect(contentContainer).toHaveClass( + 'swipeable-list-item__content--remove' + ); + + expect(callbackLeft).toBeCalledTimes(2); + expect(callbackRight).toBeCalledTimes(2); + }); + + test('if return animation is applied', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + actionAnimation: ActionAnimations.RETURN, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + action: callbackRight, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + swipeLeftMouse(contentContainer); + expect(contentContainer).toHaveClass( + 'swipeable-list-item__content--return' + ); + + swipeLeftTouch(contentContainer); + expect(contentContainer).toHaveClass( + 'swipeable-list-item__content--return' + ); + + swipeRightMouse(contentContainer); + expect(contentContainer).toHaveClass( + 'swipeable-list-item__content--return' + ); + + swipeRightTouch(contentContainer); + expect(contentContainer).toHaveClass( + 'swipeable-list-item__content--return' + ); + + expect(callbackLeft).toBeCalledTimes(2); + expect(callbackRight).toBeCalledTimes(2); + }); + + test('if none animation is applied', () => { + const callbackLeft = jest.fn(); + const callbackRight = jest.fn(); + + const { getByTestId } = render( + Left swipe content, + actionAnimation: ActionAnimations.NONE, + action: callbackLeft, + }} + swipeRight={{ + content: Right swipe content, + actionAnimation: ActionAnimations.NONE, + action: callbackRight, + }} + > + Item content + + ); + + const contentContainer = getByTestId('content'); + + swipeLeftMouse(contentContainer); + expect(contentContainer).toHaveClass('swipeable-list-item__content'); + expect(contentContainer).not.toHaveClass( + 'swipeable-list-item__content--return' + ); + expect(contentContainer).not.toHaveClass( + 'swipeable-list-item__content--remove' + ); + + swipeLeftTouch(contentContainer); + expect(contentContainer).toHaveClass('swipeable-list-item__content'); + expect(contentContainer).not.toHaveClass( + 'swipeable-list-item__content--return' + ); + expect(contentContainer).not.toHaveClass( + 'swipeable-list-item__content--remove' + ); + + swipeRightMouse(contentContainer); + expect(contentContainer).toHaveClass('swipeable-list-item__content'); + expect(contentContainer).not.toHaveClass( + 'swipeable-list-item__content--return' + ); + expect(contentContainer).not.toHaveClass( + 'swipeable-list-item__content--remove' + ); + + swipeRightTouch(contentContainer); + expect(contentContainer).toHaveClass('swipeable-list-item__content'); + expect(contentContainer).not.toHaveClass( + 'swipeable-list-item__content--return' + ); + expect(contentContainer).not.toHaveClass( + 'swipeable-list-item__content--remove' + ); + + expect(callbackLeft).toBeCalledTimes(2); + expect(callbackRight).toBeCalledTimes(2); + }); });