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

Ensure all web components leverage the body font variable #16013

Conversation

chrisdholt
Copy link
Member

Pull request checklist

  • Addresses an existing issue: Fixes #0000
  • Include a change request file using $ yarn change

Description of changes

(give an overview)

Focus areas to test

(optional)

@codesandbox-ci
Copy link

codesandbox-ci bot commented Nov 19, 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 9541c0a:

Sandbox Source
Fluent UI Button Configuration
codesandbox-react-template Configuration
codesandbox-react-northstar-template Configuration

@msft-github-bot
Copy link
Contributor

msft-github-bot commented Nov 19, 2020

Perf Analysis

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 850 804 5000
BaseButtonCompat mount 872 865 5000
Breadcrumb mount 41751 42991 5000
Checkbox mount 1460 1449 5000
CheckboxBase mount 1244 1241 5000
ChoiceGroup mount 4582 4666 5000
ComboBox mount 940 923 1000
CommandBar mount 9894 9932 1000
ContextualMenu mount 5902 5935 1000
DefaultButtonCompat mount 1100 1103 5000
DetailsRow mount 3539 3504 5000
DetailsRowFast mount 3541 3614 5000
DetailsRowNoStyles mount 3318 3427 5000
Dialog mount 1403 1415 1000
DocumentCardTitle mount 1746 1806 1000
Dropdown mount 3187 3211 5000
FocusTrapZone mount 1742 1763 5000
FocusZone mount 1775 1801 5000
IconButtonCompat mount 1680 1665 5000
Label mount 349 323 5000
Layer mount 1704 1718 5000
Link mount 452 448 5000
MenuButtonCompat mount 1414 1447 5000
MessageBar mount 1944 1980 5000
Nav mount 3205 3189 1000
OverflowSet mount 1034 1032 5000
Panel mount 1360 1369 1000
Persona mount 831 800 1000
Pivot mount 1361 1334 1000
PrimaryButtonCompat mount 1258 1244 5000
Rating mount 7254 7252 5000
SearchBox mount 1252 1319 5000
Shimmer mount 2472 2438 5000
Slider mount 1891 1815 5000
SpinButton mount 4928 4895 5000
Spinner mount 403 418 5000
SplitButtonCompat mount 3055 3079 5000
Stack mount 498 482 5000
StackWithIntrinsicChildren mount 1455 1501 5000
StackWithTextChildren mount 4354 4341 5000
SwatchColorPicker mount 9954 9981 5000
Tabs mount 1368 1385 1000
TagPicker mount 2720 2698 5000
TeachingBubble mount 11292 11276 5000
Text mount 398 398 5000
TextField mount 1323 1331 5000
ThemeProvider mount 1921 1929 5000
ThemeProvider virtual-rerender 640 625 5000
Toggle mount 748 751 5000
button mount 623 642 5000
buttonNative mount 112 99 5000

Perf Analysis (Fluent)

Perf comparison
Status Scenario Fluent TPI Fabric TPI Ratio Iterations Ticks
🎯 Avatar.Fluent 0.46 0.48 0.96:1 2000 918
🦄 Button.Fluent 0.12 0.23 0.52:1 5000 580
🔧 Checkbox.Fluent 0.64 0.33 1.94:1 1000 641
🎯 Dialog.Fluent 0.16 0.21 0.76:1 5000 781
🔧 Dropdown.Fluent 2.91 0.39 7.46:1 1000 2905
🔧 Icon.Fluent 0.14 0.06 2.33:1 5000 689
🦄 Image.Fluent 0.08 0.12 0.67:1 5000 378
🔧 Slider.Fluent 1.59 0.42 3.79:1 1000 1586
🔧 Text.Fluent 0.07 0.03 2.33:1 5000 359
🦄 Tooltip.Fluent 0.11 0.86 0.13:1 5000 553

