@fluentui/react-button - Adding conformance tests to components

[sopranopillow]

Pull request checklist

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

Description of changes

This PR adds two test to the components Button and Toggle Button. The tests use the new isConformant() function from @fluentui/react-conformance package. Since there wasn't a setup for jest, this PR also adds initial setup for jest.

Note: After #13686 is merged the moduleNameMapper should be modified.

[msft-github-bot]

Perf Analysis

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
BaseButton	mount	895	891	5000
ButtonNext	mount	535	516	5000
Checkbox	mount	1673	1656	5000
CheckboxBase	mount	1374	1342	5000
CheckboxNext	mount	1692	1677	5000
ChoiceGroup	mount	5070	5159	5000
ComboBox	mount	1039	969	1000
CommandBar	mount	7890	7822	1000
ContextualMenu	mount	13909	13412	1000
DefaultButton	mount	1164	1132	5000
DetailsRow	mount	3606	3692	5000
DetailsRowFast	mount	3638	3687	5000
DetailsRowNoStyles	mount	3392	3402	5000
Dialog	mount	1534	1505	1000
DocumentCardTitle	mount	1853	1851	1000
Dropdown	mount	2515	2471	5000
FocusZone	mount	1821	1869	5000
IconButton	mount	1815	1797	5000
Label	mount	353	369	5000
Link	mount	516	510	5000
LinkNext	mount	528	512	5000
MenuButton	mount	1444	1452	5000
Nav	mount	3285	3350	1000
Panel	mount	1502	1502	1000
Persona	mount	859	861	1000
Pivot	mount	1451	1449	1000
PivotNext	mount	1416	1372	1000
PrimaryButton	mount	1278	1246	5000
SearchBox	mount	1292	1297	5000
Slider	mount	1580	1607	5000
SliderNext	mount	2014	2013	5000
Spinner	mount	477	440	5000
SplitButton	mount	3240	3207	5000
Stack	mount	533	529	5000
StackWithIntrinsicChildren	mount	1913	1938	5000
StackWithTextChildren	mount	5128	5096	5000
TagPicker	mount	2833	2915	5000
Text	mount	426	448	5000
TextField	mount	1422	1432	5000
ThemeProvider	mount	2793	2810	5000
ThemeProvider	virtual-rerender	520	512	5000
Toggle	mount	932	935	5000
ToggleNext	mount	913	915	5000
button	mount	112	115	5000

Perf Analysis (Fluent)

⚠️ 1 potential perf regressions detected

Potential regressions comparing to master

Scenario	Current PR Ticks	Baseline Ticks	Ratio	Regression Analysis
AccordionMinimalPerf.default	130	132	0.98:1	analysis

Perf comparison

Status	Scenario	Fluent TPI	Fabric TPI	Ratio	Iterations	Ticks
🎯	Avatar.Fluent	0.45	0.49	0.92:1	2000	900
🦄	Button.Fluent	0.11	0.19	0.58:1	5000	544
🔧	Checkbox.Fluent	0.65	0.35	1.86:1	1000	649
🦄	Dialog.Fluent	0.15	0.22	0.68:1	5000	733
🔧	Dropdown.Fluent	3.37	0.45	7.49:1	1000	3374
🔧	Icon.Fluent	0.14	0.05	2.8:1	5000	706
🦄	Image.Fluent	0.07	0.11	0.64:1	5000	343
🔧	Slider.Fluent	1.61	0.36	4.47:1	1000	1613
🔧	Text.Fluent	0.07	0.03	2.33:1	5000	350
🦄	Tooltip.Fluent	0.1	18.72	0.01:1	5000	500

