create-ailk 0.21.0 → 0.23.0

package/templates/apps/web/app/[locale]/contact/__tests__/contact-magnet-page.test.tsx

@@ -124,8 +124,15 @@ async function tickAndSubmit(values: Record<string, string>) {
   });
 }
 
+// #8731 — the page shares its two hub reads for a few seconds, per module
+// instance. Each test starts an hour later so none sees another's read.
+let clock = 1_800_000_000_000;
+const nowSpy = jest.spyOn(Date, "now");
+
 beforeEach(() => {
   jest.clearAllMocks();
+  clock += 60 * 60 * 1000;
+  nowSpy.mockImplementation(() => clock);
   mockCaptureStatus.mockResolvedValue({
     ok: true,
     status: 200,
@@ -167,20 +174,52 @@ describe("contact/page — rendering (AC-3)", () => {
     expect(screen.queryByTestId("field-company")).toBeNull();
   });
 
-  it("two requests with two configs render two labels (no caching)", async () => {
+  it("a burst of views makes one hub read of each kind, not one per view (#8731)", async () => {
+    mockFlowsGet.mockResolvedValue(served(configWithSubjectLabel("Topic")));
+    for (let i = 0; i < 25; i += 1) {
+      const view = await renderPage();
+      expect(screen.getByTestId("lead-capture-form")).toHaveTextContent("Topic");
+      view.unmount();
+    }
+    expect(mockFlowsGet).toHaveBeenCalledTimes(1);
+    expect(mockCaptureStatus).toHaveBeenCalledTimes(1);
+  });
+
+  it("concurrent views share one in-flight read of each (#8731)", async () => {
+    mockFlowsGet.mockResolvedValue(served(contactFormFlowConfig));
+    await Promise.all([renderPage(), renderPage(), renderPage()]);
+    expect(mockFlowsGet).toHaveBeenCalledTimes(1);
+    expect(mockCaptureStatus).toHaveBeenCalledTimes(1);
+  });
+
+  it("an Admin edit shows once the shared read expires (#8731)", async () => {
     mockFlowsGet.mockResolvedValueOnce(served(configWithSubjectLabel("Topic")));
     const first = await renderPage();
     expect(screen.getByTestId("lead-capture-form")).toHaveTextContent("Topic");
     first.unmount();
 
     mockFlowsGet.mockResolvedValueOnce(served(configWithSubjectLabel("Reason")));
+    clock += 60_000;
     await renderPage();
     const form = screen.getByTestId("lead-capture-form");
     expect(form).toHaveTextContent("Reason");
     expect(form).not.toHaveTextContent("Topic");
+    expect(mockFlowsGet).toHaveBeenCalledTimes(2);
   });
 
-  it("links Terms, Privacy Policy and Working Agreement in the statement", async () => {
+  it("a failed read is shared too, so an unreachable hub is not retried per view (#8731)", async () => {
+    mockFlowsGet.mockRejectedValue(new Error("hub down"));
+    mockCaptureStatus.mockRejectedValue(new Error("hub down"));
+    for (let i = 0; i < 5; i += 1) {
+      const view = await renderPage();
+      expect(screen.getByTestId("lead-capture-form")).toBeInTheDocument();
+      view.unmount();
+    }
+    expect(mockFlowsGet).toHaveBeenCalledTimes(1);
+    expect(mockCaptureStatus).toHaveBeenCalledTimes(1);
+  });
+
+  it("links Terms and Privacy Policy in the two-link statement (#8847 D2)", async () => {
     mockFlowsGet.mockResolvedValue(served(contactFormFlowConfig));
 
     await renderPage();
@@ -193,10 +232,7 @@ describe("contact/page — rendering (AC-3)", () => {
       "href",
       localeHref("en", "/privacy"),
     );
-    expect(screen.getByTestId("consent-policy-link-working_agreement")).toHaveAttribute(
-      "href",
-      localeHref("en", "/working-agreement"),
-    );
+    expect(screen.queryByTestId("consent-policy-link-working_agreement")).toBeNull();
   });
 
   it("a magnet-driven post reaches leads.submit as flow:contact with its subject", async () => {
@@ -251,7 +287,7 @@ describe("contact/page — fallback (AC-5)", () => {
     await tickAndSubmit({ name: "Ada", email: "ada@example.com" });
 
     await waitFor(() => expect(mockSubmit).toHaveBeenCalledTimes(1));
-    expect(mockSubmit.mock.calls[0][0]).toMatchObject({ source: "web" });
+    expect(mockSubmit.mock.calls[0][0]).toMatchObject({ source: "contact-form" });
   });
 
   it("with no magnet, a section's declared fields still apply", async () => {
@@ -276,7 +312,7 @@ describe("contact/page — fallback (AC-5)", () => {
     expect(screen.getByTestId("contact-submit")).toHaveTextContent("Request a demo");
   });
 
-  it("the built-in form takes its labels from the contact catalog and the section's copy", async () => {
+  it("the built-in form takes its labels from the contact catalog and ends on the built-in ending (#8847 D7)", async () => {
     mockFlowsGet.mockResolvedValue({ ok: false, status: 404, body: {} });
     const messages = jest.requireActual("../../../../messages/en.json") as {
       contact: Record<string, string>;
@@ -293,13 +329,16 @@ describe("contact/page — fallback (AC-5)", () => {
     const form = screen.getByTestId("lead-capture-form");
     expect(form).toHaveTextContent(messages.contact.nameLabel!);
     expect(form).toHaveTextContent(messages.contact.messageLabel!);
-    expect(screen.getByTestId("contact-submit")).toHaveTextContent("Say hello");
+    expect(screen.getByTestId("contact-submit")).toHaveTextContent(messages.contact.sendMessage!);
 
     await tickAndSubmit({ name: "Ada", email: "ada@example.com" });
-    await waitFor(() => expect(document.body).toHaveTextContent("Got it, thanks."));
+    await waitFor(() =>
+      expect(screen.getByTestId("contact-success-headline")).toHaveTextContent("Message sent."),
+    );
+    expect(document.body).not.toHaveTextContent("Got it, thanks.");
   });
 
-  it("a magnet's submit label wins, and the section's success message still applies", async () => {
+  it("a magnet's submit label and ending win over the section's copy (#8847 D7)", async () => {
     mockFlowsGet.mockResolvedValue(served(contactFormFlowConfig));
 
     await renderPage([
@@ -310,13 +349,121 @@ describe("contact/page — fallback (AC-5)", () => {
       },
     ]);
 
-    const form = screen.getByTestId("lead-capture-form");
     expect(screen.getByTestId("contact-submit")).toHaveTextContent(
       contactFormFromConfig(contactFormFlowConfig, "en")!.submitLabel!,
     );
 
     await tickAndSubmit({ name: "Ada", email: "ada@example.com" });
-    await waitFor(() => expect(document.body).toHaveTextContent("Got it, thanks."));
+    await waitFor(() =>
+      expect(screen.getByTestId("contact-success-headline")).toHaveTextContent("Message sent."),
+    );
+    expect(document.body).not.toHaveTextContent("Got it, thanks.");
+  });
+});
+
+// ── #8847 AC-2 — /contact is the magnet ─────────────────────────────────────
+
+/** A served Contact form whose every visible fact differs from the default. */
+function sayHelloConfig(): FlowConfig {
+  const config = JSON.parse(JSON.stringify(contactFormFlowConfig)) as FlowConfig;
+  const step = config.steps[0] as FieldStep;
+  step.copy = { title: { en: "Say hello" }, body: { en: "Two days, tops." }, cta: { en: "Send" } };
+  step.fields.find((f) => f.name === "terms")!.copy.label = { en: "I agree to the [Terms](terms)." };
+  config.ending = { default: { kind: "screen", headline: { en: "Got it, {name}." } } };
+  return config;
+}
+
+const COLUMN_SECTION = {
+  id: "contact-form",
+  type: "contact-form",
+  data: { variant: "column", headline: "Old heading", description: "Old line", fields: [] },
+};
+
+async function renderColumnPage() {
+  const element = await ContactPage({
+    params: Promise.resolve({ locale: "en" }),
+    getMdxSource: jest.fn().mockResolvedValue({
+      ...source,
+      frontmatter: { ...source.frontmatter, title: "Old title" },
+    }),
+    getPageSections: jest.fn().mockResolvedValue([COLUMN_SECTION]),
+  });
+  return render(element);
+}
+
+describe("contact/page — every visible fact comes from the magnet (#8847 AC-2)", () => {
+  it("the H1, the line, the consent and the ending are the served magnet's", async () => {
+    mockFlowsGet.mockResolvedValue(served(sayHelloConfig()));
+
+    await renderColumnPage();
+
+    const headings = screen.getAllByRole("heading", { level: 1 });
+    expect(headings).toHaveLength(1);
+    expect(headings[0]).toHaveTextContent("Say hello");
+    expect(screen.getByTestId("contact-form-column")).toHaveTextContent("Two days, tops.");
+    expect(
+      document.getElementById("lead-capture-consent-statement")!.textContent,
+    ).toBe("I agree to the Terms.");
+    expect(screen.getByTestId("consent-policy-link-terms")).toBeInTheDocument();
+    for (const old of ["Old heading", "Old line", "Old title"]) {
+      expect(document.body).not.toHaveTextContent(old);
+    }
+
+    await tickAndSubmit({ name: "Ada", email: "ada@example.com" });
+    await waitFor(() =>
+      expect(screen.getByTestId("contact-success-headline")).toHaveTextContent("Got it, Ada."),
+    );
+    const messages = jest.requireActual("../../../../messages/en.json") as {
+      contact: Record<string, string>;
+    };
+    expect(document.body).not.toHaveTextContent(messages.contact.successMessage!);
+  });
+
+  it("generateMetadata's title is the magnet's step title", async () => {
+    mockFlowsGet.mockResolvedValue(served(sayHelloConfig()));
+
+    const metadata = await pageModule.generateMetadata({
+      params: Promise.resolve({ locale: "en" }),
+      getMdxSource: jest.fn().mockResolvedValue({
+        ...source,
+        frontmatter: { ...source.frontmatter, title: "Old title" },
+      }),
+      getPageSections: jest.fn().mockResolvedValue([COLUMN_SECTION]),
+    });
+
+    expect(String((metadata.title as { absolute?: string })?.absolute ?? metadata.title)).toContain(
+      "Say hello",
+    );
+  });
+
+  it("with the hub unreadable, the built-in config's title and two-link statement render", async () => {
+    mockFlowsGet.mockRejectedValue(new Error("hub down"));
+
+    await renderColumnPage();
+
+    expect(screen.getByRole("heading", { level: 1 })).toHaveTextContent("Get in touch");
+    expect(
+      document.getElementById("lead-capture-consent-statement")!.textContent,
+    ).toBe("I accept the Terms and Privacy Policy.");
+  });
+
+  it("under the form, 'Prefer email?' links the _site.mdx contact email; absent with none", async () => {
+    const { readSiteContactEmail } = jest.requireMock("../site-contact-email") as {
+      readSiteContactEmail: jest.Mock;
+    };
+    mockFlowsGet.mockResolvedValue(served(contactFormFlowConfig));
+    readSiteContactEmail.mockReturnValue("hi@x.co");
+
+    const view = await renderColumnPage();
+
+    const line = screen.getByTestId("contact-prefer-email");
+    expect(line).toHaveTextContent("Prefer email? hi@x.co");
+    expect(line.querySelector("a")).toHaveAttribute("href", "mailto:hi@x.co");
+    view.unmount();
+
+    readSiteContactEmail.mockReturnValue(undefined);
+    await renderColumnPage();
+    expect(screen.queryByTestId("contact-prefer-email")).toBeNull();
   });
 });