Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions client/dashboard/app/boot.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { handleOAuthCallback } from './auth/oauth-callback';
import { loadPreferencesHelper } from './dev-tools/preferences';
import Layout from './layout';
import { omnibarEvents } from './omnibar/events';
import { suppressSkippedViewTransitions } from './router/suppress-skipped-view-transitions';
import limitTotalSnackbars from './snackbars/limit-total-snackbars';
import type { AppConfig } from './context';

Expand All @@ -32,6 +33,7 @@ function boot( config: AppConfig ) {
loadDevHelpers();
loadPreferencesHelper();
limitTotalSnackbars();
suppressSkippedViewTransitions();
initSentry();

const rootElement = document.getElementById( 'wpcom' );
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
let isWrapped = false;

/**
* TanStack Router drives navigations through `document.startViewTransition()`
* but discards the returned `ViewTransition`. When a navigation supersedes an
* in-flight one, the browser skips the pending transition and its `ready`
* promise rejects with `AbortError: Transition was skipped`, surfacing as an
* uncaught promise rejection. Skipping is the correct browser behavior; only
* the unhandled rejection is noise.
*
* Wrap `startViewTransition` once so the transition's promises always have a
* handler. Only the skip `AbortError` is swallowed; any other rejection is
* re-thrown so real failures stay visible.
*/
export function suppressSkippedViewTransitions() {
if (
isWrapped ||
typeof document === 'undefined' ||
typeof document.startViewTransition !== 'function'
) {
return;
}
isWrapped = true;

const startViewTransition = document.startViewTransition.bind( document );

const swallowSkippedTransition = ( error: unknown ) => {
if ( error instanceof DOMException && error.name === 'AbortError' ) {
return;
}
throw error;
};

document.startViewTransition = ( ...args: Parameters< typeof startViewTransition > ) => {
const transition = startViewTransition( ...args );
transition.ready.catch( swallowSkippedTransition );
transition.updateCallbackDone.catch( swallowSkippedTransition );
transition.finished.catch( swallowSkippedTransition );
return transition;
};
}
3 changes: 3 additions & 0 deletions client/sites/v2/utils/router.ts
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
import pagejs from '@automattic/calypso-router';
import { createMemoryHistory } from '@tanstack/react-router';
import { suppressSkippedViewTransitions } from 'calypso/dashboard/app/router/suppress-skipped-view-transitions';
import UnknownError from '../components/500';
import type { AnyRoute, AnyRouter } from '@tanstack/react-router';
import type { AppConfig } from 'calypso/dashboard/app/context';

export function getRouterOptions( config: AppConfig ) {
suppressSkippedViewTransitions();

return {
basepath: config.basePath,
context: {
Expand Down
Loading