fluentui icon indicating copy to clipboard operation
fluentui copied to clipboard
verified publisher icon microsoft

chore: migrate to jest 29

Open Hotell opened this issue 2 years ago • 9 comments

New Behavior

jest:

  • monorepo migrated to jest 29
  • snapshot format is kept in old format - as a followup we will migrate to the new format which is better than the old one
  • exposed improper jest.fn creation
  • exposed toMatchObject issues on test against DOM objects (jsdom related ?) / https://github.com/jestjs/jest/issues/14133

ts-jest:

  • configuration via globals is deprecated - v8 has been migrated in this PR / v9 will be migrated in separate PR

Blockers

  • [x] part of jest 29 is jsdom-upgrade https://jestjs.io/docs/upgrading-to-jest29#jsdom-upgrade which uses TS 4.5 features in their types, thus our TS checks fail. We are blocked until we migrate to ts 4.5
    • will be unblocked by https://github.com/microsoft/fluentui/pull/27936

Related Issue(s)

  • Fixes partially https://github.com/microsoft/fluentui/issues/25488

Hotell avatar May 22 '23 11:05 Hotell

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
global-context
createContext		 510 B
330 B
global-context
createContextSelector		 537 B
342 B
priority-overflow
createOverflowManager		 3.194 kB
1.315 kB
react-accordion
Accordion (including children components)		 88.516 kB
26.795 kB
react-alert
Alert		 93.549 kB
22.537 kB
react-avatar
Avatar		 57.797 kB
15.091 kB
react-avatar
AvatarGroup		 15.646 kB
6.298 kB
react-avatar
AvatarGroupItem		 73.973 kB
19.582 kB
react-badge
Badge		 23.555 kB
7.256 kB
react-badge
CounterBadge		 24.457 kB
7.559 kB
react-badge
PresenceBadge		 32.135 kB
8.423 kB
react-button
Button		 36.742 kB
9.5 kB
react-button
CompoundButton		 43.896 kB
10.98 kB
react-button
MenuButton		 41.427 kB
10.836 kB
react-button
SplitButton		 49.649 kB
12.42 kB
react-button
ToggleButton		 55.024 kB
11.436 kB
react-card
Card - All		 88.716 kB
25.114 kB
react-card
Card		 83.651 kB
23.658 kB
react-card
CardFooter		 9.193 kB
3.892 kB
react-card
CardHeader		 11.089 kB
4.588 kB
react-card
CardPreview		 9.998 kB
4.24 kB
react-checkbox
Checkbox		 34.5 kB
10.878 kB
react-combobox
Combobox (including child components)		 87.735 kB
28.243 kB
react-combobox
Dropdown (including child components)		 86.074 kB
27.848 kB
react-components
react-components: Button, FluentProvider & webLightTheme		 64.899 kB
17.91 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover		 206.425 kB
57.914 kB
react-components
react-components: FluentProvider & webLightTheme		 36.132 kB
11.954 kB
react-datepicker-compat
DatePicker Compat		 222.56 kB
59.204 kB
react-dialog
Dialog (including children components)		 92.076 kB
27.492 kB
react-divider
Divider		 17.441 kB
6.349 kB
react-field
Field		 18.9 kB
7.083 kB
react-image
Image		 11.514 kB
4.619 kB
react-infobutton
InfoButton		 130.121 kB
39.785 kB
react-infobutton
InfoLabel		 133.586 kB
40.852 kB
react-input
Input		 24.183 kB
7.772 kB
react-label
Label		 10.139 kB
4.231 kB
react-link
Link		 12.339 kB
5.105 kB
react-menu
Menu (including children components)		 130.848 kB
39.946 kB
react-menu
Menu (including selectable components)		 133.832 kB
40.479 kB
react-overflow
hooks only		 11.206 kB
4.266 kB
react-persona
Persona		 64.718 kB
17.012 kB
react-popover
Popover		 117.083 kB
36.122 kB
react-portal
Portal		 11.676 kB
4.31 kB
react-portal-compat
PortalCompatProvider		 6.473 kB
2.196 kB
react-positioning
usePositioning		 24.249 kB
8.856 kB
react-progress
ProgressBar		 13.891 kB
5.482 kB
react-provider
FluentProvider		 18.079 kB
6.713 kB
react-radio
Radio		 27.404 kB
8.722 kB
react-radio
RadioGroup		 11.326 kB
4.743 kB
react-select
Select		 25.373 kB
8.826 kB
react-slider
Slider		 34.322 kB
11.099 kB
react-spinbutton
SpinButton		 34.121 kB
10.421 kB
react-spinner
Spinner		 21.327 kB
7.015 kB
react-switch
Switch		 29.924 kB
9.342 kB
react-table
DataGrid		 150.868 kB
41.518 kB
react-table
Table (Primitives only)		 45.111 kB
12.567 kB
react-table
Table as DataGrid		 133.356 kB
34.002 kB
react-table
Table (Selection only)		 79.125 kB
19.379 kB
react-table
Table (Sort only)		 78.455 kB
19.187 kB
react-tags
Tag		 22.004 kB
7.93 kB
react-text
Text - Default		 12.527 kB
4.963 kB
react-text
Text - Wrappers		 15.677 kB
5.284 kB
react-textarea
Textarea		 27.686 kB
9.126 kB
react-theme
Single theme token import		 69 B
89 B
react-theme
Teams: all themes		 31.33 kB
6.764 kB
react-theme
Teams: Light theme		 17.895 kB
5.162 kB
react-tooltip
Tooltip		 47.119 kB
16.528 kB
react-utilities
SSRProvider		 180 B
159 B
🤖 This report was generated against 3d73007c50ca4008618498a998cdaed5675bbda6

