diff --git a/www/__tests__/Carousel.test.tsx b/www/__tests__/Carousel.test.tsx index 7b8601109..d523f3afc 100644 --- a/www/__tests__/Carousel.test.tsx +++ b/www/__tests__/Carousel.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render } from '@testing-library/react-native'; +import { render, fireEvent } from '@testing-library/react-native'; import { View } from 'react-native'; import Carousel from '../js/components/Carousel'; @@ -23,4 +23,32 @@ describe('Carousel component', () => { expect(renderedChild1).toBeTruthy(); expect(renderedChild2).toBeTruthy(); }); + + it('scrolls correctly to the next card', () => { + const { getByTestId } = render( + + {child1} + {child2} + , + ); + + const scrollView = getByTestId('carousel'); + fireEvent.scroll(scrollView, { + // Scroll to the second card + nativeEvent: { + contentOffset: { + x: cardWidth + cardMargin, + }, + contentSize: { + width: (cardWidth + cardMargin) * 2, + }, + layoutMeasurement: { + width: cardWidth + cardMargin, + }, + }, + }); + + expect(scrollView.props.horizontal).toBe(true); + expect(scrollView.props.snapToInterval).toBe(cardWidth + cardMargin); + }); }); diff --git a/www/js/components/Carousel.tsx b/www/js/components/Carousel.tsx index 8afe6624a..81740fc8b 100644 --- a/www/js/components/Carousel.tsx +++ b/www/js/components/Carousel.tsx @@ -10,6 +10,7 @@ const Carousel = ({ children, cardWidth, cardMargin }: Props) => { const numCards = React.Children.count(children); return (