import { render } from "@testing-library/react";
import { Rows } from "../Rows";
import TableContext from "../TableContext";

describe("rendering Rows", () => {
  const rows = [
    {
      key1: "row1",
      key2: "row1",
    },
    {
      key1: "row2",
      key2: "row2",
      expand: [
        {
          id: "id",
          key1: "row2-expand",
          key2: "row2-expand",
        },
      ],
    },
  ];
  const headers = [
    {
      key: "key1",
      label: "header-1",
    },
    {
      key: "key2",
      label: "header-2",
      cellProps: {
        className: "test-cellprop",
      },
    },
  ];
  let renderedRows;
  beforeEach(() => {
    renderedRows = render(
      <TableContext.Provider value={{ headers: headers, rows: rows }}>
        <table>
          <Rows />
        </table>
      </TableContext.Provider>,
    );
  });
  it("renders multiple non-expand rows", () => {
    const { container } = renderedRows;
    expect(container.querySelectorAll("tr").length).toBe(3);
  });
  it("renders primary rows - rows without any class", () => {
    const { container } = renderedRows;

    const allRows = container.querySelectorAll("tr");
    let count = 0;
    for (let row of allRows) {
      if (row.className === "") {
        count++;
      }
    }
    expect(count).toBe(2);
  });
  it("renders subrows - rows with class table__subrow", () => {
    const { container } = renderedRows;
    const subRow = container.getElementsByClassName("table__subrow");
    expect(subRow.length).toBe(1);
    expect(subRow[0].tagName).toBe("TR");
  });
  it("subrow has hidden attribute", () => {
    const { container } = renderedRows;

    const subRow = container.getElementsByClassName("table__subrow");
    expect(subRow.length).toBe(1);
    expect(subRow[0].hidden).toBe(true);
  });
  it("subrow has id attribute", () => {
    const { container } = renderedRows;

    const subRow = container.getElementsByClassName("table__subrow");
    expect(subRow.length).toBe(1);
    expect(subRow[0].id).toBe("id");
  });
  it("renders cells text content of primary rows", () => {
    const { getAllByText } = renderedRows;
    expect(getAllByText("row1").length).toBe(2);
    expect(getAllByText("row2").length).toBe(2);
  });
  it("renders cells text content of subrows", () => {
    const { getAllByText } = renderedRows;
    expect(getAllByText("row2-expand").length).toBe(2);
  });
});