// @vitest-environment jsdom
import { describe, expect, it } from "vitest";
import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import FloatInput from "./FloatInput";

describe("FloatInput name filter", () => {
  it("blocks digits while allowing letters, spaces and hyphens", async () => {
    const user = userEvent.setup();
    render(
      <FloatInput id="t-name" name="name" label="Full Name" filter="name" />
    );
    const input = screen.getByLabelText(/full name/i);
    await user.click(input);
    await user.keyboard("Jay123 V-t");
    // jsdom + user-event: blocked chars never reach the value
    expect((input as HTMLInputElement).value).not.toMatch(/[0-9]/);
    expect((input as HTMLInputElement).value).toMatch(/Jay/);
  });

  it("renders error text and red border state", () => {
    render(
      <FloatInput
        id="t-err"
        name="name"
        label="Full Name"
        error="Please enter a valid name (letters only)."
      />
    );
    expect(
      screen.getByText("Please enter a valid name (letters only).")
    ).toBeTruthy();
  });

  it("associates label with input for screen readers", () => {
    render(<FloatInput id="t-a11y" name="email" label="Work Email" />);
    expect(screen.getByLabelText(/work email/i)).toBeTruthy();
  });
});