Skip to content

fix(react-motion): add MotionRefForwarderReset to prevent context leaking#35807

Merged
layershifter merged 2 commits intomicrosoft:masterfrom
layershifter:fix/motion-ref-forwarder-reset
Mar 2, 2026
Merged

fix(react-motion): add MotionRefForwarderReset to prevent context leaking#35807
layershifter merged 2 commits intomicrosoft:masterfrom
layershifter:fix/motion-ref-forwarder-reset

Conversation

@layershifter
Copy link
Member

Summary

Test plan

  • Unit tests for MotionRefForwarderReset added (resets context, doesn't affect siblings)
  • Verify with repro: Dialog + MessageBar that unmounts after 2s → dialog should still close

🤖 Generated with Claude Code

layershifter and others added 2 commits March 2, 2026 20:10
…king

The shared MotionRefForwarderContext can leak through component boundaries,
causing descendant components (e.g. MessageBar inside Dialog) to read and
nullify the parent's motion ref on unmount, breaking exit animations.

MotionRefForwarderReset resets the context to `undefined` for its children.
Applied in renderDialogSurface to isolate Dialog's user content.

Closes microsoft#35805

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@github-actions
Copy link

github-actions bot commented Mar 2, 2026

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-components
react-components: entire library
1.291 MB
323.011 kB
1.292 MB
323.045 kB
126 B
34 B
react-menu
Menu (including selectable components)
173.408 kB
52.465 kB
173.408 kB
52.464 kB

-1 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-accordion
Accordion (including children components)
103.471 kB
31.341 kB
react-avatar
Avatar
48.27 kB
15.312 kB
react-avatar
AvatarGroup
17.45 kB
6.995 kB
react-avatar
AvatarGroupItem
61.511 kB
19.296 kB
react-breadcrumb
@fluentui/react-breadcrumb - package
114.911 kB
31.405 kB
react-charts
AreaChart
412.28 kB
126.425 kB
react-charts
DeclarativeChart
762.108 kB
220.192 kB
react-charts
DonutChart
322.715 kB
96.946 kB
react-charts
FunnelChart
314.268 kB
93.991 kB
react-charts
GanttChart
395.399 kB
119.927 kB
react-charts
GaugeChart
322.146 kB
96.373 kB
react-charts
GroupedVerticalBarChart
403.269 kB
122.494 kB
react-charts
HeatMapChart
397.47 kB
121.788 kB
react-charts
HorizontalBarChart
302.442 kB
89.116 kB
react-charts
HorizontalBarChartWithAxis
63 B
83 B
react-charts
Legends
242.388 kB
71.585 kB
react-charts
LineChart
422.844 kB
128.284 kB
react-charts
PolarChart
351.333 kB
107.364 kB
react-charts
SankeyChart
220.381 kB
67.866 kB
react-charts
ScatterChart
402.671 kB
122.473 kB
react-charts
Sparkline
91.393 kB
28.708 kB
react-charts
VerticalBarChart
439.74 kB
128.215 kB
react-charts
VerticalStackedBarChart
409.183 kB
123.955 kB
react-components
react-components: Button, FluentProvider & webLightTheme
70.397 kB
19.96 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
236.537 kB
68.697 kB
react-components
react-components: FluentProvider & webLightTheme
43.612 kB
14.022 kB
react-datepicker-compat
DatePicker Compat
225.061 kB
63.608 kB
react-dialog
Dialog (including children components)
102.12 kB
30.394 kB
react-menu
Menu (including children components)
170.23 kB
51.882 kB
react-message-bar
MessageBar (all components)
23.37 kB
8.615 kB
react-motion
@fluentui/react-motion - createMotionComponent()
4.156 kB
1.818 kB
react-motion
@fluentui/react-motion - createPresenceComponent()
5.908 kB
2.442 kB
react-motion
@fluentui/react-motion - PresenceGroup
1.727 kB
823 B
react-overflow
hooks only
12.117 kB
4.627 kB
react-persona
Persona
55.225 kB
17.245 kB
react-popover
Popover
133.719 kB
41.451 kB
react-portal-compat
PortalCompatProvider
8.386 kB
2.624 kB
react-table
DataGrid
159.313 kB
44.939 kB
react-table
Table (Primitives only)
40.997 kB
13.172 kB
react-table
Table as DataGrid
130.528 kB
35.943 kB
react-table
Table (Selection only)
68.916 kB
19.309 kB
react-table
Table (Sort only)
67.559 kB
18.924 kB
react-tag-picker
@fluentui/react-tag-picker - package
186.596 kB
55.849 kB
react-tags
InteractionTag
13.666 kB
5.459 kB
react-tags
Tag
29.521 kB
9.389 kB
react-tags
TagGroup
82.211 kB
24.143 kB
react-teaching-popover
TeachingPopover
112.414 kB
34.219 kB
react-timepicker-compat
TimePicker
108.174 kB
35.695 kB
react-toast
Toast (including Toaster)
102.56 kB
30.608 kB
react-tree
FlatTree
147.635 kB
42.134 kB
react-tree
PersonaFlatTree
149.463 kB
42.517 kB
react-tree
PersonaTree
145.523 kB
41.338 kB
react-tree
Tree
143.701 kB
40.972 kB
🤖 This report was generated against f9a6d8435efa5aff110f335d10e2fc51656167ee

@github-actions
Copy link

github-actions bot commented Mar 2, 2026

Pull request demo site: URL

@layershifter layershifter enabled auto-merge (squash) March 2, 2026 19:43
@layershifter layershifter merged commit 015419b into microsoft:master Mar 2, 2026
11 of 12 checks passed
@layershifter layershifter deleted the fix/motion-ref-forwarder-reset branch March 3, 2026 09:20
* Render this in components that consume `useMotionForwardedRef()` and render
* arbitrary user content, to prevent the context from leaking to descendants.
*
* @internal
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why are we marking things with internal when they are public ?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Hotell good question. I didn't pay attention for this comment from Claude.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image

great 👍

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Dialog cannot be closed after a MessageBar inside it unmounts (shared MotionRefForwarder context collision)

3 participants