import React from "react";
import { render, waitFor } from "@testing-library/react";
import userEvent from '@testing-library/user-event';

import { TrieSelect } from ".";
import addSnapshotSerializer from "../../../utils/snapshot";

const options = [
  "ace",
  "ace_bev_one",
  "ace_bev_two",
  "ace_bev_three",
  "bev",
  "bev_chaz_deep",
  "bev_chaz_deep_one",
  "bev_chaz_deep_two",
];

describe("TrieSelect", () => {
  beforeAll(() => {
    addSnapshotSerializer(expect);
  });

  it("Render", async () => {
    const { container } = render(
      <TrieSelect
        label={"The button label"}
        classification="Signal"
        options={options}
      />
    );
    await waitFor(() => {
      /* render */
    });
    expect(container).toMatchSnapshot();
  });

  it("properly passes payload to callback", async () => {
    const mockCallback = jest.fn();

    const { getByText } = render(
      <TrieSelect
        label={"The input label"}
        classification="Signal"
        options={options}
        onChange={mockCallback}
      />
    );

    const selectAll = getByText("Select All 8");
    userEvent.click(selectAll);
    expect(mockCallback).toHaveBeenCalledWith(options);
  });
});