Add tests for pagination

master
Hasan Genc 4 years ago
parent edbd72a679
commit b001238d65
  1. 42
      __tests__/carousel.spec.tsx
  2. 48
      __tests__/helpers.spec.tsx

@ -5,6 +5,7 @@ import { defaultProps } from '../src/components/carousel/defaultProps';
import { carouselItemNodes, dynamicCarouselItemNodes } from './__fixtures__/nodes';
import * as helpers from '../src/helpers';
import { SlideDirection } from '../src/types/carousel';
import * as hooks from '../src/hooks';
describe('<Carousel />', () => {
let mockGetPageX: jest.SpyInstance<
@ -303,51 +304,30 @@ describe('<Carousel />', () => {
expect(button!.innerHTML).toEqual('1');
});
it('should invoke beforeChange when beforeChange prop is defined on slide', async () => {
const onBeforeChange = (_: SlideDirection) => {
return;
};
const stub = jest.fn(onBeforeChange);
const { getByTestId } = render(
<Carousel
{...defaultProps}
infinite={true}
children={carouselItemNodes(4)}
beforeChange={stub}
/>,
);
const carousel = getByTestId('carousel');
const button = carousel.querySelector('button');
expect(button).not.toBeNull();
fireEvent.click(button!);
jest.runAllTimers();
expect(stub).toHaveBeenCalledTimes(1);
});
it('should slide to right when click right button', async () => {
const paginationCallback = jest.fn();
const mockUsePrevious = jest
.spyOn(hooks, 'usePrevious')
.mockImplementation(() => carouselItemNodes(2));
it('should invoke afterChange when afterChange prop is defined on slide', async () => {
const onAfterChange = (_: SlideDirection) => {
return;
};
const stub = jest.fn(onAfterChange);
const { getByTestId } = render(
<Carousel
{...defaultProps}
infinite={true}
children={carouselItemNodes(4)}
afterChange={stub}
pageCount={2}
paginationCallback={paginationCallback}
/>,
);
const carousel = getByTestId('carousel');
const button = carousel.querySelector('button');
const button = carousel.querySelectorAll('button')[1];
expect(button).not.toBeNull();
fireEvent.click(button!);
jest.runAllTimers();
expect(stub).toHaveBeenCalledTimes(1);
expect(paginationCallback).toHaveBeenCalledTimes(1);
expect(mockUsePrevious).toBeCalled();
});
});

@ -82,10 +82,17 @@ describe('helpers', () => {
const oldNodes = reactNodes('old', 5) as Item[];
const newNodes = reactNodes('new', 6) as Item[];
const expected = reactNodes('new', 5) as Item[];
const prevChildren = undefined;
const infinite = true;
const slide = 5;
const result = helpers.updateNodes(oldNodes, newNodes, slide, infinite);
const result = helpers.updateNodes(
oldNodes,
newNodes,
prevChildren,
slide,
infinite,
);
expect(result).toEqual(expected);
});
@ -94,6 +101,7 @@ describe('helpers', () => {
const oldNodes = reactNodes('old', 5) as Item[];
const infinite = true;
const slide = 2;
const prevChildren = undefined;
const newNodes = ([
{
key: 14,
@ -123,8 +131,44 @@ describe('helpers', () => {
},
] as unknown) as Item[];
const result = helpers.updateNodes(oldNodes, newNodes, slide, infinite);
const result = helpers.updateNodes(
oldNodes,
newNodes,
prevChildren,
slide,
infinite,
);
expect(result).toEqual(expectedNodes);
});
it('should update nodes when previous children length is less than new children', async () => {
const oldNodes = reactNodes('old', 5) as Item[];
const newNodes = reactNodes('new', 6) as Item[];
const prevChildren = newNodes.slice(0, 5);
const expected = newNodes.slice(1, 6).concat(newNodes);
const infinite = true;
const slide = 5;
const result = helpers.updateNodes(
oldNodes,
newNodes,
prevChildren,
slide,
infinite,
);
expect(result).toEqual(expected);
});
it('should get corre transform amount', async () => {
const width = 100;
const slideCount = 2;
const direction = SlideDirection.Left;
const expected = 200;
const result = helpers.getTransformAmount(width, slideCount, direction);
expect(result).toEqual(expected);
});
});

Loading…
Cancel
Save