import { fireEvent, render, screen } from "@testing-library/react";
import { describe, expect, it, vi } from "vitest";
import { RegexList } from "../RegexList";

describe("RegexList", () => {
  it("handles duplicate patterns and deletes the correct pattern", () => {
    const handleChange = vi.fn();

    render(
      <RegexList
        label="Test patterns"
        patterns={["foo", "foo"]}
        onChange={handleChange}
      />,
    );

    const inputs = screen.getAllByRole("textbox", {
      name: /Test patterns pattern \d+$/i,
    });
    expect(inputs).toHaveLength(2);
    const [firstInput, secondInput] = inputs;
    expect(firstInput).toHaveValue("foo");
    expect(secondInput).toHaveValue("foo");

    const deleteButtons = screen.getAllByRole("button", {
      name: /Remove Test patterns pattern \d+$/i,
    });
    expect(deleteButtons).toHaveLength(2);
    const firstDeleteButton = deleteButtons[0]!;

    fireEvent.click(firstDeleteButton);
    expect(handleChange).toHaveBeenLastCalledWith(["foo"]);
  });
});
