import React from "react";
import "jest-styled-components/native";
import { fireEvent, render } from "@testing-library/react-native";

import { AtomRadio } from "./index";

describe("[Native] AtomRadio", () => {
  it("Render component", () => {
    const mockChange = jest.fn();
    const component = render(<AtomRadio value="Test" onChange={mockChange} />);

    const radio = component.getByTestId("radio");
    expect(radio).not.toBeNull();
  });

  it("Render component checked", () => {
    const mockChange = jest.fn();
    const component = render(
      <AtomRadio value="Test" onChange={mockChange} isChecked={true} />
    );
    const radio = component.getByTestId("radio");
    expect(radio).not.toBeNull();
    const checked = component.getByTestId("checked");
    expect(checked).not.toBeNull();
  });

  it("Render component with Label", () => {
    const component = render(
      <AtomRadio value="Test" label="Test Label" onChange={jest.fn()} />
    );
    const radio = component.getByTestId("radio");
    expect(radio).not.toBeNull();
    const label = component.getByTestId("label");
    expect(label).not.toBeNull();
  });

  it("Call onChange when clicked", () => {
    const mockChange = jest.fn();
    const component = render(
      <AtomRadio value="Test" label="Test Label" onChange={mockChange} />
    );
    const touchable = component.getByTestId("touchable");
    expect(touchable).not.toBeNull();
    fireEvent(touchable, "press");
    expect(mockChange).toBeCalled();
  });

  it("Render component disabled", () => {
    const mockChange = jest.fn();
    const component = render(
      <AtomRadio
        value="Test"
        label="Test Label"
        onChange={mockChange}
        disabled={true}
        isChecked={true}
      />
    );
    const touchable = component.getByTestId("touchable");
    expect(touchable).not.toBeNull();
  });

  it("Call onChange when clicked", () => {
    const mockChange = jest.fn();
    const component = render(
      <AtomRadio value="Test" label="Test Label" onChange={mockChange} />
    );
    const touchable = component.getByTestId("touchable");
    const radio = component.getByTestId("radio");

    fireEvent(touchable, "press");
    fireEvent(touchable, "pressOut");

    expect(radio).not.toBeNull();
    expect(touchable).not.toBeNull();
    expect(mockChange).toBeCalled();
  });
});
