← All stories

BRANCH · ef-055-mobile-responsive-templates

Mobile-responsive email templates

EF-055Persona: OrganizerRoots in: event-setup

An organizer previews email templates across mobile portrait, mobile landscape, tablet, and desktop, with sample token data and an email-safe max-width around 600px.

Preconditions

Fixture event has responsive templates, sample guests, and assets large enough to expose overflow regressions.

Happy path

  1. Open template list.

    Organizer sees responsive-ready templates and status labels.

  2. Switch preview viewport.

    Mobile, tablet, and desktop previews render the same tokenized email without horizontal scroll.

  3. Send test.

    The previewed responsive template is used for the test-send snapshot.

Failure modes

Send blocked on validation failure

Trigger: responsive template has invalid tokens or overwide fixed blocks.

Resolution: 400 validation blocks send and lists the failing block.

Bounced recipient tracked and suppressed

Trigger: responsive test recipient bounces.

Resolution: bounce is stored and suppression is honored later.

Scheduled-message edit window

Trigger: scheduled responsive mailing edit occurs after cutoff.

Resolution: 409 PAST_EDIT_WINDOW.

Retry on transient failure

Trigger: provider 5xx.

Resolution: retry uses same Idempotency-Key and sent_count remains one.

Idempotency-key on test-send

Trigger: double-click Send test.

Resolution: one test email is produced.

Recipient resolution empty

Trigger: audience resolves to zero.

Resolution: 409 NO_RECIPIENTS with clear empty-audience copy.

Token rendering fallback

Trigger: sample data lacks first name.

Resolution: preview uses fallback, not blank text.

Cancel scheduled before send

Trigger: organizer cancels queued responsive send.

Resolution: queue drains and audit logs cancellation.

Viewport overflow regression

Trigger: mobile portrait preview renders a 700px block.

Resolution: no horizontal scroll and computed max-width stays email-safe.

Sample token mismatch

Trigger: preview uses placeholder data different from send data.

Resolution: sample data source is labeled and tokens render consistently.

Deployed-runtime gap

Trigger: deployed run on 2026-04-29 observed template list/preview 404; the probe locks this in until the gap is closed.

Resolution: the 404 remains expected until deployed list and preview routes are reachable.

Stable test attributes

Visibility teeth. Each attribute must be effectively visible when active.

responsive-template-pagePageTemplate surface
responsive-template-listPageTemplate list
responsive-template-previewPreviewEmail render
responsive-viewport-tabsPreviewViewport switcher
responsive-sample-data-pickerPreviewSample tokens
responsive-template-test-send-ctaToolbarTest send
responsive-template-warningPageValidation
responsive-template-gap-panelPageRuntime gap

Agent test plan

- responsive-template-renders
- switch-mobile-preview
- responsive-test-send
- deployed-runtime-gap