Skip to content

fix(react-menu): remove the tabster restorer source from MenuPopover#36314

Closed
layershifter wants to merge 1 commit into
microsoft:masterfrom
layershifter:chore/react-menu-remove-restorer-source
Closed

fix(react-menu): remove the tabster restorer source from MenuPopover#36314
layershifter wants to merge 1 commit into
microsoft:masterfrom
layershifter:chore/react-menu-remove-restorer-source

Conversation

@layershifter

Copy link
Copy Markdown
Member

Follow-up to #32840 and #36313.

Background

#32840 moved Menu away from the tabster Restorer API for focus restoration — it removed useRestoreFocusTarget from MenuTrigger and restores focus to the trigger manually instead, because "the restorer can cause unintended focus switching whenever other restore sources lose focus to body."

That PR intentionally kept the restorer source on MenuPopover"to make sure that users can still use Menu without a trigger easily."

Change

This removes the remaining useRestoreFocusSource() from MenuPopover, completing the move away from the tabster restorer for Menu:

Tradeoff

Per #32840's note, the restorer source was kept for triggerless Menu usage. With this change a triggerless menu no longer restores focus via tabster on close (focus is allowed to fall to <body>), consistent with #32840's stated preference: "allow lost focus to body in applications rather than unexpected focus switches."

Related

Follow-up to microsoft#32840, which moved Menu off the tabster Restorer (removed the
restore target from MenuTrigger, restores focus manually) but kept the restorer
source on MenuPopover for triggerless menus. This removes that remaining source,
completing the move away from the restorer (the source of the "unintended focus
switching" microsoft#32840 set out to avoid). Triggered menus are unaffected (manual
restore); triggerless menus allow focus to fall to <body> on close, per microsoft#32840.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@layershifter

Copy link
Copy Markdown
Member Author

