import { fireEvent, render } from "@testing-library/react-native";
import React from "react";
import "@testing-library/jest-dom";
import { MoleculeAccordion } from "./index";

describe("[Native] MoleculeAccordion", () => {
  const body = {
    data: [
      {
        header: "Header 1",
        detail: "Detail 1",
        _id: 1,
      },
      {
        header: "Header 2",
        detail: "Detail 2",
        _id: 2,
      },
    ],
    header: "header",
    detail: "detail",
    _key: "_id",
  };

  it("Render Accordion component", () => {
    const component = render(<MoleculeAccordion {...body} />);

    const selector = component.getAllByTestId("accordion");
    expect(selector.length).toEqual(body.data.length);
  });

  it("Test open item", () => {
    const component = render(<MoleculeAccordion {...body} />);

    const accordionHeader = component.getByTestId("item_1");
    accordionHeader && fireEvent.press(accordionHeader);
    expect(component.queryByText(body.data[0].detail)).not.toBeNull;
  });

  it("Test collapse item", () => {
    const component = render(<MoleculeAccordion {...body} />);

    const accordionHeader = component.getByTestId("item_1");
    accordionHeader && fireEvent.press(accordionHeader);
    accordionHeader && fireEvent.press(accordionHeader);
    expect(component.queryByText(body.data[0].detail)).toBeNull();
  });
});