fabricteam avatar May 22 '23 11:05 fabricteam

🕵 fluentuiv8 No visual regressions between this PR and main

fabricteam avatar May 22 '23 12:05 fabricteam

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 561 583 5000
Button mount 292 306 5000
Field mount 1006 986 5000
FluentProvider mount 636 656 5000
FluentProviderWithTheme mount 71 80 10
FluentProviderWithTheme virtual-rerender 70 81 10
FluentProviderWithTheme virtual-rerender-with-unmount 72 81 10
InfoButton mount 8 14 5000
MakeStyles mount 853 863 50000
Persona mount 1632 1627 5000
SpinButton mount 1280 1291 5000

fabricteam avatar May 22 '23 12:05 fabricteam

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
CardMinimalPerf.default 327 305 1.07:1
InputMinimalPerf.default 568 530 1.07:1
LoaderMinimalPerf.default 207 193 1.07:1
RefMinimalPerf.default 115 108 1.06:1
SegmentMinimalPerf.default 203 191 1.06:1
ChatDuplicateMessagesPerf.default 152 145 1.05:1
LabelMinimalPerf.default 226 216 1.05:1
SkeletonMinimalPerf.default 204 197 1.04:1
SliderMinimalPerf.default 722 694 1.04:1
AttachmentSlotsPerf.default 663 644 1.03:1
FlexMinimalPerf.default 157 152 1.03:1
ReactionMinimalPerf.default 221 214 1.03:1
AccordionMinimalPerf.default 87 85 1.02:1
CheckboxMinimalPerf.default 1183 1162 1.02:1
EmbedMinimalPerf.default 1777 1739 1.02:1
LayoutMinimalPerf.default 202 199 1.02:1
ListWith60ListItems.default 367 361 1.02:1
PortalMinimalPerf.default 87 85 1.02:1
ProviderMergeThemesPerf.default 676 663 1.02:1
TextMinimalPerf.default 193 190 1.02:1
ToolbarMinimalPerf.default 550 540 1.02:1
BoxMinimalPerf.default 191 189 1.01:1
ButtonMinimalPerf.default 85 84 1.01:1
ButtonOverridesMissPerf.default 641 635 1.01:1
DropdownMinimalPerf.default 1425 1405 1.01:1
FormMinimalPerf.default 227 225 1.01:1
HeaderSlotsPerf.default 475 470 1.01:1
MenuButtonMinimalPerf.default 955 949 1.01:1
RosterPerf.default 1527 1516 1.01:1
StatusMinimalPerf.default 395 392 1.01:1
TreeMinimalPerf.default 487 484 1.01:1
DatepickerMinimalPerf.default 3575 3575 1:1
DialogMinimalPerf.default 452 454 1:1
GridMinimalPerf.default 188 188 1:1
ListCommonPerf.default 405 403 1:1
ListNestedPerf.default 315 314 1:1
SplitButtonMinimalPerf.default 2289 2299 1:1
TableMinimalPerf.default 240 241 1:1
TreeWith60ListItems.default 86 86 1:1
AvatarMinimalPerf.default 110 111 0.99:1
DropdownManyItemsPerf.default 392 396 0.99:1
ItemLayoutMinimalPerf.default 723 728 0.99:1
PopupMinimalPerf.default 340 344 0.99:1
TableManyItemsPerf.default 1133 1140 0.99:1
CustomToolbarPrototype.default 1440 1452 0.99:1
TooltipMinimalPerf.default 1252 1261 0.99:1
AnimationMinimalPerf.default 293 298 0.98:1
ButtonSlotsPerf.default 313 318 0.98:1
MenuMinimalPerf.default 494 502 0.98:1
ProviderMinimalPerf.default 201 205 0.98:1
RadioGroupMinimalPerf.default 262 267 0.98:1
IconMinimalPerf.default 370 379 0.98:1
TextAreaMinimalPerf.default 280 285 0.98:1
ChatMinimalPerf.default 438 450 0.97:1
ListMinimalPerf.default 302 312 0.97:1
CarouselMinimalPerf.default 260 275 0.95:1
ChatWithPopoverPerf.default 187 196 0.95:1
HeaderMinimalPerf.default 199 210 0.95:1
DividerMinimalPerf.default 199 211 0.94:1
ImageMinimalPerf.default 221 234 0.94:1
VideoMinimalPerf.default 414 440 0.94:1
AlertMinimalPerf.default 155 169 0.92:1
AttachmentMinimalPerf.default 73 79 0.92:1

fabricteam avatar May 22 '23 12:05 fabricteam

🕵 FluentUI-v0 No visual regressions between this PR and main

fabricteam avatar May 22 '23 12:05 fabricteam

🕵 fluentuiv9 No visual regressions between this PR and main

fabricteam avatar May 22 '23 12:05 fabricteam

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 616 635 5000
Breadcrumb mount 1690 1657 1000
Checkbox mount 1683 1704 5000
CheckboxBase mount 1464 1475 5000
ChoiceGroup mount 2958 2931 5000
ComboBox mount 645 675 1000
CommandBar mount 6212 6216 1000
ContextualMenu mount 11728 11849 1000
DefaultButton mount 738 751 5000
DetailsRow mount 2210 2198 5000
DetailsRowFast mount 2209 2189 5000
DetailsRowNoStyles mount 2020 1998 5000
Dialog mount 2588 2610 1000
DocumentCardTitle mount 233 226 1000
Dropdown mount 1984 1976 5000
FocusTrapZone mount 1115 1121 5000
FocusZone mount 1050 1067 5000
GroupedList mount 41746 41980 2
GroupedList virtual-rerender 20119 20147 2
GroupedList virtual-rerender-with-unmount 51085 51191 2
GroupedListV2 mount 231 223 2
GroupedListV2 virtual-rerender 221 213 2
GroupedListV2 virtual-rerender-with-unmount 225 224 2
IconButton mount 1101 1116 5000
Label mount 351 339 5000
Layer mount 2726 2709 5000
Link mount 385 399 5000
MenuButton mount 943 969 5000
MessageBar mount 22062 22095 5000
Nav mount 1978 1959 1000
OverflowSet mount 810 791 5000
Panel mount 1786 1746 1000
Persona mount 770 774 1000
Pivot mount 891 885 1000
PrimaryButton mount 863 867 5000
Rating mount 4683 4698 5000
SearchBox mount 920 929 5000
Shimmer mount 1853 1862 5000
Slider mount 1387 1338 5000
SpinButton mount 2889 2884 5000
Spinner mount 401 390 5000
SplitButton mount 1876 1880 5000
Stack mount 443 416 5000
StackWithIntrinsicChildren mount 881 862 5000
StackWithTextChildren mount 2684 2708 5000
SwatchColorPicker mount 6016 6066 5000
TagPicker mount 1458 1421 5000
Text mount 363 373 5000
TextField mount 925 964 5000
ThemeProvider mount 831 833 5000
ThemeProvider virtual-rerender 596 601 5000
ThemeProvider virtual-rerender-with-unmount 1286 1284 5000
Toggle mount 609 622 5000
buttonNative mount 187 199 5000

fabricteam avatar May 22 '23 12:05 fabricteam

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 5cd73493be54b8f2168f3b3218e6d84ad0eee62a:

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

codesandbox-ci[bot] avatar May 31 '23 11:05 codesandbox-ci[bot]

Asset size changes

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

Baseline commit: 3d73007c50ca4008618498a998cdaed5675bbda6 (build)

size-auditor[bot] avatar Jun 01 '23 11:06 size-auditor[bot]