Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: tab should have pointer as cursor #14421

Merged

Conversation

chrisdholt
Copy link
Member

Pull request checklist

Description of changes

Fixes an issue where the tab cursor is incorrect.

Focus areas to test

Boot storybook, navigate to tabs - hover over the tab.

@codesandbox-ci
Copy link

codesandbox-ci bot commented Aug 8, 2020

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 624290f:

Sandbox Source
Fluent UI Button Configuration
microsoft/fluentui: codesandbox-react-template Configuration
microsoft/fluentui: codesandbox-react-next-template Configuration
microsoft/fluentui: codesandbox-react-northstar-template Configuration

@size-auditor
Copy link

size-auditor bot commented Aug 8, 2020

Asset size changes

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

Baseline commit: d68237157ad051772c27d2bc3c1e775e72b04c43 (build)

@msft-github-bot
Copy link
Contributor

msft-github-bot commented Aug 8, 2020

Perf Analysis

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 912 916 5000
ButtonNext mount 587 628 5000
Checkbox mount 1601 1664 5000
CheckboxBase mount 1426 1367 5000
CheckboxNext mount 1658 1700 5000
ChoiceGroup mount 5172 5138 5000
ComboBox mount 943 913 1000
CommandBar mount 7842 7499 1000
ContextualMenu mount 12567 12707 1000
DefaultButton mount 1119 1164 5000
DetailsRow mount 3539 3559 5000
DetailsRowFast mount 3644 3622 5000
DetailsRowNoStyles mount 3439 3396 5000
Dialog mount 1534 1523 1000
DocumentCardTitle mount 1810 1787 1000
Dropdown mount 2605 2672 5000
FocusZone mount 1708 1733 5000
IconButton mount 1840 1820 5000
Label mount 339 339 5000
Link mount 439 434 5000
LinkNext mount 503 513 5000
MenuButton mount 1507 1504 5000
Nav mount 3332 3285 1000
Panel mount 1460 1469 1000
Persona mount 843 867 1000
Pivot mount 1434 1451 1000
PivotNext mount 1380 1433 1000
PrimaryButton mount 1305 1300 5000
SearchBox mount 1387 1388 5000
SearchBoxNext mount 1422 1375 5000
Slider mount 1470 1528 5000
SliderNext mount 1971 2027 5000
SpinButton mount 5088 5082 5000
SpinButtonNext mount 5117 5192 5000
Spinner mount 425 433 5000
SplitButton mount 3272 3229 5000
Stack mount 573 559 5000
StackWithIntrinsicChildren mount 1948 1929 5000
StackWithTextChildren mount 5281 5191 5000
TagPicker mount 2763 2765 5000
Text mount 441 429 5000
TextField mount 1418 1428 5000
ThemeProvider mount 2850 2760 5000
ThemeProvider virtual-rerender 455 444 5000
Toggle mount 855 845 5000
ToggleNext mount 876 871 5000
button mount 99 121 5000

Perf Analysis (Fluent)

Perf comparison
Status Scenario Fluent TPI Fabric TPI Ratio Iterations Ticks
🎯 Avatar.Fluent 0.47 0.47 1:1 2000 933
🦄 Button.Fluent 0.12 0.2 0.6:1 5000 612
🔧 Checkbox.Fluent 0.65 0.37 1.76:1 1000 651
🎯 Dialog.Fluent 0.16 0.22 0.73:1 5000 814
🔧 Dropdown.Fluent 2.89 0.48 6.02:1 1000 2893
🔧 Icon.Fluent 0.15 0.05 3:1 5000 738
🎯 Image.Fluent 0.09 0.11 0.82:1 5000 432
🔧 Slider.Fluent 1.58 0.34 4.65:1 1000 1581
🔧 Text.Fluent 0.08 0.03 2.67:1 5000 390
🦄 Tooltip.Fluent 0.1 15.58 0.01:1 5000 507

