Fix unit tests

ybot1122 · Nov 4, 2024 · 110ce35 · 110ce35
1 parent 3ce3c91
commit 110ce35
Show file tree

Hide file tree

Showing 3 changed files with 54 additions and 35 deletions.
diff --git a/src/ReactFullpageSlideshow.tsx b/src/ReactFullpageSlideshow.tsx
@@ -34,26 +34,20 @@ export default function ReactFullpageSlideshow({
     undefined | { timestamp: number; y: number }
   >();
 
-  console.log(isAnimatingRef.current);
-
   const goToSlide = useCallback(
     (index: number) => {
-      console.log(index, isAnimatingRef.current);
       if (isAnimatingRef.current) return;
-      console.log("wtf");
       if (
         index >= 0 &&
         index < items.length &&
         index !== activeIndexRef.current
       ) {
-        console.log("go");
         setActiveIndex(index);
         activeIndexRef.current = index;
         isAnimatingRef.current = true;
         setIsAnimating(true);
 
         setTimeout(() => {
-          console.log("end");
           isAnimatingRef.current = false;
           setIsAnimating(false);
         }, slideAnimationMs);

diff --git a/test/BasicTest.test.tsx b/test/BasicTest.test.tsx
@@ -15,68 +15,89 @@ describe("BasicTest", () => {
 
     render(<App />);
 
-    await act(async () => {
-      assertSlidePosition(0, screen);
+    assertSlidePosition(0, screen);
 
+    await act(async () => {
       await user.click(screen.getByText("Next-Slide-slide 1"));
+    });
 
-      assertSlidePosition(1, screen);
+    assertSlidePosition(1, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
+    await act(async () => {
       await user.click(screen.getByText("Next-Slide-slide 2"));
+    });
 
-      assertSlidePosition(2, screen);
+    assertSlidePosition(2, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
+    await act(async () => {
       await user.click(screen.getByText("Next-Slide-slide 3"));
+    });
 
-      assertSlidePosition(3, screen);
+    assertSlidePosition(3, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
+    await act(async () => {
       await user.click(screen.getByText("Next-Slide-slide 4"));
+    });
 
-      assertSlidePosition(4, screen);
+    assertSlidePosition(4, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
-      // Clicking this should be a no-op because we are already on the last slide
+    // This should be a no-op because it is already the last slide
+    await act(async () => {
       await user.click(screen.getByText("Next-Slide-slide 5"));
+    });
 
-      assertSlidePosition(4, screen);
+    assertSlidePosition(4, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
+    await act(async () => {
       await user.click(screen.getByText("Previous-Slide-slide 5"));
+    });
 
-      assertSlidePosition(3, screen);
+    assertSlidePosition(3, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
+    await act(async () => {
       await user.click(screen.getByText("Previous-Slide-slide 4"));
+    });
 
-      assertSlidePosition(2, screen);
+    assertSlidePosition(2, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
+    await act(async () => {
       await user.click(screen.getByText("Previous-Slide-slide 3"));
+    });
 
-      assertSlidePosition(1, screen);
+    assertSlidePosition(1, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
+    await act(async () => {
       await user.click(screen.getByText("Previous-Slide-slide 2"));
+    });
 
-      assertSlidePosition(0, screen);
+    assertSlidePosition(0, screen);
 
-      jest.runAllTimers();
+    jest.runAllTimers();
 
+    // This should be a no-op because it is already the first slide
+    await act(async () => {
       await user.click(screen.getByText("Previous-Slide-slide 1"));
-
-      assertSlidePosition(0, screen);
     });
+
+    assertSlidePosition(0, screen);
+
+    jest.runAllTimers();
   });
 });
 

diff --git a/test/SwipeTest.test.tsx b/test/SwipeTest.test.tsx
@@ -1,5 +1,6 @@
 import React from "react";
-import { fireEvent, render, Screen, screen } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import { act, fireEvent, render, screen } from "@testing-library/react";
 import { App } from "./utils";
 
 jest.useRealTimers();
@@ -12,16 +13,19 @@ test("SwipeTest", async () => {
     .mockImplementation(() => 500);
 
   render(<App />);
+  assertSlidePosition(0);
   const main = screen.getByRole("main");
 
-  await fireEvent.pointerDown(main, { clientY: 101, ctrlKey: false });
-  await new Promise((resolve) => setTimeout(resolve, 51));
-  await fireEvent.pointerUp(main, { clientY: 0, ctrlKey: false });
+  await act(async () => {
+    await fireEvent.pointerDown(main, { clientY: 101, ctrlKey: false });
+    await new Promise((resolve) => setTimeout(resolve, 51));
+    await fireEvent.pointerUp(main, { clientY: 0, ctrlKey: false });
+  });
 
-  assertSlidePosition(1, screen);
+  assertSlidePosition(1);
 });
 
-const assertSlidePosition = (activeIndex: number, screen: Screen) => {
+const assertSlidePosition = (activeIndex: number) => {
   const slides = [0, 1, 2, 3, 4];
   slides.map((ind) => {
     const top = `calc(${(ind - activeIndex) * 100}vh + ${0}px)`;