Skip the award emoji cache update when the query is not cached
What does this MR do and why?
Fixes an uncaught TypeError on the work item and issue detail pages when a reaction is toggled before the reactions have loaded.
When the user adds or removes a reaction, app/assets/javascripts/work_items/components/work_item_award_emoji.vue runs the updateAwardEmoji mutation. Its update(cache) callback calls updateWorkItemAwardEmojiWidgetCache, which reads the award emoji query from the cache and updates it with produce.
cache.readQuery returns null when that query, with those exact variables, is not in the cache yet. That happens when the reaction is toggled before the award emoji query has resolved. produce(null, recipe) calls the recipe with null, so reading draftState.namespace threw TypeError: Cannot read properties of null (reading 'namespace'). Apollo logs errors thrown in a mutation update through invariant.error, so the console shows it as an uncaught error with a stack that points at vendor.dll.bundle.js.
In CI this logged the error in 1 example of spec/features/work_items/issues/user_interacts_with_awards_spec.rb.
Changes made:
work_item_award_emoji.vue— return early from the cache update whenreadQueryreturns null. The refetch that follows the mutation still brings the list up to date, so nothing is lost.work_item_award_emoji_spec.js— new block "when the award emoji query has not been cached yet". It mounts with a query handler that never resolves, awards an emoji, and asserts the mutation ran and no error was emitted. The test fails on the old code and passes with the fix.
How to set up and validate locally
- Open an issue.
- In DevTools, throttle the network to "Slow 3G" and reload.
- As soon as the reactions bar renders, click the thumbs up reaction before the page finishes loading.
- Check the console shows no
reading 'namespace'TypeError, and that the reaction appears once the requests finish. - Remove the throttling and toggle a reaction again.
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
- I have evaluated the MR acceptance checklist for this MR.
References
- Addresses one entry of #628901 (browser console error catalogue, section B)
- Errors surfaced by !255207 (closed) (feature specs fail on console errors)
- Sibling fixes from the same catalogue: !255305 (merged), !255309 (merged), !255311 (merged), !255313 (merged), !255315 (merged), !255316 (merged), !255319 (merged), !255321 (merged), !255322 (merged), !255325 (merged)