🔧 Needs work     🎯 On target     🦄 Amazing

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
PortalMinimalPerf.default	119	111	1.07:1
RefMinimalPerf.default	216	201	1.07:1
AvatarMinimalPerf.default	512	483	1.06:1
Checkbox.Fluent	649	614	1.06:1
AnimationMinimalPerf.default	391	371	1.05:1
AttachmentMinimalPerf.default	149	142	1.05:1
IconMinimalPerf.default	673	641	1.05:1
ButtonMinimalPerf.default	170	163	1.04:1
CarouselMinimalPerf.default	456	438	1.04:1
ReactionMinimalPerf.default	382	369	1.04:1
FlexMinimalPerf.default	293	284	1.03:1
ImageMinimalPerf.default	377	367	1.03:1
ListWith60ListItems.default	1102	1067	1.03:1
LoaderMinimalPerf.default	729	711	1.03:1
MenuMinimalPerf.default	865	836	1.03:1
TextMinimalPerf.default	349	339	1.03:1
ChatWithPopoverPerf.default	469	461	1.02:1
DialogMinimalPerf.default	746	731	1.02:1
FormMinimalPerf.default	388	379	1.02:1
HeaderSlotsPerf.default	788	775	1.02:1
MenuButtonMinimalPerf.default	1482	1460	1.02:1
StatusMinimalPerf.default	661	649	1.02:1
TextAreaMinimalPerf.default	469	460	1.02:1
VideoMinimalPerf.default	589	580	1.02:1
AlertMinimalPerf.default	290	288	1.01:1
ButtonSlotsPerf.default	602	595	1.01:1
CardMinimalPerf.default	553	547	1.01:1
ChatDuplicateMessagesPerf.default	441	436	1.01:1
LabelMinimalPerf.default	399	397	1.01:1
ListCommonPerf.default	941	933	1.01:1
ListMinimalPerf.default	471	467	1.01:1
PopupMinimalPerf.default	644	637	1.01:1
SliderMinimalPerf.default	1610	1587	1.01:1
CustomToolbarPrototype.default	4049	4004	1.01:1
TreeMinimalPerf.default	853	842	1.01:1
TreeWith60ListItems.default	219	217	1.01:1
Dropdown.Fluent	3374	3356	1.01:1
Icon.Fluent	706	702	1.01:1
Slider.Fluent	1613	1596	1.01:1
Tooltip.Fluent	500	494	1.01:1
ChatMinimalPerf.default	585	586	1:1
DividerMinimalPerf.default	340	341	1:1
DropdownManyItemsPerf.default	1402	1403	1:1
DropdownMinimalPerf.default	3322	3322	1:1
EmbedMinimalPerf.default	1885	1888	1:1
HierarchicalTreeMinimalPerf.default	411	412	1:1
ListNestedPerf.default	877	875	1:1
ProviderMinimalPerf.default	860	859	1:1
SegmentMinimalPerf.default	330	329	1:1
SplitButtonMinimalPerf.default	3662	3652	1:1
TableManyItemsPerf.default	2188	2188	1:1
Avatar.Fluent	900	900	1:1
Text.Fluent	350	350	1:1
AttachmentSlotsPerf.default	1118	1125	0.99:1
BoxMinimalPerf.default	320	322	0.99:1
InputMinimalPerf.default	1034	1040	0.99:1
ItemLayoutMinimalPerf.default	1327	1336	0.99:1
ProviderMergeThemesPerf.default	2154	2170	0.99:1
RadioGroupMinimalPerf.default	395	397	0.99:1
ToolbarMinimalPerf.default	934	943	0.99:1
TooltipMinimalPerf.default	743	754	0.99:1
Button.Fluent	544	548	0.99:1
Dialog.Fluent	733	738	0.99:1
CheckboxMinimalPerf.default	2788	2832	0.98:1
GridMinimalPerf.default	650	663	0.98:1
LayoutMinimalPerf.default	396	403	0.98:1
TableMinimalPerf.default	385	400	0.96:1
Image.Fluent	343	360	0.95:1
HeaderMinimalPerf.default	351	372	0.94:1

[size-auditor]

Asset size changes

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

Baseline commit: 8800f1cab6daba604e97652c87c3a134994f8887 (build)

[dzearing]

yay!