Public Event Page

Happy path

1. Guest navigates to vxge-aperture.porivo.com/p/<event-slug>.

   No login. The booking-pages app serves the route. Initial paint shows the event hero (image / brand color block + name) within ~500ms even on slow connections.

2. Page renders the event identity.

   Hero with event name as H1, date + time + timezone, location (with map link if address-style location), hosting organization name, and brand styling pulled from the event's Canvas-driven design.

3. Guest scrolls; sees the description, schedule (if any), speakers (if any), and the registration CTA.

   CTA is visible in the hero AND repeated at the bottom for long pages. CTA's label depends on access type — "Register," "Buy ticket," "RSVP," "Request invitation." Public-pricing access types show a price near the CTA.

4. Guest clicks the CTA.

   For public-registration events: opens the registration modal (EF-031). For invite-to-RSVP: redirects to the invite-required path (EF-018). For invite-to-purchase: similar with payment flow. For public-purchase: registration modal followed by Stripe checkout.

5. Social-share metadata renders correctly.

   Open Graph tags on the page produce a rich preview when the URL is pasted into Slack, iMessage, Twitter, LinkedIn. Title = event name, description = first 160 chars of event description, image = event hero image.

Failure modes

Edge cases

Page evaluation

Acceptance signals

• URL matches ^https?://[^/]+/p/[a-z0-9-]+/?$.
• Event hero with H1 = event name renders within 500ms (TTFB + first paint).
• document.title is set in HTML (no JS required) and matches the event name.
• Open Graph meta tags are present: og:title, og:description, og:image, og:url, og:type.
• Twitter Card meta tags are present: twitter:card = "summary_large_image", twitter:title, twitter:description, twitter:image.
• No console errors at severity ≥ warn.
• TTI under 3s on broadband, under 8s on simulated 3G.
• No layout shift > 0.1 in the first 5s.
• Page is accessible without JavaScript for the hero and primary information; only the registration CTA's modal requires JS.

Stable test attributes

Visibility teeth. Each attribute must be present AND effectively visible when the relevant surface state is active. Hiding without removal is a Ratchet violation.

Agent test plan

preconditions: none (no auth)

happyPath:
1. navigate to ${BOOKING_BASE_URL}/p/${fixture.eventSlug}
2. wait for [data-test=public-event-page]
3. assert event-hero visible, event-name as H1, event-date and event-location visible
4. assert register-cta above the fold at 1280x800 AND at 375x667
5. assert document.title contains event name AND organization name
6. assert OG meta tags present in DOM head
7. assert TTI under 3s broadband, under 8s 3g
8. assert no console errors from voyage origins

- not-found: navigate to /p/wrong-slug, assert event-not-found-page AND document.title = "Event not found · Voyage" AND slug does not appear in title
- archived: navigate to /p/${fixture.archivedSlug}, assert event-archived-page AND optional subscribe CTA
- draft-as-not-found: navigate to /p/${fixture.draftSlug}, assert same content as not-found
- capacity-full: navigate to /p/${fixture.fullCapacitySlug}, assert register-cta says "Join waitlist" OR is disabled with capacity-context visible
- invite-only-no-token: navigate to /p/${fixture.inviteOnlySlug}, assert invite-only-page AND request-invitation-cta visible
- invite-only-show-title-disabled: with show-title-disabled fixture, assert event-name absent from rendered body
- slow-network: throttle slow-3g, navigate, assert event-hero paints within 2s, full TTI under 8s
- modal-back-button: open registration modal, browser back, assert modal closed AND URL reverted to /p/:slug
- og-tags-present: navigate, assert HEAD contains og:title, og:description, og:image, og:url, og:type
- og-tags-with-fragment: navigate to /p/:slug#schedule, assert OG tags identical to bare /p/:slug