import { expect, test } from "@playwright/test";
import { readFileSync } from "node:fs";
import path from "node:path";

const responseSource = readFileSync(
  path.join(process.cwd(), "components/elements/response.tsx"),
  "utf8"
);

test.describe("OpenClaw markdown table layout", () => {
  test("keeps wide tables scrollable instead of compressing adjacent columns", () => {
    expect(responseSource).toContain(
      "w-max min-w-full table-auto border-collapse"
    );
    expect(responseSource).toContain("overflow-x-auto overscroll-x-contain");
  });

  test("visually separates cells and preserves readable wrapped content", () => {
    expect(responseSource).toContain(
      "border-r border-border/60 px-4 py-2.5 text-left"
    );
    expect(responseSource).toContain(
      "border-r border-border/70 bg-muted/70 px-4 py-2.5 text-left"
    );
    expect(responseSource).toContain("last:border-r-0");
    expect(responseSource).toContain("[overflow-wrap:anywhere]");
  });
});