🔧 Needs work     🎯 On target     🦄 Amazing

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
SegmentMinimalPerf.default 374 344 1.09:1
AttachmentMinimalPerf.default 172 160 1.08:1
BoxMinimalPerf.default 373 348 1.07:1
GridMinimalPerf.default 361 340 1.06:1
ChatDuplicateMessagesPerf.default 434 412 1.05:1
PortalMinimalPerf.default 179 170 1.05:1
IconMinimalPerf.default 699 667 1.05:1
Avatar.Fluent 918 875 1.05:1
ChatWithPopoverPerf.default 469 450 1.04:1
FormMinimalPerf.default 427 410 1.04:1
RadioGroupMinimalPerf.default 452 435 1.04:1
PopupMinimalPerf.default 713 691 1.03:1
TextMinimalPerf.default 373 363 1.03:1
ButtonUseCssPerf.default 829 810 1.02:1
CarouselMinimalPerf.default 454 443 1.02:1
DividerMinimalPerf.default 378 372 1.02:1
DropdownManyItemsPerf.default 745 733 1.02:1
LabelMinimalPerf.default 427 420 1.02:1
ToolbarMinimalPerf.default 940 922 1.02:1
Checkbox.Fluent 641 629 1.02:1
Text.Fluent 359 352 1.02:1
AttachmentSlotsPerf.default 1123 1114 1.01:1
ButtonOverridesMissPerf.default 1676 1653 1.01:1
DialogMinimalPerf.default 783 778 1.01:1
DropdownMinimalPerf.default 2928 2899 1.01:1
EmbedMinimalPerf.default 4114 4071 1.01:1
ListNestedPerf.default 575 568 1.01:1
ListWith60ListItems.default 921 916 1.01:1
SplitButtonMinimalPerf.default 3770 3737 1.01:1
CustomToolbarPrototype.default 3859 3821 1.01:1
TreeMinimalPerf.default 886 875 1.01:1
TreeWith60ListItems.default 209 206 1.01:1
VideoMinimalPerf.default 629 620 1.01:1
Button.Fluent 580 572 1.01:1
Slider.Fluent 1586 1575 1.01:1
AlertMinimalPerf.default 293 294 1:1
AnimationMinimalPerf.default 410 409 1:1
DatepickerMinimalPerf.default 45268 45111 1:1
ItemLayoutMinimalPerf.default 1260 1264 1:1
LayoutMinimalPerf.default 418 418 1:1
ListMinimalPerf.default 501 502 1:1
LoaderMinimalPerf.default 739 739 1:1
MenuMinimalPerf.default 856 858 1:1
SkeletonMinimalPerf.default 423 424 1:1
StatusMinimalPerf.default 736 739 1:1
TableManyItemsPerf.default 2159 2159 1:1
TooltipMinimalPerf.default 808 809 1:1
Dropdown.Fluent 2905 2914 1:1
ButtonMinimalPerf.default 176 177 0.99:1
CardMinimalPerf.default 554 561 0.99:1
ChatMinimalPerf.default 627 635 0.99:1
CheckboxMinimalPerf.default 2815 2836 0.99:1
HeaderSlotsPerf.default 780 785 0.99:1
ImageMinimalPerf.default 378 380 0.99:1
InputMinimalPerf.default 1280 1293 0.99:1
MenuButtonMinimalPerf.default 1545 1562 0.99:1
ProviderMinimalPerf.default 1005 1012 0.99:1
RefMinimalPerf.default 236 239 0.99:1
SliderMinimalPerf.default 1533 1554 0.99:1
TextAreaMinimalPerf.default 471 476 0.99:1
Dialog.Fluent 781 786 0.99:1
AvatarMinimalPerf.default 459 467 0.98:1
ButtonUseCssNestingPerf.default 1051 1071 0.98:1
ProviderMergeThemesPerf.default 2041 2076 0.98:1
Tooltip.Fluent 553 563 0.98:1
ListCommonPerf.default 637 659 0.97:1
ReactionMinimalPerf.default 405 416 0.97:1
FlexMinimalPerf.default 297 308 0.96:1
AccordionMinimalPerf.default 158 167 0.95:1
HeaderMinimalPerf.default 362 380 0.95:1
Icon.Fluent 689 729 0.95:1
Image.Fluent 378 398 0.95:1
ButtonSlotsPerf.default 563 601 0.94:1
TableMinimalPerf.default 414 440 0.94:1

@size-auditor
Copy link

size-auditor bot commented Nov 20, 2020

Asset size changes

⚠️ Insufficient baseline data to detect size changes

Unable to find bundle size details for Baseline commit: 2b7e562

Possible causes

  • The baseline build 2b7e562 is broken
  • The Size Auditor run for the baseline build 2b7e562 was not triggered

Recommendations

  • Please merge your branch for this Pull request with the latest master build and commit your changes once again

@chrisdholt chrisdholt force-pushed the users/chhol/ensure-all-components-leverage-body-font-var branch from dfd7cd1 to 9541c0a Compare November 20, 2020 21:57
@chrisdholt chrisdholt merged commit b3be4d7 into microsoft:master Nov 20, 2020
@chrisdholt chrisdholt deleted the users/chhol/ensure-all-components-leverage-body-font-var branch November 20, 2020 22:51
@msft-github-bot
Copy link
Contributor

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

Handy links:

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.

None yet

3 participants