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

import { BlockAction } from "../BlockAction";

describe("rendering BlockAction", () => {
  describe("passed props", () => {
    it("renders children", () => {
      const { container } = render(
        <BlockAction>
          <p>test</p>
        </BlockAction>,
      );
      expect(container.querySelector("p")).toBeInTheDocument();
    });
    it("BlockAction passes props to child", () => {
      const { getByTestId } = render(
        <BlockAction data-testid="test-id">
          <p>test</p>
        </BlockAction>,
      );
      expect(getByTestId("test-id").tagName).toBe("P");
    });
    it("BlockAction passes class block-action", () => {
      const { container } = render(
        <BlockAction>
          <p>test</p>
        </BlockAction>,
      );
      expect(container.querySelector("p")).toBeInTheDocument();
      expect(container.querySelector("p")).toHaveClass("block-action");
    });
    it("BlockAction passes data-block-action attribute", () => {
      const { container } = render(
        <BlockAction>
          <p>test</p>
        </BlockAction>,
      );
      expect(container.querySelector("p")).toBeInTheDocument();
      expect(
        container.querySelector("p").getAttribute("data-block-action"),
      ).toBe("true");
    });
  });
});