disallow all globals in Fluent v9 by spmonahan · Pull Request #30967 · microsoft/fluentui

spmonahan · 2024-04-04T18:29:34Z

Previous Behavior

Code could directly access globals like setTimeout and clearTimeout.

New Behavior

Code cannot directly access any globals (i.e., properties of window) and must get them from Fluent context (useFluent()).

Most of the code changes in this PR should probably use useAnimationFrame() and useTimeout() but I wanted to minimize change for this PR so I've created #30968 to follow up.

Related Issue(s)

Fixes Disallow access to all global objects for @fluentui/react-components #29964

fabricteam · 2024-04-04T18:41:31Z

Perf Analysis (`@fluentui/react-components`)

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
FluentProviderWithTheme	mount	85	80	10	Possible regression
FluentProviderWithTheme	virtual-rerender	37	32	10	Possible regression

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	627	611	5000
Button	mount	305	301	5000
Field	mount	1107	1098	5000
FluentProvider	mount	712	700	5000
FluentProviderWithTheme	mount	85	80	10	Possible regression
FluentProviderWithTheme	virtual-rerender	37	32	10	Possible regression
FluentProviderWithTheme	virtual-rerender-with-unmount	74	75	10
MakeStyles	mount	874	853	50000
Persona	mount	1767	1682	5000
SpinButton	mount	1397	1350	5000
SwatchPicker	mount	1528	1532	5000

codesandbox-ci · 2024-04-04T18:42:49Z

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.

fabricteam · 2024-04-04T18:46:44Z

Perf Analysis (`@fluentui/react-northstar`)

⚠️ 1 potential perf regressions detected

Potential regressions comparing to master

Scenario	Current PR Ticks	Baseline Ticks	Ratio	Regression Analysis
LoaderMinimalPerf.default	186	184	1.01:1	analysis

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
TreeWith60ListItems.default	105	85	1.24:1
FormMinimalPerf.default	235	207	1.14:1
AttachmentMinimalPerf.default	87	77	1.13:1
TextMinimalPerf.default	209	189	1.11:1
AttachmentSlotsPerf.default	645	605	1.07:1
ButtonOverridesMissPerf.default	681	635	1.07:1
HeaderMinimalPerf.default	212	198	1.07:1
ProviderMergeThemesPerf.default	683	641	1.07:1
BoxMinimalPerf.default	201	189	1.06:1
ButtonSlotsPerf.default	320	303	1.06:1
StatusMinimalPerf.default	400	379	1.06:1
CarouselMinimalPerf.default	279	266	1.05:1
ChatWithPopoverPerf.default	200	190	1.05:1
LabelMinimalPerf.default	214	203	1.05:1
TextAreaMinimalPerf.default	298	285	1.05:1
AlertMinimalPerf.default	164	157	1.04:1
DividerMinimalPerf.default	206	199	1.04:1
DropdownManyItemsPerf.default	398	384	1.04:1
FlexMinimalPerf.default	158	152	1.04:1
HeaderSlotsPerf.default	472	455	1.04:1
InputMinimalPerf.default	565	541	1.04:1
RefMinimalPerf.default	114	110	1.04:1
LayoutMinimalPerf.default	201	195	1.03:1
SplitButtonMinimalPerf.default	2308	2230	1.03:1
ToolbarMinimalPerf.default	548	531	1.03:1
TooltipMinimalPerf.default	1317	1273	1.03:1
AnimationMinimalPerf.default	302	297	1.02:1
ListCommonPerf.default	391	383	1.02:1
ListNestedPerf.default	317	310	1.02:1
MenuMinimalPerf.default	511	501	1.02:1
PortalMinimalPerf.default	85	83	1.02:1
ProviderMinimalPerf.default	209	204	1.02:1
CustomToolbarPrototype.default	1504	1472	1.02:1
CardMinimalPerf.default	304	301	1.01:1
CheckboxMinimalPerf.default	1149	1143	1.01:1
ListMinimalPerf.default	308	306	1.01:1
PopupMinimalPerf.default	350	347	1.01:1
RadioGroupMinimalPerf.default	264	261	1.01:1
ReactionMinimalPerf.default	215	213	1.01:1
SegmentMinimalPerf.default	193	192	1.01:1
IconMinimalPerf.default	393	388	1.01:1
TableMinimalPerf.default	234	232	1.01:1
AvatarMinimalPerf.default	109	109	1:1
EmbedMinimalPerf.default	1855	1852	1:1
SliderMinimalPerf.default	745	747	1:1
TableManyItemsPerf.default	1111	1106	1:1
VideoMinimalPerf.default	439	438	1:1
DatepickerMinimalPerf.default	3574	3613	0.99:1
DialogMinimalPerf.default	432	435	0.99:1
DropdownMinimalPerf.default	1421	1439	0.99:1
ItemLayoutMinimalPerf.default	703	712	0.99:1
MenuButtonMinimalPerf.default	945	959	0.99:1
TreeMinimalPerf.default	491	494	0.99:1
ChatMinimalPerf.default	430	440	0.98:1
ListWith60ListItems.default	366	373	0.98:1
ChatDuplicateMessagesPerf.default	149	154	0.97:1
RosterPerf.default	1552	1609	0.96:1
SkeletonMinimalPerf.default	192	201	0.96:1
GridMinimalPerf.default	188	197	0.95:1
ImageMinimalPerf.default	215	228	0.94:1
AccordionMinimalPerf.default	78	85	0.92:1
ButtonMinimalPerf.default	89	99	0.9:1

