import { fireEvent, render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { describe, expect, it } from "vitest";
import { Workbench } from "../../src/components/Workbench";

describe("API workbench", () => {
  it("navigates operations and retains a model after invalid source", async () => {
    const user = userEvent.setup();
    render(<Workbench />);
    expect(
      screen.getByRole("heading", { name: "API Tools" }),
    ).toBeInTheDocument();
    expect(screen.getAllByText("GET", { exact: true })).toHaveLength(2);
    expect(screen.getByText(/curl --request GET/iu)).toBeInTheDocument();
    await user.clear(screen.getByLabelText("API description source"));
    await user.type(
      screen.getByLabelText("API description source"),
      'not: "unterminated',
    );
    await user.click(
      screen.getByRole("button", { name: "Analyse description" }),
    );
    expect(screen.getByRole("alert")).toHaveTextContent(/last successful/iu);
    expect(
      screen.getAllByText("/books/{bookId}", { exact: true }),
    ).toHaveLength(3);
  });

  it("opens AsyncAPI operations and derives local message examples", async () => {
    const user = userEvent.setup();
    render(<Workbench />);
    fireEvent.change(screen.getByLabelText("API description source"), {
      target: {
        value: `asyncapi: 3.1.0
info: { title: Events, version: '1' }
defaultContentType: application/json
channels:
  users:
    address: users.signed-up
    messages:
      signedUp: { payload: { type: object, properties: { id: { const: user-1 } } } }
operations:
  emit:
    action: send
    channel: { $ref: '#/channels/users' }
`,
      },
    });
    await user.click(
      screen.getByRole("button", { name: "Analyse description" }),
    );
    expect(screen.getAllByText("SEND", { exact: true })).not.toHaveLength(0);
    expect(
      screen.getAllByText("users.signed-up", { exact: true }),
    ).toHaveLength(2);
    expect(screen.getAllByText(/user-1/iu)).toHaveLength(2);
  });

  it("shows security, comparison and exchange workspaces", async () => {
    const user = userEvent.setup();
    render(<Workbench />);
    await user.click(screen.getByRole("button", { name: "Security" }));
    expect(screen.getByText("bearerAuth", { exact: true })).toBeInTheDocument();
    await user.click(screen.getByRole("button", { name: "Compare" }));
    expect(screen.getByText(/Operation was added/iu)).toBeInTheDocument();
    await user.click(screen.getByRole("button", { name: "Exchanges" }));
    expect(
      screen.getByRole("cell", {
        name: "https://api.example.test/books/book-42",
      }),
    ).toBeInTheDocument();
  });
});