fix(homepage): Handle AbortError during video playback

[sentry]

This PR addresses an issue where an unhandled AbortError was reported by Sentry when video.play() was interrupted by video.pause(). This typically occurred with rapid user interaction (e.g., double-clicking the play/pause button on the homepage video).

The root cause was that void video.play() discarded the Promise returned by play(), leading to an unhandled rejection when the browser threw an AbortError due to interruption.

The fix involves modifying the togglePlayback function in src/routes/index.tsx to explicitly catch the Promise returned by video.play(). A .catch() handler is added to ignore AbortError instances, which are expected and harmless in this scenario, while still allowing other unexpected errors to be handled.

Fixes TANSTACK-COM-4NM

_{This PR was automatically generated by Sentry. You can adjust this setting at any time.}

[cloudflare-workers-and-pages]

Deploying with    Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	tanstack-com	f3ed00f	Commit Preview URL Branch Preview URL	Sep 02 2026, 11:03 PM

[tannerlinsley]

Reproduced the interruption with the current extracted HeroPalmMedia component in a local browser fixture. I delayed the MP4 response by 30 seconds, opened the component, then pressed Pause while play() was pending. That logged Unable to play the homepage hero animation with an AbortError saying the play request was interrupted by pause().

The current code catches the rejection already, so this was a console error, not an unhandled promise rejection. Its catch also clears the playing and ready state. The old index.tsx hunk needs to move to components/home/HeroPalmMedia.tsx.

In the same fixture, returning early for a DOMException named AbortError stopped the new error log and left the button at Play after pausing. That is a local candidate only, I still need to check other playback failures and restart behavior before committing it.

[tannerlinsley]

The current-component fix is now in #1378. The delayed-video check also passed through restart to visible playback at readyState 4, and invalid media still logged NotSupportedError and left the Play button visible. Full pnpm test and the commit hook both passed.

I'll keep this linked until #1378 finishes CI and merges, then close this older route-level patch as superseded.

[tannerlinsley]

Fixed in #1378, now merged as 86bee61. The fix handles expected playback interruptions in the current HeroPalmMedia component, with delayed pause/restart and genuine media failure checks plus passing full tests and CI. Closing this older route-level patch as superseded.