OSSForks/react
1
0
Fork 0
mirror of https://github.com/zebrajr/react.git synced 2025-12-06 12:20:20 +01:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

Ignore generic InvalidStateError in View Transitions (#34450)

Browse Source 
Fixes #34098.

There's an issue in Chrome where the `InvalidStateError` always has the
same error message. The spec doesn't specify the error message to use
but it's more useful to have a specific one for each case like Safari
does.

One reason it's better to have a specific error message is because the
browser console is not the main surface that people look for errors.
Chrome relies on a separate log also in the console. Frameworks has
built-in error dialogs that pop up first and that's where you see the
error and that dialog can't show something specific. Additionally, these
errors can't log something specific to servers in production logging. So
this is a bad strategy.

It's not good to have those error dialogs pop up for non-actionable
errors like when it doesn't start because the document was hidden. Since
we don't have more specific information we have no choice but to hide
all of them. This includes actionable things like duplicate names
(although we also have a React specific warning for that in the common
case).
This commit is contained in:
Sebastian Markbåge 2025-09-10 09:07:11 -04:00 committed by GitHub
parent 3bf8ab430e
commit a34c5dff15
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js vendored
View File

@ -2046,24 +2046,17 @@ function customizeViewTransitionError(
error.message ===
'Skipping view transition because document visibility state has become hidden.' ||
error.message ===
'Skipping view transition because viewport size changed.'
'Skipping view transition because viewport size changed.' ||
// Chrome uses a generic error message instead of specific reasons. It will log a
// more specific reason in the console but the user might not look there.
// Some of these errors are important to surface like duplicate name errors but
// it's too noisy for unactionable cases like the document was hidden. Therefore,
// we hide all of them and hopefully it surfaces in another browser.
error.message === 'Transition was aborted because of invalid state'
) {
// Skip logging this. This is not considered an error.
return null;
}
if (__DEV__) {
if (
error.message === 'Transition was aborted because of invalid state'
) {
// Chrome doesn't include the reason in the message but logs it in the console..
// Redirect the user to look there.
// eslint-disable-next-line react-internal/prod-error-codes
return new Error(
'A ViewTransition could not start. See the console for more details.',
{cause: error},
);
}
}
break;
}
}