Closing — the restorer source on MenuPopover is intentionally kept so Menu can be used without a trigger (per #32840), so removing it isn't desirable. The Escape/groupper issue is handled independently in #36313.

@github-actions

Copy link
Copy Markdown

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-charts
AreaChart
403.979 kB
125.912 kB
403.922 kB
125.879 kB
-57 B
-33 B
react-charts
DeclarativeChart
754.98 kB
220.248 kB
754.923 kB
220.261 kB
-57 B
13 B
react-charts
DonutChart
314.442 kB
96.656 kB
314.385 kB
96.606 kB
-57 B
-50 B
react-charts
FunnelChart
305.941 kB
93.468 kB
305.884 kB
93.424 kB
-57 B
-44 B
react-charts
GanttChart
387.079 kB
120.263 kB
387.022 kB
120.131 kB
-57 B
-132 B
react-charts
GaugeChart
313.82 kB
96.023 kB
313.763 kB
95.973 kB
-57 B
-50 B
react-charts
GroupedVerticalBarChart
394.95 kB
122.987 kB
394.893 kB
122.862 kB
-57 B
-125 B
react-charts
HeatMapChart
389.155 kB
121.302 kB
389.098 kB
121.264 kB
-57 B
-38 B
react-charts
HorizontalBarChart
294.114 kB
89.141 kB
294.057 kB
89.102 kB
-57 B
-39 B
react-charts
Legends
233.794 kB
69.977 kB
230.983 kB
69.12 kB
-2.811 kB
-857 B
react-charts
LineChart
415.309 kB
128.873 kB
415.252 kB
128.743 kB
-57 B
-130 B
react-charts
PolarChart
342.793 kB
106.526 kB
342.736 kB
106.414 kB
-57 B
-112 B
react-charts
ScatterChart
394.692 kB
122.992 kB
394.635 kB
122.847 kB
-57 B
-145 B
react-charts
VerticalBarChart
431.43 kB
127.922 kB
431.373 kB
127.877 kB
-57 B
-45 B
react-charts
VerticalStackedBarChart
401.154 kB
124.425 kB
401.097 kB
124.393 kB
-57 B
-32 B
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
226.19 kB
67.909 kB
226.133 kB
67.786 kB
-57 B
-123 B
react-components
react-components: entire library
1.296 MB
325.502 kB
1.296 MB
325.495 kB
-12 B
-7 B
react-menu
Menu (including children components)
159.755 kB
50.626 kB
156.944 kB
49.915 kB
-2.811 kB
-711 B
react-menu
Menu (including selectable components)
162.933 kB
51.253 kB
160.122 kB
50.501 kB
-2.811 kB
-752 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-avatar
Avatar
47.215 kB
14.859 kB
react-avatar
AvatarGroup
16.316 kB
6.528 kB
react-avatar
AvatarGroupItem
60.361 kB
18.763 kB
react-breadcrumb
@fluentui/react-breadcrumb - package
102.926 kB
28.76 kB
react-charts
HorizontalBarChartWithAxis
63 B
83 B
react-charts
SankeyChart
211.914 kB
67.836 kB
react-charts
Sparkline
80.503 kB
26.644 kB
react-components
react-components: Button, FluentProvider & webLightTheme
66.328 kB
19.02 kB
react-components
react-components: FluentProvider & webLightTheme
39.525 kB
13.113 kB
react-datepicker-compat
DatePicker Compat
216.429 kB
63.953 kB
react-dialog
Dialog (including children components)
90.204 kB
27.895 kB
react-headless-components-preview
react-headless-components-preview: entire library
236.785 kB
67.812 kB
react-overflow
hooks only
9.117 kB
3.241 kB
react-persona
Persona
54.17 kB
16.793 kB
react-popover
Popover
125.741 kB
40.448 kB
react-portal-compat
PortalCompatProvider
5.567 kB
2.237 kB
react-table
DataGrid
147.115 kB
43.628 kB
react-table
Table (Primitives only)
36.931 kB
12.324 kB
react-table
Table as DataGrid
118.7 kB
33.348 kB
react-table
Table (Selection only)
65.492 kB
18.622 kB
react-table
Table (Sort only)
64.135 kB
18.232 kB
react-tag-picker
@fluentui/react-tag-picker - package
174.152 kB
54.127 kB
react-tags
InteractionTag
12.464 kB
4.95 kB
react-tags
Tag
28.389 kB
8.911 kB
react-tags
TagGroup
69.754 kB
21.41 kB
react-teaching-popover
TeachingPopover
101.1 kB
31.859 kB
react-timepicker-compat
TimePicker
141.076 kB
46.036 kB
react-tree
FlatTree
135.901 kB
40.456 kB
react-tree
PersonaFlatTree
137.729 kB
40.969 kB
react-tree
PersonaTree
133.79 kB
39.742 kB
react-tree
Tree
131.968 kB
39.259 kB
🤖 This report was generated against f2b97d787b76fe84e2a18832f61b417b1e198aa8

@@ -0,0 +1,7 @@
{

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

🕵🏾‍♀️ visual changes to review in the Visual Change Report

vr-tests-react-components/Positioning 2 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/Positioning.Positioning end.chromium.png 53 Changed
vr-tests-react-components/Positioning.Positioning end.updated 2 times.chromium.png 23 Changed
vr-tests-react-components/ProgressBar converged 3 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/ProgressBar converged.Indeterminate + thickness - Dark Mode.default.chromium.png 25 Changed
vr-tests-react-components/ProgressBar converged.Indeterminate + thickness.default.chromium.png 80 Changed
vr-tests-react-components/ProgressBar converged.Indeterminate + thickness - High Contrast.default.chromium.png 138 Changed
vr-tests-react-components/TagPicker 3 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/TagPicker.disabled - High Contrast.disabled input hover.chromium.png 1319 Changed
vr-tests-react-components/TagPicker.disabled - RTL.chromium.png 635 Changed
vr-tests-react-components/TagPicker.disabled.disabled input hover.chromium.png 677 Changed

There were 3 duplicate changes discarded. Check the build logs for more information.

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.

1 participant