fabricteam · 2024-04-04T18:50:44Z

🕵 FluentUIV0 No visual regressions between this PR and main

fabricteam · 2024-04-04T18:53:01Z

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
`react-combobox` Combobox (including child components)	`100.367 kB` `33.145 kB`	`100.456 kB` `33.163 kB`	`89 B` `18 B`
`react-combobox` Dropdown (including child components)	`100.903 kB` `33.051 kB`	`101.089 kB` `33.112 kB`	`186 B` `61 B`
`react-components` react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	`212.554 kB` `61.198 kB`	`212.631 kB` `61.228 kB`	`77 B` `30 B`
`react-components` react-components: entire library	`1.091 MB` `269.622 kB`	`1.092 MB` `269.741 kB`	`290 B` `119 B`
`react-menu` Menu (including children components)	`151.944 kB` `45.952 kB`	`152.023 kB` `45.98 kB`	`79 B` `28 B`
`react-menu` Menu (including selectable components)	`154.63 kB` `46.45 kB`	`154.709 kB` `46.477 kB`	`79 B` `27 B`
`react-popover` Popover	`127.666 kB` `40.091 kB`	`127.766 kB` `40.096 kB`	`100 B` `5 B`
`react-spinbutton` SpinButton	`35.78 kB` `11.735 kB`	`36.047 kB` `11.833 kB`	`267 B` `98 B`
`react-spinner` Spinner	`25.134 kB` `8.521 kB`	`25.244 kB` `8.552 kB`	`110 B` `31 B`
`react-table` DataGrid	`162.821 kB` `46.323 kB`	`162.843 kB` `46.317 kB`	`22 B` `-6 B`
`react-tag-picker` @fluentui/react-tag-picker - package	`180.836 kB` `54.497 kB`	`181.024 kB` `54.556 kB`	`188 B` `59 B`
`react-timepicker-compat` TimePicker	`103.165 kB` `34.513 kB`	`103.248 kB` `34.54 kB`	`83 B` `27 B`
`react-toast` Toast (including Toaster)	`99.527 kB` `30.005 kB`	`99.625 kB` `30.033 kB`	`98 B` `28 B`
`react-tooltip` Tooltip	`54.459 kB` `19.185 kB`	`54.556 kB` `19.226 kB`	`97 B` `41 B`

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
`global-context` createContext	`510 B` `328 B`
`global-context` createContextSelector	`537 B` `339 B`
`keyboard-key` keyboard-key package	`3.746 kB` `1.928 kB`
`priority-overflow` createOverflowManager	`4.457 kB` `1.856 kB`
`react` ActivityItem	`71.019 kB` `23.288 kB`
`react` Announced	`38.291 kB` `13.239 kB`
`react` Autofill	`15.365 kB` `4.743 kB`
`react` Breadcrumb	`201.877 kB` `60.317 kB`
`react` Button	`195.341 kB` `56.521 kB`
`react` ButtonGrid	`180.288 kB` `54.565 kB`
`react` Calendar	`121.542 kB` `36.943 kB`
`react` Callout	`84.108 kB` `27.552 kB`
`react` Check	`52.963 kB` `17.773 kB`
`react` Checkbox	`59.751 kB` `19.806 kB`
`react` ChoiceGroup	`65.276 kB` `21.438 kB`
`react` ChoiceGroupOption	`58.531 kB` `19.309 kB`
`react` Coachmark	`92.937 kB` `29.356 kB`
`react` Color	`7.737 kB` `3.106 kB`
`react` ColorPicker	`132.985 kB` `41.502 kB`
`react` ComboBox	`251.642 kB` `72.135 kB`
`react` CommandBar	`202.91 kB` `60.025 kB`
`react` ContextualMenu	`154.87 kB` `48.119 kB`
`react` DatePicker	`183.939 kB` `56.079 kB`
`react` DateTimeUtilities	`5.244 kB` `1.849 kB`
`react` DetailsList	`229.317 kB` `65.63 kB`
`react` Dialog	`211.201 kB` `63.036 kB`
`react` Divider	`19.399 kB` `6.798 kB`
`react` DocumentCard	`216.886 kB` `64.32 kB`
`react` DragDrop	`8.343 kB` `2.724 kB`
`react` DraggableZone	`34.109 kB` `11.448 kB`
`react` Dropdown	`233.807 kB` `68.507 kB`
`react` ExtendedPicker	`96.565 kB` `27.809 kB`
`react` Fabric	`41.537 kB` `14.283 kB`
`react` Facepile	`210.458 kB` `63.087 kB`
`react` FloatingPicker	`241.932 kB` `68.878 kB`
`react` FocusTrapZone	`16.975 kB` `5.917 kB`
`react` FocusZone	`54.844 kB` `17.402 kB`
`react` Grid	`180.288 kB` `54.565 kB`
`react` GroupedList	`134.634 kB` `40.596 kB`
`react` GroupedListV2	`122.251 kB` `37.703 kB`
`react` HoverCard	`96.969 kB` `30.741 kB`
`react` Icon	`51.644 kB` `17.197 kB`
`react` Icons	`66.305 kB` `24.379 kB`
`react` Image	`46.701 kB` `15.646 kB`
`react` Keytip	`81.482 kB` `26.712 kB`
`react` KeytipData	`13.969 kB` `4.57 kB`
`react` KeytipLayer	`103.278 kB` `31.961 kB`
`react` Keytips	`106.046 kB` `32.966 kB`
`react` Label	`38.134 kB` `13.207 kB`
`react` Layer	`47.887 kB` `16.295 kB`
`react` Link	`39.488 kB` `13.614 kB`
`react` List	`39.176 kB` `12.384 kB`
`react` MarqueeSelection	`74.321 kB` `22.385 kB`
`react` MessageBar	`190.392 kB` `56.991 kB`
`react` Modal	`93.44 kB` `30.18 kB`
`react` Nav	`187.87 kB` `56.43 kB`
`react` OverflowSet	`33.191 kB` `11.252 kB`
`react` Overlay	`40.694 kB` `14.023 kB`
`react` Panel	`200.912 kB` `59.92 kB`
`react` Persona	`114.617 kB` `36.442 kB`
`react` PersonaCoin	`114.617 kB` `36.442 kB`
`react` PersonaPresence	`57.833 kB` `19.303 kB`
`react` Pickers	`293.618 kB` `82.223 kB`
`react` Pivot	`188.784 kB` `57.162 kB`
`react` Popup	`12.242 kB` `4.181 kB`
`react` Positioning	`22.608 kB` `7.63 kB`
`react` PositioningContainer	`73.643 kB` `23.706 kB`
`react` ProgressIndicator	`39.286 kB` `13.482 kB`
`react` Rating	`81.762 kB` `26.057 kB`
`react` Fluent UI React (entire library)	`1.013 MB` `281.343 kB`
`react` ResizeGroup	`13.286 kB` `4.365 kB`
`react` ResponsiveMode	`8.078 kB` `2.95 kB`
`react` ScrollablePane	`55.325 kB` `17.669 kB`
`react` SearchBox	`188.667 kB` `56.595 kB`
`react` SelectableOption	`724 B` `413 B`
`react` SelectedItemsList	`232.427 kB` `67.829 kB`
`react` Selection	`42.252 kB` `12.203 kB`
`react` Separator	`35.183 kB` `12.088 kB`
`react` Shimmer	`49.049 kB` `16.206 kB`
`react` ShimmeredDetailsList	`240.092 kB` `68.397 kB`
`react` Slider	`57.449 kB` `19.143 kB`
`react` SpinButton	`192.395 kB` `57.716 kB`
`react` Spinner	`41.481 kB` `14.412 kB`
`react` Stack	`41.547 kB` `14.233 kB`
`react` Sticky	`32.541 kB` `10.49 kB`
`react` Styling	`45.853 kB` `15.082 kB`
`react` SwatchColorPicker	`190.614 kB` `58.051 kB`
`react` TeachingBubble	`205.667 kB` `60.945 kB`
`react` Text	`36.723 kB` `12.763 kB`
`react` TextField	`80.555 kB` `25.262 kB`
`react` Theme	`43.321 kB` `14.129 kB`
`react` ThemeGenerator	`12.34 kB` `4.106 kB`
`react` TimePicker	`241.446 kB` `69.904 kB`
`react` Toggle	`46.02 kB` `15.903 kB`
`react` Tooltip	`87.136 kB` `28.164 kB`
`react` Utilities	`82.495 kB` `25.047 kB`
`react` Viewport	`23.703 kB` `7.589 kB`
`react` WeeklyDayPicker	`101.682 kB` `31.738 kB`
`react` WindowProvider	`1.059 kB` `541 B`
`react-accordion` Accordion (including children components)	`100.003 kB` `30.524 kB`
`react-alert` Alert	`78.817 kB` `22.543 kB`
`react-avatar` Avatar	`49.299 kB` `15.837 kB`
`react-avatar` AvatarGroup	`20.107 kB` `7.973 kB`
`react-avatar` AvatarGroupItem	`63.316 kB` `20.017 kB`
`react-badge` Badge	`25.95 kB` `8.612 kB`
`react-badge` CounterBadge	`26.729 kB` `8.886 kB`
`react-badge` PresenceBadge	`25.717 kB` `9.483 kB`
`react-breadcrumb` @fluentui/react-breadcrumb - package	`114.486 kB` `31.821 kB`
`react-button` Button	`37.103 kB` `10.784 kB`
`react-button` CompoundButton	`43.514 kB` `12.074 kB`
`react-button` MenuButton	`41.884 kB` `12.132 kB`
`react-button` SplitButton	`49.896 kB` `13.724 kB`
`react-button` ToggleButton	`53.03 kB` `12.543 kB`
`react-calendar-compat` Calendar Compat	`146.465 kB` `39.03 kB`
`react-card` Card - All	`101.184 kB` `29.049 kB`
`react-card` Card	`94.218 kB` `27.333 kB`
`react-card` CardFooter	`14.354 kB` `5.795 kB`
`react-card` CardHeader	`16.618 kB` `6.555 kB`
`react-card` CardPreview	`14.418 kB` `5.931 kB`
`react-checkbox` Checkbox	`35.103 kB` `12.11 kB`
`react-components` react-components: Button, FluentProvider & webLightTheme	`69.141 kB` `20.157 kB`
`react-components` react-components: FluentProvider & webLightTheme	`44.442 kB` `14.607 kB`
`react-datepicker-compat` DatePicker Compat	`220.038 kB` `62.373 kB`
`react-dialog` Dialog (including children components)	`98.817 kB` `29.825 kB`
`react-divider` Divider	`21.326 kB` `7.963 kB`
`react-field` Field	`23.382 kB` `8.901 kB`
`react-image` Image	`15.36 kB` `6.245 kB`
`react-input` Input	`27.985 kB` `9.444 kB`
`react-jsx-runtime` Classic Pragma	`1.057 kB` `530 B`
`react-jsx-runtime` JSX Dev Runtime	`3.781 kB` `1.646 kB`
`react-jsx-runtime` JSX Runtime	`4.377 kB` `1.881 kB`
`react-label` Label	`14.67 kB` `6 kB`
`react-link` Link	`17.191 kB` `6.991 kB`
`react-message-bar` MessageBar (all components)	`24.411 kB` `9.114 kB`
`react-northstar` Accordion	`85.392 kB` `26.518 kB`
`react-northstar` Alert	`87.45 kB` `26.902 kB`
`react-northstar` Animation	`55.34 kB` `17.829 kB`
`react-northstar` Attachment	`86.844 kB` `26.692 kB`
`react-northstar` Avatar	`80.279 kB` `24.629 kB`
`react-northstar` Box	`75.248 kB` `23.806 kB`
`react-northstar` Breadcrumb	`79.92 kB` `24.709 kB`
`react-northstar` Button	`83.16 kB` `25.947 kB`
`react-northstar` Card	`82.705 kB` `25.023 kB`
`react-northstar` Carousel	`105.182 kB` `31.871 kB`
`react-northstar` Chat	`152.378 kB` `45.964 kB`
`react-northstar` Checkbox	`79.807 kB` `25.078 kB`
`react-northstar` Datepicker	`184.939 kB` `56.194 kB`
`react-northstar` Debug	`8.801 kB` `3.594 kB`
`react-northstar` Design	`36.589 kB` `12.067 kB`
`react-northstar` Dialog	`112.058 kB` `33.615 kB`
`react-northstar` Divider	`76.619 kB` `24.129 kB`
`react-northstar` Dropdown	`196.499 kB` `59.455 kB`
`react-northstar` Embed	`81.477 kB` `25.417 kB`
`react-northstar` Flex	`47.728 kB` `15.438 kB`
`react-northstar` Form	`92.527 kB` `28.879 kB`
`react-northstar` Grid	`70.584 kB` `22.278 kB`
`react-northstar` Header	`74.756 kB` `23.461 kB`
`react-northstar` Image	`73.591 kB` `23.329 kB`
`react-northstar` Input	`88.346 kB` `27.78 kB`
`react-northstar` ItemLayout	`78.231 kB` `24.454 kB`
`react-northstar` Label	`77.92 kB` `24.41 kB`
`react-northstar` Layout	`75.393 kB` `23.798 kB`
`react-northstar` List	`88.493 kB` `27.547 kB`
`react-northstar` Loader	`78.616 kB` `24.729 kB`
`react-northstar` Menu	`126.89 kB` `39.872 kB`
`react-northstar` MenuButton	`161.296 kB` `48.883 kB`
`react-northstar` Pill	`83.722 kB` `26.069 kB`
`react-northstar` Popup	`133.604 kB` `41.483 kB`
`react-northstar` Portal	`58.338 kB` `18.852 kB`
`react-northstar` Provider	`93.138 kB` `29.63 kB`
`react-northstar` RadioGroup	`83.282 kB` `26.053 kB`
`react-northstar` Reaction	`77.28 kB` `24.122 kB`
`react-northstar` Segment	`76.209 kB` `23.892 kB`
`react-northstar` Skeleton	`77.765 kB` `24.2 kB`
`react-northstar` Slider	`84.27 kB` `26.737 kB`
`react-northstar` SplitButton	`176.534 kB` `52.63 kB`
`react-northstar` Status	`76.272 kB` `24.05 kB`
`react-northstar` SvgIcon	`36.823 kB` `11.743 kB`
`react-northstar` Table	`80.796 kB` `25.154 kB`
`react-northstar` Text	`74.114 kB` `23.507 kB`
`react-northstar` TextArea	`74.248 kB` `23.492 kB`
`react-northstar` Toolbar	`173.345 kB` `52.08 kB`
`react-northstar` Tooltip	`108.261 kB` `34.482 kB`
`react-northstar` Tree	`87.855 kB` `27.217 kB`
`react-northstar` Video	`75.411 kB` `23.799 kB`
`react-overflow` hooks only	`12.87 kB` `4.83 kB`
`react-persona` Persona	`56.19 kB` `17.726 kB`
`react-portal` Portal	`14.563 kB` `5.118 kB`
`react-portal-compat` PortalCompatProvider	`8.39 kB` `2.64 kB`
`react-positioning` usePositioning	`26.489 kB` `9.552 kB`
`react-progress` ProgressBar	`17.084 kB` `6.904 kB`
`react-provider` FluentProvider	`24.616 kB` `8.903 kB`
`react-radio` Radio	`32.671 kB` `10.348 kB`
`react-radio` RadioGroup	`15.758 kB` `6.431 kB`
`react-select` Select	`27.636 kB` `10.106 kB`
`react-slider` Slider	`37.195 kB` `12.559 kB`
`react-swatch-picker` @fluentui/react-swatch-picker - package	`104.378 kB` `30.355 kB`
`react-switch` Switch	`35.299 kB` `11.345 kB`
`react-table` Table (Primitives only)	`42.48 kB` `13.866 kB`
`react-table` Table as DataGrid	`131.934 kB` `36.682 kB`
`react-table` Table (Selection only)	`70.334 kB` `20.026 kB`
`react-table` Table (Sort only)	`68.977 kB` `19.63 kB`
`react-tags` InteractionTag	`15.165 kB` `6.134 kB`
`react-tags` Tag	`28.994 kB` `9.518 kB`
`react-tags` TagGroup	`82.911 kB` `24.642 kB`
`react-text` Text - Default	`17.061 kB` `6.731 kB`
`react-text` Text - Wrappers	`20.233 kB` `7.061 kB`
`react-textarea` Textarea	`26.519 kB` `9.739 kB`
`react-theme` Single theme token import	`69 B` `89 B`
`react-theme` Teams: all themes	`35.666 kB` `7.453 kB`
`react-theme` Teams: Light theme	`19.642 kB` `5.549 kB`
`react-utilities` SSRProvider	`180 B` `160 B`