🔧 Needs work     🎯 On target     🦄 Amazing

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
FlexMinimalPerf.default 323 281 1.15:1
TreeWith60ListItems.default 239 210 1.14:1
AnimationMinimalPerf.default 421 376 1.12:1
GridMinimalPerf.default 382 348 1.1:1
Button.Fluent 612 569 1.08:1
Text.Fluent 390 360 1.08:1
CardMinimalPerf.default 595 555 1.07:1
LabelMinimalPerf.default 440 415 1.06:1
AlertMinimalPerf.default 330 314 1.05:1
AttachmentSlotsPerf.default 1210 1153 1.05:1
RefMinimalPerf.default 203 193 1.05:1
BoxMinimalPerf.default 382 367 1.04:1
ButtonSlotsPerf.default 630 606 1.04:1
CarouselMinimalPerf.default 487 470 1.04:1
HeaderMinimalPerf.default 388 373 1.04:1
ImageMinimalPerf.default 390 375 1.04:1
RadioGroupMinimalPerf.default 444 426 1.04:1
SegmentMinimalPerf.default 380 364 1.04:1
StatusMinimalPerf.default 731 706 1.04:1
DropdownManyItemsPerf.default 803 779 1.03:1
HeaderSlotsPerf.default 853 829 1.03:1
HierarchicalTreeMinimalPerf.default 447 435 1.03:1
ItemLayoutMinimalPerf.default 1329 1296 1.03:1
ListMinimalPerf.default 501 485 1.03:1
ProviderMinimalPerf.default 954 924 1.03:1
TextMinimalPerf.default 368 358 1.03:1
Image.Fluent 432 420 1.03:1
InputMinimalPerf.default 1340 1309 1.02:1
MenuButtonMinimalPerf.default 1626 1588 1.02:1
PopupMinimalPerf.default 680 668 1.02:1
SkeletonMinimalPerf.default 431 421 1.02:1
SplitButtonMinimalPerf.default 3930 3865 1.02:1
ChatWithPopoverPerf.default 501 495 1.01:1
DialogMinimalPerf.default 786 779 1.01:1
DividerMinimalPerf.default 381 379 1.01:1
DropdownMinimalPerf.default 2960 2937 1.01:1
ListCommonPerf.default 995 989 1.01:1
ListWith60ListItems.default 1128 1118 1.01:1
ProviderMergeThemesPerf.default 1864 1853 1.01:1
TableManyItemsPerf.default 2391 2371 1.01:1
TableMinimalPerf.default 409 405 1.01:1
CustomToolbarPrototype.default 3699 3652 1.01:1
Dialog.Fluent 814 803 1.01:1
ChatDuplicateMessagesPerf.default 427 429 1:1
EmbedMinimalPerf.default 2016 2024 1:1
MenuMinimalPerf.default 889 886 1:1
SliderMinimalPerf.default 1590 1587 1:1
TooltipMinimalPerf.default 796 796 1:1
Tooltip.Fluent 507 508 1:1
AvatarMinimalPerf.default 488 492 0.99:1
CheckboxMinimalPerf.default 2856 2891 0.99:1
LayoutMinimalPerf.default 423 427 0.99:1
ReactionMinimalPerf.default 404 410 0.99:1
ToolbarMinimalPerf.default 978 983 0.99:1
TreeMinimalPerf.default 892 903 0.99:1
Avatar.Fluent 933 944 0.99:1
Icon.Fluent 738 747 0.99:1
Slider.Fluent 1581 1600 0.99:1
FormMinimalPerf.default 453 460 0.98:1
ListNestedPerf.default 897 913 0.98:1
LoaderMinimalPerf.default 739 751 0.98:1
Dropdown.Fluent 2893 2942 0.98:1
ButtonMinimalPerf.default 181 186 0.97:1
ChatMinimalPerf.default 629 646 0.97:1
TextAreaMinimalPerf.default 503 516 0.97:1
VideoMinimalPerf.default 644 662 0.97:1
Checkbox.Fluent 651 668 0.97:1
PortalMinimalPerf.default 114 119 0.96:1
AccordionMinimalPerf.default 152 163 0.93:1
AttachmentMinimalPerf.default 172 184 0.93:1
IconMinimalPerf.default 670 719 0.93:1

@kenotron
Copy link
Member

kenotron commented Aug 9, 2020

closing & reopening to make sure the new build system will do verification

@kenotron kenotron closed this Aug 9, 2020
@kenotron kenotron reopened this Aug 9, 2020
@chrisdholt chrisdholt merged commit 1580bb6 into microsoft:master Aug 11, 2020
@msft-github-bot
Copy link
Contributor

🎉@fluentui/web-components@v0.1.3 has been released which incorporates this pull request.:tada:

Handy links:

@chrisdholt chrisdholt deleted the users/chhol/fix-tab-pointer-cursor branch August 11, 2020 17:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[web components] Tab component should use pointer cursor style
4 participants