import React from "react";
import { shallow, mount } from "enzyme";
import ClickToCopy from "../components/util/ClickToCopy";

describe("ClickToCopy", () => {
  it("renders without crashing", () => {
    const rendered = shallow(<ClickToCopy text="test-text" />);
    expect(rendered).toMatchSnapshot();
  });

  it("renders children", () => {
    const inner = <span>other text</span>;
    const rendered = shallow(
      <ClickToCopy text="test-text">{inner}</ClickToCopy>
    );
    expect(rendered).toMatchSnapshot();
    expect(rendered).toContainReact(inner);
  });

  it("uses children if no text provided", () => {
    const inner = <span>other text</span>;
    const rendered = shallow(<ClickToCopy>{inner}</ClickToCopy>);
    expect(rendered).toMatchSnapshot();
    expect(rendered).toContainReact(inner);
  });

  it("copies text when clicked", () => {
    document.execCommand = jest.fn();
    const rendered = mount(<ClickToCopy text="test-text" />);
    rendered.find("span").first().simulate("click");
    expect(document.execCommand).toBeCalledWith("copy");
  });

  it("shows tooltip when hovered", () => {
    const rendered = mount(<ClickToCopy text="test-text" />);
    rendered.find("span").first().simulate("mouseover");
    expect(rendered).toMatchSnapshot();
    rendered.find("span").first().simulate("click");
    expect(rendered).toMatchSnapshot();
  });
});
