forked from baron/baron-sso
43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
import { render, screen } from "@testing-library/react";
|
|
import userEvent from "@testing-library/user-event";
|
|
import { describe, expect, it, vi } from "vitest";
|
|
import { Input } from "./input";
|
|
|
|
describe("Input Component", () => {
|
|
it("renders correctly", () => {
|
|
render(<Input placeholder="Enter text" />);
|
|
expect(screen.getByPlaceholderText("Enter text")).toBeInTheDocument();
|
|
});
|
|
|
|
it("adds a fallback id for browser autofill diagnostics", () => {
|
|
render(<Input placeholder="Enter text" />);
|
|
|
|
expect(screen.getByPlaceholderText("Enter text")).toHaveAttribute("id");
|
|
});
|
|
|
|
it("keeps explicit id and name values", () => {
|
|
render(<Input id="explicit-id" name="explicit-name" />);
|
|
const input = screen.getByRole("textbox");
|
|
|
|
expect(input).toHaveAttribute("id", "explicit-id");
|
|
expect(input).toHaveAttribute("name", "explicit-name");
|
|
});
|
|
|
|
it("handles value changes", async () => {
|
|
const onChange = vi.fn();
|
|
const user = userEvent.setup();
|
|
render(<Input placeholder="Enter text" onChange={onChange} />);
|
|
const input = screen.getByPlaceholderText("Enter text");
|
|
|
|
await user.type(input, "Hello");
|
|
expect(onChange).toHaveBeenCalled();
|
|
expect(input).toHaveValue("Hello");
|
|
});
|
|
|
|
it("is disabled when the disabled prop is passed", () => {
|
|
render(<Input disabled />);
|
|
const input = screen.getByRole("textbox");
|
|
expect(input).toBeDisabled();
|
|
});
|
|
});
|