init

Bin

2025-12-16 9e0b2ba2c317b1a86212f24cbae3195ad1f3dbfa

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
import { render, fireEvent } from "@testing-library/react";
import Checkbox from "./checkbox";
 
describe("Checkbox", () => {
  it("should render successfully", () => {
    const { baseElement } = render(<Checkbox />);
    expect(baseElement).toBeTruthy();
  });
 
  it("should render with a label when children are provided", () => {
    const { getByText } = render(<Checkbox>Test Label</Checkbox>);
    expect(getByText("Test Label")).toBeTruthy();
  });
 
  it("should be checked when checked prop is true", () => {
    const { getByRole } = render(<Checkbox checked={true} />);
    expect((getByRole("checkbox") as HTMLInputElement).checked).toBe(true);
  });
 
  it("should not be checked when checked prop is false", () => {
    const { getByRole } = render(<Checkbox checked={false} />);
    expect((getByRole("checkbox") as HTMLInputElement).checked).toBe(false);
  });
 
  it("should call onChange when clicked", () => {
    const handleChange = jest.fn();
    const { getByRole } = render(<Checkbox onChange={handleChange} />);
    fireEvent.click(getByRole("checkbox"));
    expect(handleChange).toHaveBeenCalledTimes(1);
  });
 
  it("should be indeterminate when indeterminate prop is true", () => {
    const { getByRole } = render(<Checkbox indeterminate={true} />);
    expect(getByRole("checkbox")).toHaveProperty("indeterminate", true);
  });
 
  it("should apply custom className", () => {
    const { container } = render(<Checkbox className="custom-class" />);
    expect((container.firstChild as HTMLElement).classList.contains("custom-class")).toBe(true);
  });
 
  it("should apply custom style", () => {
    const { container } = render(<Checkbox style={{ marginTop: "10px" }} />);
    expect((container.firstChild as HTMLElement).style.marginTop).toBe("10px");
  });
});