_{🤖 This report was generated against 4833b3e243cbe0160935af0afb610976d2a64cdd}

fabricteam · 2024-04-04T18:57:15Z

Perf Analysis (`@fluentui/react`)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations
BaseButton	mount	630	629	5000
Breadcrumb	mount	1659	1693	1000
Checkbox	mount	1709	1703	5000
CheckboxBase	mount	1482	1488	5000
ChoiceGroup	mount	3007	2955	5000
ComboBox	mount	690	667	1000
CommandBar	mount	6439	6364	1000
ContextualMenu	mount	11429	11645	1000
DefaultButton	mount	795	797	5000
DetailsRow	mount	2122	2268	5000
DetailsRowFast	mount	2215	2212	5000
DetailsRowNoStyles	mount	2037	2067	5000
Dialog	mount	2657	2660	1000
DocumentCardTitle	mount	219	231	1000
Dropdown	mount	2024	1967	5000
FocusTrapZone	mount	1146	1133	5000
FocusZone	mount	1083	1094	5000
GroupedList	mount	41357	41771	2
GroupedList	virtual-rerender	18147	20127	2
GroupedList	virtual-rerender-with-unmount	51051	56161	2
GroupedListV2	mount	234	228	2
GroupedListV2	virtual-rerender	214	215	2
GroupedListV2	virtual-rerender-with-unmount	234	245	2
IconButton	mount	1117	1138	5000
Label	mount	346	339	5000
Layer	mount	2773	2768	5000
Link	mount	407	406	5000
MenuButton	mount	993	1001	5000
MessageBar	mount	21336	21380	5000
Nav	mount	2041	2036	1000
OverflowSet	mount	787	800	5000
Panel	mount	1809	1777	1000
Persona	mount	767	762	1000
Pivot	mount	915	898	1000
PrimaryButton	mount	910	929	5000
Rating	mount	4699	4647	5000
SearchBox	mount	932	930	5000
Shimmer	mount	1921	1896	5000
Slider	mount	1351	1325	5000
SpinButton	mount	2948	2968	5000
Spinner	mount	381	385	5000
SplitButton	mount	1907	1850	5000
Stack	mount	410	410	5000
StackWithIntrinsicChildren	mount	857	857	5000
StackWithTextChildren	mount	2643	2682	5000
SwatchColorPicker	mount	6435	6309	5000
TagPicker	mount	1522	1482	5000
Text	mount	374	377	5000
TextField	mount	969	978	5000
ThemeProvider	mount	853	838	5000
ThemeProvider	virtual-rerender	588	593	5000
ThemeProvider	virtual-rerender-with-unmount	1284	1311	5000
Toggle	mount	590	635	5000
buttonNative	mount	201	189	5000

