confluence-template-variables.spec.ts

confluence-template-variables.spec.tstests/e2e/specs/confluence-template-variables.spec.tsraw ← specs3,917 B← Back to the app
1/**
2 * T-142 — template VARIABLES web E2E (the RHF apply-with-values dialog).
3 *
4 * The server-side substitution (create-with-variables + apply `values` +
5 * plain-text token replacement) is integration-tested in
6 * `templates.integration.test.ts`. This spec verifies the WEB surface:
7 *
8 *  - "Use" on a template WITH variables opens the variable FORM (not the
9 *    one-click apply),
10 *  - an empty required field blocks submit client-side ("Required" error,
11 *    no apply fired, no navigation),
12 *  - a valid submit calls `POST /templates/:id/apply` with `values` and the
13 *    new page's blocks show the tokens SUBSTITUTED.
14 *
15 * Origin: `https://notion.filps.com` (Caddy single-origin — see the other
16 * confluence-* specs).
17 */
18import { test, expect } from "../fixtures";
19import { createPage, createBlock, getBlocks } from "../utils/api";
20import type { PageDto, BlockDto } from "../fixtures";
21 
22test.describe("Templates variables — T-142 (RHF apply-with-values)", () => {
23  test("Use → variable form → required blocks submit; valid values substitute the tokens", async ({
24    authPage,
25    api,
26    freshWorkspace
27  }) => {
28    const ws = await freshWorkspace("Var Template Space");
29    const src = (await createPage(api, ws.id, { title: "Plan Draft" })) as PageDto;
30    await createBlock(api, src.id, {
31      type: "PARAGRAPH",
32      content: { text: "Project {{project}} is owned by {{owner}}." }
33    });
34 
35    // Snapshot into a template WITH typed variables (the server stores them).
36    const tRes = await api.post(`/api/v1/pages/${src.id}/templates`, {
37      data: {
38        name: "Plan Template",
39        variables: [
40          { name: "project", label: "Project name", type: "text", required: true },
41          { name: "owner", label: "Owner", type: "text" }
42        ]
43      }
44    });
45    expect(tRes.status(), await tRes.text()).toBe(201);
46    const tpl = (await tRes.json()) as { id: string; variables: unknown };
47    expect(Array.isArray(tpl.variables)).toBe(true);
48 
49    await authPage.goto(`/w/${ws.slug}/templates`);
50    const item = authPage.getByTestId(`template-item-${tpl.id}`);
51    await expect(item).toBeVisible({ timeout: 15_000 });
52 
53    // "Use" on a variable template opens the FORM dialog (not one-click apply).
54    await item.getByTestId(`template-apply-${tpl.id}`).click();
55    const projectInput = authPage.getByLabel("Project name");
56    await expect(projectInput).toBeVisible();
57    await expect(authPage.getByLabel("Owner")).toBeVisible();
58    await expect(authPage.getByRole("button", { name: "Create page" })).toBeVisible();
59 
60    // 1) Empty required field → client-side "Required", no navigation.
61    await authPage.getByRole("button", { name: "Create page" }).click();
62    await expect(authPage.getByTestId("tpl-var-error-project")).toHaveText("Required");
63    // Still on the templates page (no apply fired for an invalid form).
64    await expect(authPage).toHaveURL(/\/templates$/);
65 
66    // 2) Valid values → apply(values) → navigate to the new page.
67    await projectInput.fill("Apollo");
68    await authPage.getByLabel("Owner").fill("Ada");
69    await authPage.getByRole("button", { name: "Create page" }).click();
70    await authPage.waitForURL(/\/w\/[^/]+\/page\/[^/]+$/, { timeout: 20_000 });
71    const newId = new URL(authPage.url()).pathname.split("/").pop() ?? "";
72    expect(newId).toBeTruthy();
73    expect(newId).not.toBe(src.id);
74 
75    // The applied page's block has the tokens SUBSTITUTED (plain text). The
76    // deep-copy may also carry a title block ("Plan Draft") — assert the
77    // substituted content is present and NO {{tokens}} remain.
78    const blocks = await getBlocks(api, newId);
79    const texts = blocks
80      .filter((b) => b.type === "PARAGRAPH")
81      .map((b) => (b.content as { text?: string })?.text ?? "");
82    expect(texts).toContain("Project Apollo is owned by Ada.");
83    expect(texts.join(" ")).not.toContain("{{");
84  });
85});
86