Skip to content

Comments

fix: focusAsync still works even if past animationFrame fails to run#29322

Merged
smhigley merged 3 commits intomicrosoft:masterfrom
smhigley:focusasync-repeat-fix
Sep 28, 2023
Merged

fix: focusAsync still works even if past animationFrame fails to run#29322
smhigley merged 3 commits intomicrosoft:masterfrom
smhigley:focusasync-repeat-fix

Conversation

@smhigley
Copy link
Contributor

This came up while helping a partner debug why focus wasn't entering ContextualMenu after closing & re-opening an email window. It turns out that the current implementation of focusAsync fails to call focus if a previous call of focusAsync set targetToFocusOnNextRepaint but didn't run win.requestAnimationFrame (e.g. because the window closed).

By saving the requestAnimationFrame and cancelling prior ids on subsequent same-animation-frame calls, we can ensure that a past not-run focusAsync does not prevent future focus calls.

@codesandbox-ci
Copy link

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 f6c48f8:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@fabricteam
Copy link
Collaborator

📊 Bundle size report

🤖 This report was generated against 8dd29fff580dac6fe127b2f23ebd4bd6ed1f46f9

@size-auditor
Copy link

size-auditor bot commented Sep 28, 2023

Asset size changes

Project Bundle Baseline Size New Size Difference
office-ui-fabric-react fluentui-react-Keytips 101.17 kB 101.186 kB ExceedsBaseline     16 bytes
office-ui-fabric-react fluentui-react-Keytip 76.941 kB 76.957 kB ExceedsBaseline     16 bytes
office-ui-fabric-react fluentui-react-Callout 79.192 kB 79.208 kB ExceedsBaseline     16 bytes
office-ui-fabric-react fluentui-react-FocusTrapZone 15.627 kB 15.643 kB ExceedsBaseline     16 bytes
office-ui-fabric-react fluentui-react-SelectedItemsList 224.182 kB 224.196 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Persona 109.926 kB 109.94 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-TeachingBubble 197.678 kB 197.692 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Dropdown 224.836 kB 224.85 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Pickers 284.886 kB 284.9 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Facepile 203.538 kB 203.552 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-FloatingPicker 233.776 kB 233.79 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-PersonaCoin 109.926 kB 109.94 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Grid 173.664 kB 173.678 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-HoverCard 92.164 kB 92.178 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-TimePicker 232.601 kB 232.615 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-MessageBar 182.353 kB 182.367 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-SearchBox 180.728 kB 180.742 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Panel 192.102 kB 192.116 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Tooltip 82.446 kB 82.46 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Utilities 71.563 kB 71.577 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-KeytipLayer 98.418 kB 98.432 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-OverflowSet 30.777 kB 30.791 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Nav 181.012 kB 181.026 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-SwatchColorPicker 183.633 kB 183.647 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-DocumentCard 208.628 kB 208.642 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Pivot 181.998 kB 182.012 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-ColorPicker 127.834 kB 127.848 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Breadcrumb 193.626 kB 193.64 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Button 187.919 kB 187.933 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-ButtonGrid 173.664 kB 173.678 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Calendar 118.609 kB 118.623 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Dialog 202.59 kB 202.604 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Coachmark 88.666 kB 88.68 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-PositioningContainer 69.875 kB 69.889 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-SpinButton 184.407 kB 184.421 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-ComboBox 242.379 kB 242.393 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-CommandBar 194.738 kB 194.752 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-ContextualMenu 148.361 kB 148.375 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-DatePicker 178.298 kB 178.312 kB ExceedsBaseline     14 bytes
office-ui-fabric-react fluentui-react-Modal 89.871 kB 89.885 kB ExceedsBaseline     14 bytes

ExceedsTolerance Over Tolerance (1024 B) ExceedsBaseline Over Baseline BelowBaseline Below Baseline New New Deleted  Removed 1 kB = 1000 B

Baseline commit: 8dd29fff580dac6fe127b2f23ebd4bd6ed1f46f9 (build)

@fabricteam
Copy link
Collaborator

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 637 674 5000
Breadcrumb mount 1729 1763 1000
Checkbox mount 1713 1693 5000
CheckboxBase mount 1511 1469 5000
ChoiceGroup mount 2938 2931 5000
ComboBox mount 650 666 1000
CommandBar mount 6430 6517 1000
ContextualMenu mount 16159 16526 1000
DefaultButton mount 738 755 5000
DetailsRow mount 2231 2207 5000
DetailsRowFast mount 2173 2250 5000
DetailsRowNoStyles mount 2065 2049 5000
Dialog mount 2657 2766 1000
DocumentCardTitle mount 232 246 1000
Dropdown mount 2005 1987 5000
FocusTrapZone mount 1092 1161 5000
FocusZone mount 1087 1078 5000
GroupedList mount 42300 42398 2
GroupedList virtual-rerender 20149 20354 2
GroupedList virtual-rerender-with-unmount 53093 52000 2
GroupedListV2 mount 232 231 2
GroupedListV2 virtual-rerender 215 220 2
GroupedListV2 virtual-rerender-with-unmount 238 241 2
IconButton mount 1082 1062 5000
Label mount 340 344 5000
Layer mount 2796 2770 5000
Link mount 408 392 5000
MenuButton mount 938 953 5000
MessageBar mount 21647 21804 5000
Nav mount 1951 1956 1000
OverflowSet mount 788 787 5000
Panel mount 2073 1782 1000
Persona mount 732 735 1000
Pivot mount 852 847 1000
PrimaryButton mount 849 856 5000
Rating mount 4615 4644 5000
SearchBox mount 899 914 5000
Shimmer mount 1897 1900 5000
Slider mount 1360 1321 5000
SpinButton mount 2950 2838 5000
Spinner mount 395 390 5000
SplitButton mount 1824 1826 5000
Stack mount 417 416 5000
StackWithIntrinsicChildren mount 842 877 5000
StackWithTextChildren mount 2644 2650 5000
SwatchColorPicker mount 6164 6234 5000
TagPicker mount 1512 1541 5000
Text mount 365 391 5000
TextField mount 942 957 5000
ThemeProvider mount 840 853 5000
ThemeProvider virtual-rerender 596 583 5000
ThemeProvider virtual-rerender-with-unmount 1283 1284 5000
Toggle mount 619 616 5000
buttonNative mount 191 199 5000

@smhigley smhigley merged commit d701af3 into microsoft:master Sep 28, 2023
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.

3 participants