Return a new rejected promise instead of throwing an error in the action error handler for devtools #1970
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Fixes vuejs#1969 This code was deliberately throwing an error for the sole purpose of re-rejecting a promise that had been caught in order to emit an event for the devtools hook. However, throwing an error will also trigger the native browser devtools' "pause on exception" behaviour because the error is being thrown without a `try..catch` block. In order to re-reject the promise safely we can use Promise.reject() - this gets handled by the promise in the same way as using `throw`, but the browser devtools will not pause.
6twenty
changed the title
6twenty
changed the title
6twenty
changed the title
arthurfiorette
approved these changes
Dec 29, 2021
gustavoabel
approved these changes
Apr 9, 2022
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes #1969 - refer to this issue for background and demo.
This change only affects the developer experience, and only when using the Vue devtools extension (as far as I can tell); it relates to code that is only called when
store._devtoolHookis defined.The code in question deals with catching errors in action promises, so that the devtools hook can be notified by emitting an event. Catching the rejected promise means that the promise needs to be re-rejected so that the user's code can have its own error handling and carry on as if the error had not been caught in the first place.
The original code was re-rejecting the promise by throwing the error. However, throwing an error has a side effect of causing the browser's own devtools to pause when using the "pause on exceptions" feature, because from the browser's perspective this is an uncaught exception - an error has been thrown, and the browser is not concerned about whether this is happening in a promise, or whether the promise rejection is subsequently caught and handled safely. As a result this behaviour can be annoying during development when testing code that should be resilient to promise rejections. However, simply returning a rejected promise (and passing in the error) allows this code to behave exactly the same way but without triggering the browser's "pause on exceptions" behaviour.