import { screen, fireEvent } from "@testing-library/react";
import { createTestTable } from "./utils/testData";

describe("BulkEditTable", () => {
  describe("scrolling", () => {
    it("Should only show as many rows as can fit on the screen", async () => {
      const { render } = createTestTable(100);
      render();
      // 9 rows plus the header should be shown
      await screen.findByText("a0");
      await screen.findByText("a8");
      expect(screen.queryByText("a9")).toBeNull();
    });

    it("Should show different rows when scrolled", async () => {
      const { render } = createTestTable(100);
      render();
      const scroller = screen.getByTestId("bulk-edit-scroller");
      await screen.findByText("a0");
      scroller.scrollTop = 400;
      fireEvent.scroll(scroller);
      // 9 rows plus the header should be shown
      await screen.findByText("a10");
      await screen.findByText("a18");
      expect(screen.queryByText("a8")).toBeNull();
      expect(screen.queryByText("a19")).toBeNull();
    });
  });
});