fix(react-query): propagate falsy errors from useMutation to the error boundary - #11311
fix(react-query): propagate falsy errors from useMutation to the error boundary#11311yogesh968 wants to merge 1 commit into
Conversation
…r boundary
useMutation gated the error boundary throw on `result.error` being truthy. A
mutationFn that rejects with a falsy value, for example `Promise.reject()` or
`Promise.reject('')`, leaves the mutation in the error state but never reaches
the boundary, so the component keeps rendering as if nothing failed.
Gate on `result.isError` instead, matching what useQuery already does through
getHasError and what TanStack#11305 fixed for useQueries.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_019MfJ49iHsRNpy4oibuXzrz
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (3)
Included review availability: Your plan provides up to 10 included reviews per hour; 8 remain after this review. 📝 WalkthroughWalkthrough
ChangesMutation error boundary handling
Estimated code review effort: 2 (Simple) | ~10 minutes Merge Risk: ⚪ Minimal · up to This change makes falsy mutation rejections reach the error boundary as intended and adds focused regression coverage; no actionable merge-blocking risk remains after normal checks and review. 🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (3 passed)
Full details: Description checkExplanation The description clearly explains the bug, fix, affected behavior, and test coverage. However, it omits the required Full details: Docstring CoverageExplanation Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 2 functions across 2 files. (1 skipped: 1 unsupported.)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
useMutationdecides whether to hand the error to the error boundary with:The
result.error &&guard means amutationFnthat rejects with a falsy value never reaches the boundary.Promise.reject(),Promise.reject('')andPromise.reject(0)all leave the mutation in the error state,isErroristrue, but the component keeps rendering as if nothing went wrong andthrowOnErroris never consulted.This is the same class of bug as #11305, which fixed it for
useQueriesanduseSuspenseQueries.useQuerywas already correct becausegetHasErrorinerrorBoundaryUtils.tsgates onresult.isError.useMutationwas the one place left.Solid and Angular already gate their equivalent checks on
state.isError, so this brings React in line with them too.The fix
Gate on
result.isErrorinstead of on the error value being truthy.Test
packages/react-query/src/__tests__/useMutation.test.tsxgets a case where themutationFnrejects withundefinedandthrowOnError: trueis set. It expects the boundary fallback to render. Onmainit fails withexpected null not to be null; with the change it passes.Full
@tanstack/react-querysuite passes.Summary by CodeRabbit
Bug Fixes
useMutationso errors with falsy values, such asundefined, are correctly propagated to the error boundary whenthrowOnErroris enabled.Tests
Release
@tanstack/react-query.