import { describe, it, expect } from "vitest";
import { renderWithProviders } from "@repo/core-testing/react";
import { screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { Input } from "./input";

describe("Input", () => {
  it("renders an input with the given placeholder", () => {
    renderWithProviders(<Input placeholder="email" />);
    expect(screen.getByPlaceholderText("email")).toBeInTheDocument();
  });

  it("forwards the type attribute", () => {
    renderWithProviders(<Input type="email" placeholder="email" />);
    expect(screen.getByPlaceholderText("email")).toHaveAttribute(
      "type",
      "email",
    );
  });

  it("accepts user input", async () => {
    renderWithProviders(<Input placeholder="email" />);
    const input = screen.getByPlaceholderText("email");
    await userEvent.type(input, "hi@example.com");
    expect(input).toHaveValue("hi@example.com");
  });

  it("disabled prop blocks user input", async () => {
    renderWithProviders(<Input placeholder="email" disabled />);
    const input = screen.getByPlaceholderText("email");
    await userEvent.type(input, "hi");
    expect(input).toHaveValue("");
  });
});
