feat: Bump tabster to 2.1.0#23811
Merged
ling1726 merged 19 commits intomicrosoft:masterfrom Jul 26, 2022
Merged
Conversation
|
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 a319d04:
|
Asset size changesSize Auditor did not detect a change in bundle size for any component! Baseline commit: d08b249e242ea328bb33eb0f203850f461144342 (build) |
Collaborator
Perf Analysis (
|
| Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
|---|---|---|---|---|---|
| Avatar | mount | 1614 | 1681 | 5000 | |
| Button | mount | 1096 | 1098 | 5000 | |
| FluentProvider | mount | 2113 | 2120 | 5000 | |
| FluentProviderWithTheme | mount | 708 | 734 | 10 | |
| FluentProviderWithTheme | virtual-rerender | 693 | 678 | 10 | |
| FluentProviderWithTheme | virtual-rerender-with-unmount | 796 | 756 | 10 | |
| MakeStyles | mount | 2363 | 2429 | 50000 | |
| SpinButton | mount | 3228 | 3108 | 5000 |
Collaborator
📊 Bundle size report
Unchanged fixtures
|
Collaborator
Perf Analysis (
|
| Scenario | Current PR Ticks | Baseline Ticks | Ratio |
|---|---|---|---|
| TreeWith60ListItems.default | 182 | 151 | 1.21:1 |
| AttachmentMinimalPerf.default | 173 | 148 | 1.17:1 |
| SkeletonMinimalPerf.default | 375 | 342 | 1.1:1 |
| ImageMinimalPerf.default | 381 | 354 | 1.08:1 |
| VideoMinimalPerf.default | 722 | 666 | 1.08:1 |
| FlexMinimalPerf.default | 293 | 274 | 1.07:1 |
| RefMinimalPerf.default | 248 | 231 | 1.07:1 |
| CardMinimalPerf.default | 611 | 575 | 1.06:1 |
| FormMinimalPerf.default | 414 | 390 | 1.06:1 |
| AnimationMinimalPerf.default | 587 | 559 | 1.05:1 |
| HeaderMinimalPerf.default | 396 | 377 | 1.05:1 |
| SegmentMinimalPerf.default | 360 | 342 | 1.05:1 |
| TooltipMinimalPerf.default | 1213 | 1159 | 1.05:1 |
| AvatarMinimalPerf.default | 205 | 197 | 1.04:1 |
| ButtonMinimalPerf.default | 167 | 160 | 1.04:1 |
| ButtonSlotsPerf.default | 562 | 542 | 1.04:1 |
| ChatDuplicateMessagesPerf.default | 319 | 307 | 1.04:1 |
| ListMinimalPerf.default | 535 | 513 | 1.04:1 |
| MenuMinimalPerf.default | 912 | 878 | 1.04:1 |
| LayoutMinimalPerf.default | 366 | 357 | 1.03:1 |
| ProviderMergeThemesPerf.default | 1374 | 1334 | 1.03:1 |
| AlertMinimalPerf.default | 296 | 290 | 1.02:1 |
| CarouselMinimalPerf.default | 495 | 485 | 1.02:1 |
| ListCommonPerf.default | 647 | 637 | 1.02:1 |
| RadioGroupMinimalPerf.default | 451 | 444 | 1.02:1 |
| TextMinimalPerf.default | 362 | 356 | 1.02:1 |
| AttachmentSlotsPerf.default | 1139 | 1126 | 1.01:1 |
| ChatMinimalPerf.default | 784 | 777 | 1.01:1 |
| DialogMinimalPerf.default | 824 | 817 | 1.01:1 |
| DropdownManyItemsPerf.default | 733 | 725 | 1.01:1 |
| ListNestedPerf.default | 593 | 588 | 1.01:1 |
| TextAreaMinimalPerf.default | 499 | 494 | 1.01:1 |
| ButtonOverridesMissPerf.default | 1550 | 1545 | 1:1 |
| ChatWithPopoverPerf.default | 398 | 398 | 1:1 |
| ProviderMinimalPerf.default | 427 | 426 | 1:1 |
| SplitButtonMinimalPerf.default | 4613 | 4619 | 1:1 |
| TableManyItemsPerf.default | 2043 | 2049 | 1:1 |
| TableMinimalPerf.default | 416 | 418 | 1:1 |
| BoxMinimalPerf.default | 343 | 345 | 0.99:1 |
| DatepickerMinimalPerf.default | 5993 | 6060 | 0.99:1 |
| DropdownMinimalPerf.default | 3383 | 3412 | 0.99:1 |
| HeaderSlotsPerf.default | 779 | 785 | 0.99:1 |
| MenuButtonMinimalPerf.default | 1784 | 1807 | 0.99:1 |
| CustomToolbarPrototype.default | 2816 | 2855 | 0.99:1 |
| ToolbarMinimalPerf.default | 1000 | 1015 | 0.99:1 |
| AccordionMinimalPerf.default | 149 | 152 | 0.98:1 |
| CheckboxMinimalPerf.default | 2801 | 2848 | 0.98:1 |
| EmbedMinimalPerf.default | 4313 | 4381 | 0.98:1 |
| InputMinimalPerf.default | 1372 | 1403 | 0.98:1 |
| ItemLayoutMinimalPerf.default | 1241 | 1265 | 0.98:1 |
| LabelMinimalPerf.default | 386 | 393 | 0.98:1 |
| LoaderMinimalPerf.default | 706 | 721 | 0.98:1 |
| PortalMinimalPerf.default | 172 | 175 | 0.98:1 |
| IconMinimalPerf.default | 636 | 646 | 0.98:1 |
| DividerMinimalPerf.default | 360 | 373 | 0.97:1 |
| GridMinimalPerf.default | 349 | 362 | 0.96:1 |
| ListWith60ListItems.default | 638 | 665 | 0.96:1 |
| RosterPerf.default | 1161 | 1214 | 0.96:1 |
| PopupMinimalPerf.default | 658 | 684 | 0.96:1 |
| SliderMinimalPerf.default | 1750 | 1832 | 0.96:1 |
| StatusMinimalPerf.default | 687 | 719 | 0.96:1 |
| ReactionMinimalPerf.default | 371 | 396 | 0.94:1 |
| TreeMinimalPerf.default | 823 | 879 | 0.94:1 |
Collaborator
Perf Analysis (
|
| Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
|---|---|---|---|---|---|
| BaseButton | mount | 1069 | 1087 | 5000 | |
| Breadcrumb | mount | 2981 | 2988 | 1000 | |
| Checkbox | mount | 2932 | 2934 | 5000 | |
| CheckboxBase | mount | 2578 | 2562 | 5000 | |
| ChoiceGroup | mount | 5429 | 5406 | 5000 | |
| ComboBox | mount | 1108 | 1094 | 1000 | |
| CommandBar | mount | 11418 | 11416 | 1000 | |
| ContextualMenu | mount | 12597 | 12659 | 1000 | |
| DefaultButton | mount | 1384 | 1319 | 5000 | |
| DetailsRow | mount | 4279 | 4354 | 5000 | |
| DetailsRowFast | mount | 4461 | 4334 | 5000 | |
| DetailsRowNoStyles | mount | 4203 | 4169 | 5000 | |
| Dialog | mount | 3144 | 3144 | 1000 | |
| DocumentCardTitle | mount | 200 | 200 | 1000 | |
| Dropdown | mount | 3821 | 3897 | 5000 | |
| FocusTrapZone | mount | 2082 | 2090 | 5000 | |
| FocusZone | mount | 2020 | 2000 | 5000 | |
| IconButton | mount | 2099 | 2094 | 5000 | |
| Label | mount | 406 | 390 | 5000 | |
| Layer | mount | 3517 | 3588 | 5000 | |
| Link | mount | 558 | 576 | 5000 | |
| MenuButton | mount | 1723 | 1773 | 5000 | |
| MessageBar | mount | 2418 | 2418 | 5000 | |
| Nav | mount | 3768 | 3830 | 1000 | |
| OverflowSet | mount | 1273 | 1221 | 5000 | |
| Panel | mount | 2441 | 2391 | 1000 | |
| Persona | mount | 1192 | 1147 | 1000 | |
| Pivot | mount | 1655 | 1670 | 1000 | |
| PrimaryButton | mount | 1541 | 1521 | 5000 | |
| Rating | mount | 9172 | 9048 | 5000 | |
| SearchBox | mount | 1527 | 1592 | 5000 | |
| Shimmer | mount | 2935 | 2972 | 5000 | |
| Slider | mount | 2244 | 2233 | 5000 | |
| SpinButton | mount | 5776 | 5676 | 5000 | |
| Spinner | mount | 473 | 499 | 5000 | |
| SplitButton | mount | 3938 | 3950 | 5000 | |
| Stack | mount | 621 | 626 | 5000 | |
| StackWithIntrinsicChildren | mount | 2932 | 2856 | 5000 | |
| StackWithTextChildren | mount | 6436 | 6368 | 5000 | |
| SwatchColorPicker | mount | 13164 | 13011 | 5000 | |
| TagPicker | mount | 3152 | 3051 | 5000 | |
| TeachingBubble | mount | 103739 | 103139 | 5000 | |
| Text | mount | 514 | 503 | 5000 | |
| TextField | mount | 1636 | 1603 | 5000 | |
| ThemeProvider | mount | 1324 | 1329 | 5000 | |
| ThemeProvider | virtual-rerender | 732 | 734 | 5000 | |
| ThemeProvider | virtual-rerender-with-unmount | 2005 | 2002 | 5000 | |
| Toggle | mount | 907 | 936 | 5000 | |
| buttonNative | mount | 164 | 153 | 5000 |
|
Fire an issue related to this: microsoft/tabster#160 |
ling1726
commented
Jul 25, 2022
| }); | ||
|
|
||
| afterEach(() => { | ||
| beforeEach(() => { |
Contributor
Author
There was a problem hiding this comment.
use beforeEach because a custom afterEach needs the user to call the cleanup function explicitly
Contributor
There was a problem hiding this comment.
is this related to new tabster or what cleanup function are you reffering to ?
Contributor
Author
There was a problem hiding this comment.
@testing-library/react has a cleanup function which is configured by default in jest. This actually unmounts all components after the current afterEach where jest.useRealTimers is called. The existing fake timers that need to be cleared are still running without an explicit call of cleanup.
Therfore, it's just simpler to do it in beforeEach and let testing-libarary do its defaults
Contributor
Author
There was a problem hiding this comment.
also these timers tests should be removed since cypress now tests these interactions. I'll do that in another PR
ling1726
commented
Jul 26, 2022
change/@fluentui-react-tabster-24d3044f-d004-4616-89da-62ba9e365ccb.json
Outdated
Show resolved
Hide resolved
change/@fluentui-react-tabster-24d3044f-d004-4616-89da-62ba9e365ccb.json
Outdated
Show resolved
Hide resolved
| deloser: {}, | ||
| }); | ||
|
|
||
| React.useEffect(() => { |
Member
There was a problem hiding this comment.
AFAIK tabster has dummy inputs, are they used there? If so useLayoutEffect should be potentially safer
Contributor
Author
There was a problem hiding this comment.
Resolving for now, there are other bugs that need to be fixed and v9 currently does not support React 18 anyway. Tracking tabster support for 18 in #24085
layershifter
approved these changes
Jul 26, 2022
…65ccb.json Co-authored-by: Oleksandr Fediashov <alexander.mcgarret@gmail.com>
Hotell
reviewed
Jul 26, 2022
| }); | ||
|
|
||
| afterEach(() => { | ||
| beforeEach(() => { |
Contributor
There was a problem hiding this comment.
is this related to new tabster or what cleanup function are you reffering to ?
Hotell
approved these changes
Jul 26, 2022
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
6 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Updates tabster to 2.0.1 and updates
useTabsterto use new disposable wrapper that's suitable for React effects.Fixes #22291