Skip to content

fix(react-popover): only close on focus escape when focus was inside …#36440

Open
petdud wants to merge 1 commit into
microsoft:masterfrom
petdud:fix/popover-close-on-focus-only-when-inside
Open

fix(react-popover): only close on focus escape when focus was inside …#36440
petdud wants to merge 1 commit into
microsoft:masterfrom
petdud:fix/popover-close-on-focus-only-when-inside

Conversation

@petdud

@petdud petdud commented Jul 23, 2026

Copy link
Copy Markdown
Contributor

…the surface

The focusin dismiss handler added for trapFocus popovers previously closed the popover on any focus landing outside the surface/trigger, even when focus had never entered the popover. This regressed consumers (e.g. Editor SDK's AutoCorrectCard / CritiqueCard) that intentionally keep focus on an external input via unstable_disableAutoFocus: a programmatic re-focus of that external element dismissed the popover mid-interaction.

Now the popover only dismisses on a genuine inside -> outside focus transition, preserving the original refocus bugfix while leaving popovers open when focus was never inside them.

Previous Behavior

New Behavior

Related Issue(s)

  • Fixes #

@petdud
petdud requested a review from a team as a code owner July 23, 2026 20:53
…the surface

The focusin dismiss handler added for trapFocus popovers previously closed
the popover on any focus landing outside the surface/trigger, even when focus
had never entered the popover. This regressed consumers (e.g. Editor SDK's
AutoCorrectCard / CritiqueCard) that intentionally keep focus on an external
input via unstable_disableAutoFocus: a programmatic re-focus of that external
element dismissed the popover mid-interaction.

Now the popover only dismisses on a genuine inside -> outside focus transition,
preserving the original refocus bugfix while leaving popovers open when focus
was never inside them.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Copilot-Session: 3f764f36-5770-4331-9c29-e96b9b4cf08c
@petdud
petdud force-pushed the fix/popover-close-on-focus-only-when-inside branch from 9583a54 to f47f34f Compare July 23, 2026 20:56
@github-actions

Copy link
Copy Markdown

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-charts
AreaChart
404.519 kB
126.522 kB
404.583 kB
126.545 kB
64 B
23 B
react-charts
DeclarativeChart
755.168 kB
221.613 kB
755.232 kB
221.63 kB
64 B
17 B
react-charts
DonutChart
315.29 kB
97.214 kB
315.354 kB
97.236 kB
64 B
22 B
react-charts
FunnelChart
306.531 kB
93.962 kB
306.595 kB
93.984 kB
64 B
22 B
react-charts
GanttChart
387.576 kB
120.935 kB
387.64 kB
120.957 kB
64 B
22 B
react-charts
GaugeChart
314.623 kB
96.603 kB
314.687 kB
96.637 kB
64 B
34 B
react-charts
GroupedVerticalBarChart
395.73 kB
123.761 kB
395.794 kB
123.797 kB
64 B
36 B
react-charts
HeatMapChart
389.684 kB
121.983 kB
389.748 kB
122.006 kB
64 B
23 B
react-charts
HorizontalBarChart
295.056 kB
89.803 kB
295.12 kB
89.83 kB
64 B
27 B
react-charts
LineChart
415.87 kB
129.657 kB
415.934 kB
129.682 kB
64 B
25 B
react-charts
PolarChart
343.543 kB
107.462 kB
343.607 kB
107.485 kB
64 B
23 B
react-charts
SankeyChart
212.213 kB
68.122 kB
212.277 kB
68.144 kB
64 B
22 B
react-charts
ScatterChart
395.196 kB
123.706 kB
395.26 kB
123.731 kB
64 B
25 B
react-charts
VerticalBarChart
432.128 kB
128.672 kB
432.192 kB
128.693 kB
64 B
21 B
react-charts
VerticalStackedBarChart
401.748 kB
125.166 kB
401.812 kB
125.18 kB
64 B
14 B
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
226.026 kB
68.049 kB
226.09 kB
68.071 kB
64 B
22 B
react-components
react-components: entire library
1.294 MB
326.152 kB
1.294 MB
326.173 kB
64 B
21 B
react-popover
Popover
125.502 kB
40.442 kB
125.566 kB
40.458 kB
64 B
16 B
react-teaching-popover
TeachingPopover
100.694 kB
31.811 kB
100.758 kB
31.829 kB
64 B
18 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-avatar
Avatar
47.22 kB
14.855 kB
react-avatar
AvatarGroup
16.254 kB
6.502 kB
react-avatar
AvatarGroupItem
60.339 kB
18.758 kB
react-charts
HorizontalBarChartWithAxis
63 B
83 B
react-charts
Legends
234.592 kB
70.52 kB
react-charts
Sparkline
80.888 kB
26.864 kB
react-components
react-components: Button, FluentProvider & webLightTheme
66.281 kB
19.002 kB
react-components
react-components: FluentProvider & webLightTheme
39.504 kB
13.112 kB
react-datepicker-compat
DatePicker Compat
216.224 kB
63.964 kB
react-dialog
Dialog (including children components)
89.951 kB
27.858 kB
react-headless-components-preview
react-headless-components-preview: entire library
247.572 kB
71.442 kB
react-persona
Persona
54.173 kB
16.791 kB
react-portal-compat
PortalCompatProvider
5.341 kB
2.146 kB
react-table
DataGrid
146.759 kB
43.576 kB
react-table
Table (Primitives only)
36.893 kB
12.305 kB
react-table
Table as DataGrid
118.503 kB
33.331 kB
react-table
Table (Selection only)
65.373 kB
18.591 kB
react-table
Table (Sort only)
64.036 kB
18.204 kB
react-tag-picker
@fluentui/react-tag-picker - package
174.01 kB
54.191 kB
react-tags
InteractionTag
12.463 kB
4.942 kB
react-tags
Tag
28.376 kB
8.9 kB
react-tags
TagGroup
69.648 kB
21.404 kB
react-timepicker-compat
TimePicker
140.867 kB
46.058 kB
react-tree
FlatTree
135.661 kB
40.459 kB
react-tree
PersonaFlatTree
137.524 kB
40.991 kB
react-tree
PersonaTree
133.605 kB
39.781 kB
react-tree
Tree
131.748 kB
39.265 kB
🤖 This report was generated against b7c503b1c637010d49e9b6f40c0b8de4968db204

@github-actions

Copy link
Copy Markdown

Pull request demo site: URL

@@ -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/Menu Converged - submenuIndicator slotted content 2 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/Menu Converged - submenuIndicator slotted content.default - RTL.submenus open.chromium.png 404 Changed
vr-tests-react-components/Menu Converged - submenuIndicator slotted content.default.submenus open.chromium.png 413 Changed
vr-tests-react-components/Positioning 2 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/Positioning.Positioning end.updated 2 times.chromium.png 507 Changed
vr-tests-react-components/Positioning.Positioning end.chromium.png 731 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 43 Changed
vr-tests-react-components/ProgressBar converged.Indeterminate + thickness - High Contrast.default.chromium.png 100 Changed
vr-tests-react-components/ProgressBar converged.Indeterminate + thickness.default.chromium.png 41 Changed
vr-tests-react-components/TagPicker 2 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/TagPicker.disabled - Dark Mode.disabled input hover.chromium.png 658 Changed
vr-tests-react-components/TagPicker.disabled - High Contrast.disabled input hover.chromium.png 1319 Changed

There were 2 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