diff --git a/packages/ibm-products/src/components/Carousel/Carousel.test.js b/packages/ibm-products/src/components/Carousel/Carousel.test.js
index df47436d7e..e0f1b3e744 100644
--- a/packages/ibm-products/src/components/Carousel/Carousel.test.js
+++ b/packages/ibm-products/src/components/Carousel/Carousel.test.js
@@ -6,7 +6,7 @@
*/
import React from 'react';
-import { render, screen } from '@testing-library/react'; // https://testing-library.com/docs/react-testing-library/intro
+import { fireEvent, render, screen, waitFor } from '@testing-library/react'; // https://testing-library.com/docs/react-testing-library/intro
import { pkg } from '../../settings';
import uuidv4 from '../../global/js/utils/uuidv4';
@@ -78,4 +78,63 @@ describe(componentName, () => {
componentName
);
});
+
+ it('calls the onScroll prop and returns value from 0 to 1', async () => {
+ const onScroll = jest.fn().mockReturnValue(0.2);
+ render(
+
+ Very long paragraph to trigger scrolling.
+
+ );
+
+ const element = screen.getByTestId(dataTestId);
+ expect(element).not.toBeNull();
+
+ await waitFor(() =>
+ fireEvent.scroll(element, { target: { scrollX: '20px' } })
+ );
+ expect(onScroll).toHaveBeenCalled();
+ expect(onScroll()).toBe(0.2);
+ });
+
+ it('resets the scroll when the window size changes', async () => {
+ const onScroll = jest.fn().mockReturnValue(0.2);
+
+ render(
+
+ Very long paragraph to trigger scrolling.
+
+ );
+
+ const element = screen.getByTestId(dataTestId);
+ expect(onScroll).toHaveBeenCalledTimes(0);
+ expect(element.scrollLeft).toBe(0);
+
+ const scrollXAmount = 20;
+ await waitFor(() =>
+ fireEvent.scroll(element, { target: { scrollX: scrollXAmount } })
+ );
+ element.scrollLeft = scrollXAmount;
+ expect(element.scrollLeft).toBe(scrollXAmount);
+
+ // Change the viewport to 500px.
+ global.innerWidth = 500;
+
+ // Trigger the window resize event.
+ global.dispatchEvent(new Event('resize'));
+
+ expect(onScroll).toHaveBeenCalled();
+ element.scrollLeft = 0;
+ expect(element.scrollLeft).toBe(0);
+ });
});