Skip to content

ECHOES-1269 Fix compose-refs repeated callback updates in React 19#662

Merged
david-cho-lerat-sonarsource merged 1 commit intomainfrom
david/complete-compose-refs-patch
Mar 25, 2026
Merged

ECHOES-1269 Fix compose-refs repeated callback updates in React 19#662
david-cho-lerat-sonarsource merged 1 commit intomainfrom
david/complete-compose-refs-patch

Conversation

@david-cho-lerat-sonarsource
Copy link
Copy Markdown
Contributor

This PR extends our @radix-ui/react-compose-refs patch to prevent repeated callback-ref updates with the same DOM node.

We already patched setRef to ignore null callback invocations.
This PR adds a second guard in composeRefs to short-circuit when the incoming node is identical to the previous one.

Why

With React 19, callback refs can be invoked in patterns that trigger repeated updates even when the node identity does not change.
In Echoes usage paths (notably Select/Popover stacks), this can lead to render/update churn and, in some contexts, Maximum update depth exceeded.

What changed

In .yarn/patches/@radix-ui-react-compose-refs-npm-1.1.2-f0371f8267.patch:

  • Keep existing behavior: do not forward null to callback refs in setRef.
  • Add idempotency in composeRefs(...refs):
    • store previousNode
    • return early when node === previousNode

Scope

  • Patch-level change in a Radix dependency used by Echoes.
  • No public API changes in Echoes components.

Expected impact

  • Reduces unnecessary callback-ref executions.
  • Prevents ref-driven update loops in affected React 19 paths.
  • Should stabilize consumers seeing Maximum update depth exceeded from Echoes internals.

@netlify
Copy link
Copy Markdown

netlify bot commented Mar 25, 2026

Deploy Preview for echoes-react ready!

Name Link
🔨 Latest commit edcafb3
🔍 Latest deploy log https://app.netlify.com/projects/echoes-react/deploys/69c39cefa98cf000087720f1
😎 Deploy Preview https://deploy-preview-662--echoes-react.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@hashicorp-vault-sonar-prod hashicorp-vault-sonar-prod bot changed the title Fix compose-refs repeated callback updates in React 19 ECHOES-1269 Fix compose-refs repeated callback updates in React 19 Mar 25, 2026
@hashicorp-vault-sonar-prod
Copy link
Copy Markdown

hashicorp-vault-sonar-prod bot commented Mar 25, 2026

ECHOES-1269

@sonar-review-alpha
Copy link
Copy Markdown

sonar-review-alpha bot commented Mar 25, 2026

Summary

Adds an idempotency check to the composeRefs function in the patched Radix react-compose-refs library. When React 19 invokes the composed ref callback multiple times with the same DOM node, the patch now short-circuits instead of re-executing all ref assignments. This prevents unnecessary updates and update-depth errors in stacked components like Select/Popover. The fix maintains state across callback invocations using a closure variable (previousNode) to detect repeats.

What reviewers should know

The actual change is in .yarn/patches/@radix-ui-react-compose-refs-npm-1.1.2-f0371f8267.patch (lines 47–58 in the unified diff). Look for the previousNode closure variable and the identity check if (node === previousNode). The logic is: store the node on each call, bail early if it's identical to the previous one, otherwise proceed with setting all refs. Both the patch source and dist/index.mjs are updated in lockstep — the yarn.lock changes just reflect the recomputed hash. No behavioral change for cases where the node identity actually differs.


  • Generate Walkthrough
  • Generate Diagram

🗣️ Give feedback

@sonarqube-next
Copy link
Copy Markdown

Quality Gate passed Quality Gate passed

Issues
0 New issues
0 Fixed issues
0 Accepted issues

Measures
0 Security Hotspots
0 Dependency risks
No data about Coverage
No data about Duplication

See analysis details on SonarQube

@david-cho-lerat-sonarsource david-cho-lerat-sonarsource merged commit a86b766 into main Mar 25, 2026
11 of 12 checks passed
@david-cho-lerat-sonarsource david-cho-lerat-sonarsource deleted the david/complete-compose-refs-patch branch March 25, 2026 09:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants