site-builder: relay wiring on FormContainer (template forms) + shared helper

The recipient field was only on the ContactForm block; templates build forms from FormContainer + InputField, so template-based contact forms had no way to set a target address. Add 'Send submissions to' + thank-you fields to FormContainer, and extract the marker/placeholder/honeypot into a shared form-relay-wiring helper so ContactForm and FormContainer can't drift.
2026-07-07 13:35:18 -07:00
parent 6b9c258d26
commit b9c5d3dd1c
4 changed files with 109 additions and 10 deletions
@@ -0,0 +1,27 @@
+import { describe, test, expect } from 'vitest';
+import { FormContainer } from './FormContainer';
+
+const toHtml = (FormContainer as any).toHtml;
+
+describe('FormContainer.toHtml relay wiring', () => {
+  test('with recipientEmail: marker + placeholder action + honeypot, forces POST', () => {
+    const { html } = toHtml({ recipientEmail: 'a@b.com', thankYouUrl: '/thx', method: 'GET' }, '<input name="email">');
+    expect(html).toMatch(/<!--WHP-FORM id="F[0-9a-z]+" recipient="a@b.com" thankyou="\/thx"-->/);
+    expect(html).toMatch(/action="__WHP_FORM_ACTION__F[0-9a-z]+__"/);
+    expect(html).toContain('method="POST"');            // relay forces POST even though method=GET
+    expect(html).toContain('name="_gotcha"');
+    // honeypot precedes the form's children
+    expect(html.indexOf('_gotcha')).toBeLessThan(html.indexOf('name="email"'));
+    // marker id === action id
+    const mid = html.match(/id="(F[0-9a-z]+)"/)![1];
+    expect(html).toContain(`__WHP_FORM_ACTION__${mid}__`);
+  });
+
+  test('without recipientEmail: legacy action/method, no marker or honeypot', () => {
+    const { html } = toHtml({ action: '/legacy', method: 'POST' }, '<input name="email">');
+    expect(html).not.toContain('WHP-FORM');
+    expect(html).not.toContain('_gotcha');
+    expect(html).toContain('action="/legacy"');
+    expect(html).toContain('<input name="email">');
+  });
+});