packages/react-components/react-toast/src/components/AriaLive/useAriaLive.ts

packages/eslint-plugin/src/configs/restricted-globals.js

packages/react-components/react-virtualizer/src/components/Virtualizer/useVirtualizer.ts

change/@fluentui-eslint-plugin-ea97d70f-085e-47bb-a6ac-6faba3f09cfc.json

packages/react-components/priority-overflow/src/createResizeObserver.ts

packages/react-components/react-icons-compat/src/icon.ts

packages/react-components/react-utilities/src/hooks/useTimeout.ts

change/@fluentui-eslint-plugin-ea97d70f-085e-47bb-a6ac-6faba3f09cfc.json

This allows scrollIntoView to reference the correct window when calling "getComputedStyle()".

change/@fluentui-eslint-plugin-ea97d70f-085e-47bb-a6ac-6faba3f09cfc.json

packages/react-components/react-aria/src/activedescendant/scrollIntoView.ts

* master: (49 commits) Update focus order in sankey chart for vertical navigation (microsoft#31469) chore: use new performant 'type-check' for v9 libaries (microsoft#31454) applying package updates fix(Timepicker-compat): clearIcon not working in freeform (microsoft#31324) chore: re-enable lint rule (microsoft#31459) feat(react-tag-picker): adds text property to TagPickerOption (microsoft#31474) feat(recipes): create package with initial implementation (moved from /apps) (microsoft#31386) applying package updates applying package updates chore: revert globals changes (microsoft#31470) (web-components) Use `ElementInternals` for TextInput elements (microsoft#31201) chore:(docs) Update and migrate component implementation guide (microsoft#31398) disallow all globals in Fluent v9 (microsoft#30967) chore:(react-nav-preview) Recomposing more components and some pixel pushing (microsoft#31387) fix(pr-deploy-site): explicitly set types to not include whole @types/* globals which are causing issues with addition of @types/web (microsoft#31465) fix(recipes-react-components): explicitly set types to not include whole @types/* globals which are cauising issues with addition of @types/web (microsoft#31463) applying package updates applying package updates applying package updates Update IconDirectionContextProvider import to import from specific path (microsoft#31006) ...

spmonahan requested review from a team, Mitch-At-Work and tomi-msft as code owners April 4, 2024 18:29

github-actions bot added this to the April Project Cycle Q1 2024 milestone Apr 4, 2024

spmonahan mentioned this pull request Apr 4, 2024

Use useTimeout() and useAnimationFrame() rather than globals. #30968

Closed

15 tasks

khmakoto approved these changes Apr 4, 2024

View reviewed changes

Hotell reviewed Apr 5, 2024

View reviewed changes

packages/react-components/react-toast/src/components/AriaLive/useAriaLive.ts Outdated Show resolved Hide resolved

Hotell reviewed Apr 5, 2024

View reviewed changes

packages/eslint-plugin/src/configs/restricted-globals.js Outdated Show resolved Hide resolved

spmonahan force-pushed the chore/disallow-globals branch from bc07a69 to 3c2baf4 Compare April 17, 2024 23:36

spmonahan commented Apr 19, 2024

View reviewed changes

packages/react-components/react-virtualizer/src/components/Virtualizer/useVirtualizer.ts Outdated Show resolved Hide resolved

spmonahan commented Apr 19, 2024

View reviewed changes

packages/react-components/react-virtualizer/src/components/Virtualizer/useVirtualizer.ts Outdated Show resolved Hide resolved

spmonahan mentioned this pull request May 6, 2024

[Feature]: Exclude Typescript types from no-restricted-globals eslint rule #31286

Closed

1 task

spmonahan force-pushed the chore/disallow-globals branch from 222c36a to 0e46844 Compare May 6, 2024 21:32

spmonahan requested review from Hotell and khmakoto May 6, 2024 23:48

spmonahan force-pushed the chore/disallow-globals branch from fa0e312 to 4fe758c Compare May 9, 2024 21:08

spmonahan commented May 10, 2024

View reviewed changes

change/@fluentui-eslint-plugin-ea97d70f-085e-47bb-a6ac-6faba3f09cfc.json Show resolved Hide resolved

Hotell reviewed May 15, 2024

View reviewed changes

packages/react-components/priority-overflow/src/createResizeObserver.ts Outdated Show resolved Hide resolved

packages/react-components/react-icons-compat/src/icon.ts Show resolved Hide resolved

packages/react-components/react-utilities/src/hooks/useTimeout.ts Outdated Show resolved Hide resolved

fabricteam reviewed May 15, 2024

View reviewed changes

change/@fluentui-eslint-plugin-ea97d70f-085e-47bb-a6ac-6faba3f09cfc.json Show resolved Hide resolved

spmonahan requested a review from Hotell May 17, 2024 18:03

khmakoto approved these changes May 17, 2024

View reviewed changes

spmonahan added 16 commits May 22, 2024 13:38

correct change files

c7cd9c1

fix rebase conflicts

c658164

use culled globals list

345f5b2

fix lint in react-tabster

1d59831

change file

6127be5

fix: update scrollIntoView to accept option "window" argument

e6795fd

This allows scrollIntoView to reference the correct window when calling "getComputedStyle()".

change files

d16b70a

fix useCallback deps

6a81041

fix lint errors

57dfce9

fix ssr

6b1df12

use MutationObserver from global context

43af8c3

change file

1cadc27

pr feedback

5a8f837

fix order on lint exception

e8a591c

fix useEffect deps

b64236c

improve typing

6253fe4

spmonahan force-pushed the chore/disallow-globals branch from 545ac96 to 6253fe4 Compare May 22, 2024 20:40

spmonahan enabled auto-merge (squash) May 22, 2024 20:41

fabricteam reviewed May 22, 2024

View reviewed changes

change/@fluentui-eslint-plugin-ea97d70f-085e-47bb-a6ac-6faba3f09cfc.json Show resolved Hide resolved

fabricteam reviewed May 22, 2024

View reviewed changes

change/@fluentui-eslint-plugin-ea97d70f-085e-47bb-a6ac-6faba3f09cfc.json Show resolved Hide resolved

Mitch-At-Work approved these changes May 22, 2024

View reviewed changes

layershifter reviewed May 23, 2024

View reviewed changes

packages/react-components/react-aria/src/activedescendant/scrollIntoView.ts Show resolved Hide resolved

layershifter reviewed May 23, 2024

View reviewed changes

packages/react-components/react-aria/src/activedescendant/scrollIntoView.ts Show resolved Hide resolved

layershifter approved these changes May 23, 2024

View reviewed changes

spmonahan mentioned this pull request May 23, 2024

chore: update eslint to disallow globals microsoft/fluentui-contrib#181

Merged

spmonahan merged commit a9defa9 into microsoft:master May 23, 2024

spmonahan deleted the chore/disallow-globals branch May 23, 2024 19:35

spmonahan mentioned this pull request May 23, 2024

chore: revert globals changes #31470

Merged

miroslavstastny pushed a commit to miroslavstastny/fluentui that referenced this pull request Jun 14, 2024

disallow all globals in Fluent v9 (microsoft#30967)

8b28f52

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

disallow all globals in Fluent v9#30967

disallow all globals in Fluent v9#30967
spmonahan merged 25 commits intomicrosoft:masterfrom
spmonahan:chore/disallow-globals

spmonahan commented Apr 4, 2024 •

edited

Loading

Uh oh!

fabricteam commented Apr 4, 2024 •

edited

Loading

Uh oh!

codesandbox-ci bot commented Apr 4, 2024 •

edited

Loading

Uh oh!

fabricteam commented Apr 4, 2024 •

edited

Loading

Uh oh!

fabricteam commented Apr 4, 2024 •

edited

Loading

Uh oh!

fabricteam commented Apr 4, 2024 •

edited

Loading

Uh oh!

fabricteam commented Apr 4, 2024 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

Conversation

spmonahan commented Apr 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Previous Behavior

New Behavior

Related Issue(s)

Uh oh!

fabricteam commented Apr 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Perf Analysis (@fluentui/react-components)

Uh oh!

codesandbox-ci bot commented Apr 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

fabricteam commented Apr 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Perf Analysis (@fluentui/react-northstar)

Potential regressions comparing to master

Uh oh!

fabricteam commented Apr 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🕵 FluentUIV0 No visual regressions between this PR and main

Uh oh!

fabricteam commented Apr 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📊 Bundle size report

Uh oh!

fabricteam commented Apr 4, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Perf Analysis (@fluentui/react)

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

spmonahan commented Apr 4, 2024 •

edited

Loading

fabricteam commented Apr 4, 2024 •

edited

Loading

Perf Analysis (`@fluentui/react-components`)

codesandbox-ci bot commented Apr 4, 2024 •

edited

Loading

fabricteam commented Apr 4, 2024 •

edited

Loading

Perf Analysis (`@fluentui/react-northstar`)

fabricteam commented Apr 4, 2024 •

edited

Loading

fabricteam commented Apr 4, 2024 •

edited

Loading

fabricteam commented Apr 4, 2024 •

edited

Loading

Perf Analysis (`@fluentui/react`)