Skip to content

Conversation

@YuanboXue-Amber
Copy link
Contributor

@YuanboXue-Amber YuanboXue-Amber commented Oct 5, 2023

Revert #29062

Why revert:
When moving focus, browser can trigger scroll event and causing unwanted popover close.
In this example https://codesandbox.io/s/nervous-bush-j9qkzw?file=/example.tsx, when Tabbing to the popover trigger, popover opens. And then tab again closes the popover, while the expected behavior is popover stays open.

Real life case where it can happen:
When there is a long message that takes up the entire height of the message pane, opening the popover on the message can cause scroll.

@YuanboXue-Amber YuanboXue-Amber requested a review from a team as a code owner October 5, 2023 13:45
@fabricteam
Copy link
Collaborator

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 648 598 5000
Button mount 317 321 5000
Field mount 1099 1146 5000
FluentProvider mount 715 698 5000
FluentProviderWithTheme mount 75 77 10
FluentProviderWithTheme virtual-rerender 65 67 10
FluentProviderWithTheme virtual-rerender-with-unmount 74 75 10
InfoButton mount 16 11 5000
MakeStyles mount 875 886 50000
Persona mount 1745 1713 5000
SpinButton mount 1328 1359 5000

@codesandbox-ci
Copy link

codesandbox-ci bot commented Oct 5, 2023

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit ecf2bcc:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration
clever-proskuriakova-tfg646 PR

@fabricteam
Copy link
Collaborator

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
206.475 kB
59.3 kB
206.386 kB
59.287 kB
-89 B
-13 B
react-datepicker-compat
DatePicker Compat
210.724 kB
58.718 kB
210.635 kB
58.707 kB
-89 B
-11 B
react-infobutton
InfoButton
129.084 kB
40.659 kB
128.995 kB
40.643 kB
-89 B
-16 B
react-infobutton
InfoLabel
132.775 kB
41.83 kB
132.686 kB
41.816 kB
-89 B
-14 B
react-menu
Menu (including children components)
138.99 kB
42.935 kB
138.901 kB
42.923 kB
-89 B
-12 B
react-menu
Menu (including selectable components)
141.676 kB
43.45 kB
141.587 kB
43.437 kB
-89 B
-13 B
react-popover
Popover
117.83 kB
37.177 kB
117.741 kB
37.161 kB
-89 B
-16 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
global-context
createContext
510 B
330 B
global-context
createContextSelector
537 B
342 B
react-accordion
Accordion (including children components)
91.684 kB
28.007 kB
react-alert
Alert
83.172 kB
23.078 kB
react-avatar
Avatar
49.185 kB
15.491 kB
react-avatar
AvatarGroup
18.716 kB
7.458 kB
react-avatar
AvatarGroupItem
63.841 kB
19.834 kB
react-badge
Badge
25.921 kB
8.354 kB
react-badge
CounterBadge
26.822 kB
8.657 kB
react-badge
PresenceBadge
24.327 kB
8.867 kB
react-button
Button
38.892 kB
10.882 kB
react-button
CompoundButton
46.247 kB
12.375 kB
react-button
MenuButton
43.666 kB
12.26 kB
react-button
SplitButton
51.68 kB
13.845 kB
react-button
ToggleButton
55.938 kB
12.783 kB
react-card
Card - All
91.484 kB
26.485 kB
react-card
Card
86.31 kB
24.946 kB
react-card
CardFooter
12.074 kB
5.034 kB
react-card
CardHeader
14.323 kB
5.8 kB
react-card
CardPreview
13.031 kB
5.404 kB
react-checkbox
Checkbox
35.959 kB
11.852 kB
react-combobox
Combobox (including child components)
90.288 kB
29.491 kB
react-combobox
Dropdown (including child components)
88.728 kB
29.134 kB
react-components
react-components: Button, FluentProvider & webLightTheme
68.748 kB
19.742 kB
react-components
react-components: FluentProvider & webLightTheme
40.866 kB
13.546 kB
react-dialog
Dialog (including children components)
88.302 kB
26.325 kB
react-divider
Divider
19.836 kB
7.392 kB
react-field
Field
21.443 kB
8.194 kB
react-image
Image
14.752 kB
5.875 kB
react-input
Input
25.97 kB
8.77 kB
react-jsx-runtime
Classic Pragma
1.049 kB
531 B
react-jsx-runtime
JSX Dev Runtime
2.874 kB
1.307 kB
react-jsx-runtime
JSX Runtime
3.46 kB
1.542 kB
react-label
Label
13.159 kB
5.416 kB
react-link
Link
16.051 kB
6.52 kB
react-overflow
hooks only
12.419 kB
4.687 kB
react-persona
Persona
56.076 kB
17.369 kB
react-portal
Portal
12.255 kB
4.504 kB
react-portal-compat
PortalCompatProvider
6.503 kB
2.22 kB
react-positioning
usePositioning
25.305 kB
9.162 kB
react-progress
ProgressBar
16.448 kB
6.545 kB
react-provider
FluentProvider
21.411 kB
7.972 kB
react-radio
Radio
29.72 kB
9.802 kB
react-radio
RadioGroup
14.355 kB
5.913 kB
react-select
Select
27.692 kB
9.849 kB
react-slider
Slider
36.87 kB
12.141 kB
react-spinbutton
SpinButton
35.857 kB
11.426 kB
react-spinner
Spinner
22.412 kB
8.118 kB
react-switch
Switch
32.179 kB
10.437 kB
react-table
DataGrid
155.964 kB
43.469 kB
react-table
Table (Primitives only)
42.788 kB
13.359 kB
react-table
Table as DataGrid
129.257 kB
34.79 kB
react-table
Table (Selection only)
74.624 kB
20.096 kB
react-table
Table (Sort only)
73.231 kB
19.694 kB
react-tags
InteractionTag
14.342 kB
5.736 kB
react-tags
Tag
29.065 kB
9.081 kB
react-tags
TagGroup
72.581 kB
21.631 kB
react-text
Text - Default
15.766 kB
6.23 kB
react-text
Text - Wrappers
18.944 kB
6.551 kB
react-textarea
Textarea
30.03 kB
10.129 kB
react-toast
Toast (including Toaster)
91.201 kB
27.314 kB
react-tooltip
Tooltip
51.027 kB
18.012 kB
react-utilities
SSRProvider
180 B
159 B
🤖 This report was generated against 4a4ed602a0cf68ab3bb78ba24eb02619d639bc67

@size-auditor
Copy link

size-auditor bot commented Oct 5, 2023

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: 118c00164b2397b764e9e3d8d01b459df1fcfd29 (build)

@fabricteam
Copy link
Collaborator

🕵 fluentuiv9 No visual regressions between this PR and main

@YuanboXue-Amber YuanboXue-Amber enabled auto-merge (squash) October 5, 2023 14:33
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.

4 participants