Wraps component destructor in a trycatch #409
Merged
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.
Summary & motivation
When the Payment Element destroys itself, React doesn't always know about it. So when React attempts to unmount the a destroyed PE, an integration error is thrown and the application crashes.
One reproducible scenario of this is when creating a PE with an
amount
that is too small. The call to elements/session returns an error like this:Then the
loaderror
event is triggered. (I believe the component self-destructs in stripe-js, but React still has a reference to it.) So if the merchant attempts to unmount the PE or a wrapper around the PE, the app crashes because it tries to calldestroy()
on a component that isn't there.The solution (at least for now)
Wrap the
destroy()
call in a trycatch, so that it doesn't crash the app.Testing & documentation
Manually validated the change. Existing tests continue to pass.