import { 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("Query Workbench", () => {
  it("runs a query through the rendered controls", async () => {
    const user = userEvent.setup();
    render(<Workbench />);

    await user.clear(screen.getByRole("textbox", { name: "Query" }));
    await user.type(
      screen.getByRole("textbox", { name: "Query" }),
      "SELECT name, score WHERE score >= 84 ORDER BY score DESC",
    );
    await user.click(screen.getByRole("button", { name: "Run query" }));

    expect(screen.getByRole("status")).toHaveTextContent(
      "returned 2 result rows",
    );
    expect(screen.getByRole("cell", { name: "Ada" })).toBeVisible();
  });
});