Skip to content

Scope viewport entrances to device documents through core viewport queries - #5260

Merged
chubes4 merged 2 commits into
trunkfrom
feat/media-scoped-entrances
Nov 9, 2026
Merged

chubes4 merged 2 commits into
trunkfrom
feat/media-scoped-entrances

Conversation

@chubes4

@chubes4 chubes4 commented Nov 9, 2026 •

Copy link
Copy Markdown
Contributor

Problem

A source can play an entrance animation on some devices only. Wix, for example, animates sections on desktop and tablet but not on phones. When Data Liberation merges device documents into one tree, the replay runtime has no device scope, so a desktop-only entrance would animate on mobile too. Because of that, Data Liberation has to keep such routes as dual documents (Automattic/data-liberation-agent#1613, step 3).

Fix

Entrance evidence can carry an optional devices list: the device-document keys whose source plays the entrance. This is the same vocabulary as device-only/device-hide.

  • Blocks Engine already turns core device keys into core block visibility, so it resolves the scope the same way. The emitted theme bootstrap passes the site's live WP_Theme_JSON::get_viewport_media_queries() (with include_desktop) to the runtime. An entrance's device scope therefore always matches block visibility, even if the theme's breakpoints change later.
  • A device without a core query, such as a custom profile, matches the selected device document.
  • Outside its devices, the runtime treats an entrance like reduced motion: it applies the settled (after) pose and doesn't arm the observer.
  • Evidence without devices behaves exactly as before.

Evidence

  • tests/contract/viewport-entrance-runtime-browser.mjs gets an other-device mode: at 1440px, a ["mobile"] entrance renders its final visible pose. The normal mode now carries ["desktop"] and still runs the full transition and repeat lifecycle. The new mode fails on trunk (other-device: final visible markup) and passes with the fix.
  • The emitted bootstrap's query extraction, run on WordPress 7.1 core with mobile: 480px, tablet: 782px, gives {"mobile":"(width <= 480px)","tablet":"(480px < width <= 782px)","desktop":"(width > 782px)"}.
  • viewport-entrance-runtime.php and viewport-entrance-shared-footer.php contracts pass, and phpcs is clean.
  • The Data Liberation side, which writes devices when it merges one-sided entrance evidence, follows in a separate PR.

AI disclosure: diagnosed and implemented by Claude (Opus) via the Pi coding agent for Chris Huber, outside Homeboy Cook (Homeboy daemon stale after an upgrade; operator authorized a direct fix). Verification: the browser contract was run locally against trunk and against the fix, plus the core query extraction on WP 7.1, the PHP contracts and phpcs; full suites in CI.

@chubes4 chubes4 changed the title Settle device-scoped viewport entrances outside their media query Scope viewport entrances to device documents through core viewport queries Nov 9, 2026
@chubes4
chubes4 force-pushed the feat/media-scoped-entrances branch from 6ec0d9c to 16f6c10 Compare November 9, 2026 17:49
@chubes4
chubes4 merged commit 783af6e into trunk Nov 9, 2026
13 checks passed
@chubes4
chubes4 deleted the feat/media-scoped-entrances branch November 9, 2026 18:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant