Skip to content

[codex] Expand real-route app store screenshot harness#4014

Open
juliusmarminge wants to merge 10 commits into
mainfrom
t3code/app-store-screenshot-harness
Open

[codex] Expand real-route app store screenshot harness#4014
juliusmarminge wants to merge 10 commits into
mainfrom
t3code/app-store-screenshot-harness

Conversation

@juliusmarminge

@juliusmarminge juliusmarminge commented Jul 15, 2026

Copy link
Copy Markdown
Member

Summary

Adds a reproducible App Store screenshot harness that drives the real mobile app through production routes. There is no screenshot-only route or recreated application UI.

Every run creates three isolated ephemeral --base-dir environments and real T3 servers, pairs the app with all three through the normal connection flow, and navigates the production Home, Thread, ThreadTerminal, ThreadReview, Settings, and SettingsEnvironments screens.

The fixture presents T3 Code, React, and Linux projects with recognizable SVG favicons, six playful threads, varied branches/statuses, and three remote-first machine identities: Moonbase Terminal, Suspense Station, and Kernel Cabin. Two genuine persisted outbox tasks appear as Pending to showcase offline composition. The featured T3 Code workspace includes persisted terminal output and a deterministic two-file diff.

Navigation fidelity

  • Thread, terminal, and review captures use a real root stack with Home underneath, so native back controls and split-view behavior match normal app navigation.
  • Threads returns with a stack pop, preserving the mounted tablet sidebar.
  • Environments uses the real SettingsSheet with the nested Settings → Environments stack.
  • On iOS, Environments is the production form sheet over the dimmed Threads screen, including its grabber and back control.

Environments scene

  • Local cards are three genuinely paired servers with Tailscale, VPS, and Tailnet-style display addresses.
  • Aurora GPU Pod is a deterministic connected T3 Connect row.
  • Pocket Pi is a deterministic available / relay-online T3 Connect row.
  • Only T3 Connect discovery/status input is substituted in showcase mode; visible UI remains the real screen.

Upload-ready capture matrix

pnpm screenshots:mobile captures five scenes across six store slots, producing 30 PNGs:

  • App Store Connect iPhone 6.9-inch — 1320×2868
  • App Store Connect iPhone 6.5-inch — 1284×2778
  • App Store Connect iPad 13-inch — 2064×2752
  • Google Play phone — 1080×1920 portrait 9:16
  • Google Play 7-inch tablet — 1080×1920 portrait 9:16 at 600dp
  • Google Play 10-inch tablet — 1440×2560 portrait 9:16 at 800dp

Every captured file is converted to 8-bit, 24-bit RGB PNG without alpha and validated for exact dimensions, aspect ratio, file size, and store screenshot count. --validate-only checks existing assets without starting servers, Metro, simulators, or emulators. Store-specific directories can be uploaded directly.

GitHub Actions capture

  • Mobile Showcase Screenshots can be dispatched for all, ios, or android.
  • iOS and Android run concurrently on Blacksmith macOS and Linux runners.
  • The workflow runs the standalone validator before upload.
  • Artifacts are split into app-store-connect-screenshots and google-play-screenshots and retained for 14 days.
  • Partial captures upload on failed runs for diagnosis.

Reliability details

  • Android multi-environment launch data uses URI-encoded JSON so adb shell cannot strip payload quotes.
  • Capture waits for real workspace hydration and route-specific native readiness.
  • Pending rows use the production mobile outbox and editing hold.
  • Review readiness depends on a parsed file diff.
  • Android native diff payload delivery retries the Expo/Fabric view-registration race.
  • The runner creates and removes a disposable iPhone 14 Plus simulator when needed.
  • The strict pnpm workspace declares the Expo config-plugin dependency required by the Clerk app plugin, keeping clean native builds reproducible.

Validation

  • Full live 30-shot matrix completed successfully across iOS and Android phone/tablet sizes.
  • Standalone upload validation passed all 30 generated files.
  • Representative images from all six classes were visually inspected.
  • vp check — passed with 0 errors; 9 existing web warnings.
  • vp run typecheck — passed.
  • vp run lint:mobile — passed.
  • vp test scripts/mobile-showcase.test.ts — 16 tests passed.
  • git diff --check — passed.

Note

Add automated mobile app store screenshot capture harness for iOS and Android

  • Adds scripts/mobile-showcase.ts, a CLI tool that boots iOS simulators and Android emulators, seeds isolated showcase environments, drives the app through predefined scenes, and captures/validates store-ready PNGs against Apple and Google Play dimension/format requirements.
  • Adds scripts/mobile-showcase-environment.ts to seed reproducible showcase environments: creates local Git workspaces, writes fixture files, and populates a SQLite database with projects, threads, messages, and projector state.
  • Adds scripts/mobile-showcase.config.ts defining the device matrix (3 iOS, 3 Android), per-device store asset specs, and scene list.
  • Adds ShowcaseCaptureCoordinator in the mobile app that, when EXPO_PUBLIC_SHOWCASE=1, auto-connects to pairing URLs, seeds pending thread tasks, navigates to the requested scene, and signals native readiness via a cache/marker file.
  • Adds autoFocus prop to the native terminal view on both iOS and Android, and disables it in showcase mode to prevent the software keyboard from appearing in screenshots.
  • Adds a GitHub Actions workflow (.github/workflows/mobile-showcase-screenshots.yml) for CI-based capture and artifact upload.
  • Risk: showcase mode suppresses all React Native logs (LogBox.ignoreAllLogs) and alters environment display URLs and cloud environment data, so it must not be enabled in production builds.

Macroscope summarized 687930d.


Note

Medium Risk
Showcase flag alters runtime (LogBox off, fixture data, navigation automation) but is env-gated; iOS keychain wipe and thread-outbox dedupe behavior affect only showcase or edge retries.

Overview
Adds an end-to-end mobile app store screenshot pipeline that boots disposable T3 servers, pairs the real dev client, navigates production routes, and writes upload-validated PNGs for Apple and Google Play.

Runner & CI: Root pnpm screenshots:mobile runs scripts/mobile-showcase.ts with seeded environments (mobile-showcase-environment.ts), device/scene matrix config, PNG normalization/validation, and ops docs. A new Mobile Showcase Screenshots workflow captures iOS (simulators) and Android (KVM emulator) in parallel and uploads artifacts.

App showcase mode (EXPO_PUBLIC_SHOWCASE=1): ShowcaseCaptureCoordinator reads pairing URLs and target scenes from native hooks, seeds pending outbox tasks, resets navigation to threads/thread/terminal/review/environments, and signals scene ready for the runner. Environments settings use fixture cloud rows and cosmetic display URLs without persisting fake hosts. Review marks ready on native diff draw events; terminal gets autoFocus off so keyboards stay out of shots.

Native bridge: T3NativeControls gains pairing URL, scene, prepare (iOS keychain clear), and ready markers; terminal modules expose autoFocus. Small fixes: outbox enqueue replaces duplicate message IDs; native review diff registration error matching expanded.

Reviewed by Cursor Bugbot for commit 687930d. Bugbot is set up for automated code reviews on this repo. Configure here.

Co-authored-by: codex <codex@users.noreply.github.com>
@coderabbitai

coderabbitai Bot commented Jul 15, 2026

Copy link
Copy Markdown

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 2d208286-b64f-41d7-af80-daad22553051

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch t3code/app-store-screenshot-harness

Comment @coderabbitai help to get the list of available commands.

@github-actions github-actions Bot added vouch:trusted PR author is trusted by repo permissions or the VOUCHED list. size:XXL 1,000+ changed lines (additions + deletions). labels Jul 15, 2026
Comment thread scripts/mobile-showcase.ts Outdated
Comment thread scripts/mobile-showcase.ts Outdated
@juliusmarminge juliusmarminge marked this pull request as ready for review July 16, 2026 06:44
Comment thread scripts/mobile-showcase.ts Outdated
Comment thread scripts/mobile-showcase.ts
Comment thread apps/mobile/src/Stack.tsx Outdated
@macroscopeapp

macroscopeapp Bot commented Jul 16, 2026

Copy link
Copy Markdown
Contributor

Approvability

Verdict: Needs human review

This PR introduces a substantial new mobile screenshot capture feature with new native module functions, new components, a new CI workflow, and a production runtime change in the thread outbox manager. The scope and nature of these changes warrant human review.

You can customize Macroscope's approvability policy. Learn more.

Co-authored-by: codex <codex@users.noreply.github.com>
@juliusmarminge juliusmarminge changed the title [codex] Add mobile screenshot harness [codex] Add real-route mobile screenshot harness Jul 16, 2026
Comment thread apps/mobile/src/features/review/ReviewSheet.tsx Outdated
Comment thread apps/mobile/src/features/showcase/ShowcaseCaptureCoordinator.tsx
Co-authored-by: codex <codex@users.noreply.github.com>
@juliusmarminge juliusmarminge changed the title [codex] Add real-route mobile screenshot harness [codex] Expand real-route app store screenshot harness Jul 16, 2026
Comment thread scripts/mobile-showcase.ts
Comment thread apps/mobile/src/features/showcase/ShowcaseCaptureCoordinator.tsx Outdated
Comment thread apps/mobile/src/features/showcase/ShowcaseCaptureCoordinator.tsx
juliusmarminge and others added 2 commits July 16, 2026 11:55
Co-authored-by: codex <codex@users.noreply.github.com>
Co-authored-by: codex <codex@users.noreply.github.com>
Comment thread scripts/mobile-showcase.config.ts Outdated
Comment thread scripts/mobile-showcase.config.ts
Co-authored-by: codex <codex@users.noreply.github.com>
Comment thread apps/mobile/src/features/showcase/ShowcaseCaptureCoordinator.tsx Outdated
Co-authored-by: codex <codex@users.noreply.github.com>
Preserve both showcase initialization and incoming-share navigation handling while resolving the mobile app startup conflict.

Co-authored-by: codex <codex@users.noreply.github.com>
Comment thread apps/mobile/src/features/showcase/ShowcaseCaptureCoordinator.tsx Outdated
Co-authored-by: codex <codex@users.noreply.github.com>

@cursor cursor Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes using high effort and found 1 potential issue.

There are 5 total unresolved issues (including 4 from previous reviews).

Fix All in Cursor

Bugbot Autofix is ON, but a cloud agent failed to start.

Reviewed by Cursor Bugbot for commit 584c932. Configure here.

Comment thread scripts/mobile-showcase.ts
Comment thread scripts/mobile-showcase.ts
Co-authored-by: codex <codex@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

size:XXL 1,000+ changed lines (additions + deletions). vouch:trusted PR author is trusted by repo permissions or the VOUCHED list.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant