test(ai-toolbar): verify masonry prompt wrapping contract

This commit is contained in:
2026-04-22 17:48:15 -04:00
parent a93d95ee2e
commit e817fb52cf

View File

@@ -1,5 +1,6 @@
import { describe, expect, test } from "bun:test";
import { readFileSync } from "node:fs";
import { buttonVariants } from "@/components/ui/button";
import { getAiDisabledMessage } from "@/lib/ai-feature-flags";
import { cn } from "@/lib/utils";
@@ -53,6 +54,17 @@ const BADGE_POSITION_CLASS = "ml-auto";
const readToolbarSource = () => readFileSync("src/components/ai-toolbar.tsx", "utf8");
const getExamplePromptButtonClassName = () => {
const source = readToolbarSource();
const match = source.match(
/<Button\s+type="button"\s+variant="secondary"\s+size="sm"\s+className="([^"]*\bwhitespace-normal\b[^"]*)"/,
);
expect(match).not.toBeNull();
return match![1];
};
// ─── Cycle 1: AI zone visual accent ─────────────────────────────────────────
describe("AI zone primary accent ring contract", () => {
@@ -168,14 +180,23 @@ describe("AI capture redesign", () => {
test("example prompts use a masonry-style cluster inside the composer footer", () => {
const source = readToolbarSource();
const promptButtonClassName = getExamplePromptButtonClassName();
const mergedPromptButtonClassName = cn(
buttonVariants({
variant: "secondary",
size: "sm",
className: promptButtonClassName,
}),
);
expect(source).toContain("Try:");
expect(source).toContain("columns-2");
expect(source).toContain("break-inside-avoid");
expect(source).toContain("whitespace-normal");
expect(source).toMatch(
/className="[^"]*\bw-full\b[^"]*\btext-left\b[^"]*\bwhitespace-normal\b[^"]*"/,
);
expect(promptButtonClassName).toContain("whitespace-normal");
expect(promptButtonClassName).toContain("w-full");
expect(promptButtonClassName).toContain("text-left");
expect(mergedPromptButtonClassName).toContain("whitespace-normal");
expect(mergedPromptButtonClassName).not.toContain("whitespace-nowrap");
});
test("desktop composer uses a two-column row when the page gives it full-width space", () => {