react-portal Spec

[ling1726]

Adds a spec for Portal convergd component

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)

[size-auditor]

Asset size changes

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

Baseline commit: 6c420a1553ba7b0e447f50827cc3349bf8d79f42 (build)

[codesandbox-ci]

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 9e13876:

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

[fabricteam]

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	885	894	5000
BaseButton	mount	883	898	5000
Breadcrumb	mount	2604	2649	1000
ButtonNext	mount	528	543	5000
Checkbox	mount	1572	1525	5000
CheckboxBase	mount	1284	1288	5000
ChoiceGroup	mount	4706	4694	5000
ComboBox	mount	977	979	1000
CommandBar	mount	10114	10111	1000
ContextualMenu	mount	6232	6166	1000
DefaultButton	mount	1127	1118	5000
DetailsRow	mount	3706	3700	5000
DetailsRowFast	mount	3741	3726	5000
DetailsRowNoStyles	mount	3434	3488	5000
Dialog	mount	1459	1461	1000
DocumentCardTitle	mount	145	142	1000
Dropdown	mount	3191	3466	5000
FocusTrapZone	mount	1806	1865	5000
FocusZone	mount	1814	1812	5000
IconButton	mount	1743	1713	5000
Label	mount	333	346	5000
Layer	mount	1766	1776	5000
Link	mount	475	469	5000
MakeStyles	mount	1814	1781	50000
MenuButton	mount	1454	1483	5000
MessageBar	mount	1973	2020	5000
Nav	mount	3282	3236	1000
OverflowSet	mount	1044	1032	5000
Panel	mount	1405	1428	1000
Persona	mount	831	821	1000
Pivot	mount	1427	1390	1000
PrimaryButton	mount	1285	1300	5000
Rating	mount	7534	7497	5000
SearchBox	mount	1293	1294	5000
Shimmer	mount	2504	2503	5000
Slider	mount	1920	1948	5000
SpinButton	mount	4929	4918	5000
Spinner	mount	408	414	5000
SplitButton	mount	3156	3137	5000
Stack	mount	502	499	5000
StackWithIntrinsicChildren	mount	1531	1515	5000
StackWithTextChildren	mount	4498	4500	5000
SwatchColorPicker	mount	10122	10230	5000
Tabs	mount	1394	1518	1000
TagPicker	mount	2407	2415	5000
TeachingBubble	mount	11949	11853	5000
Text	mount	416	420	5000
TextField	mount	1359	1337	5000
ThemeProvider	mount	1184	1169	5000
ThemeProvider	virtual-rerender	599	605	5000
ThemeProviderNext	mount	9139	9197	5000
Toggle	mount	802	806	5000
buttonNative	mount	122	111	5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
PortalMinimalPerf.default	173	156	1.11:1
ListMinimalPerf.default	511	482	1.06:1
RefMinimalPerf.default	246	233	1.06:1
IconMinimalPerf.default	611	578	1.06:1
SkeletonMinimalPerf.default	366	348	1.05:1
FlexMinimalPerf.default	287	277	1.04:1
HeaderMinimalPerf.default	368	355	1.04:1
ImageMinimalPerf.default	385	369	1.04:1
LayoutMinimalPerf.default	366	353	1.04:1
VideoMinimalPerf.default	621	596	1.04:1
AlertMinimalPerf.default	274	267	1.03:1
AnimationMinimalPerf.default	416	405	1.03:1
ButtonUseCssNestingPerf.default	1080	1050	1.03:1
DividerMinimalPerf.default	358	347	1.03:1
FormMinimalPerf.default	396	384	1.03:1
HeaderSlotsPerf.default	775	749	1.03:1
InputMinimalPerf.default	1282	1243	1.03:1
ListNestedPerf.default	553	535	1.03:1
BoxMinimalPerf.default	347	341	1.02:1
ButtonMinimalPerf.default	168	164	1.02:1
ChatDuplicateMessagesPerf.default	297	292	1.02:1
LoaderMinimalPerf.default	697	681	1.02:1
RadioGroupMinimalPerf.default	436	429	1.02:1
TextMinimalPerf.default	349	343	1.02:1
ButtonOverridesMissPerf.default	1674	1660	1.01:1
ButtonUseCssPerf.default	788	778	1.01:1
ChatWithPopoverPerf.default	368	366	1.01:1
ItemLayoutMinimalPerf.default	1250	1234	1.01:1
ListCommonPerf.default	624	620	1.01:1
MenuMinimalPerf.default	836	830	1.01:1
PopupMinimalPerf.default	714	704	1.01:1
StatusMinimalPerf.default	666	659	1.01:1
ToolbarMinimalPerf.default	935	928	1.01:1
TooltipMinimalPerf.default	944	939	1.01:1
AttachmentMinimalPerf.default	153	153	1:1
AttachmentSlotsPerf.default	1119	1119	1:1
DatepickerMinimalPerf.default	5345	5368	1:1
DialogMinimalPerf.default	719	718	1:1
EmbedMinimalPerf.default	4123	4119	1:1
GridMinimalPerf.default	338	338	1:1
MenuButtonMinimalPerf.default	1536	1532	1:1
SliderMinimalPerf.default	1545	1542	1:1
SplitButtonMinimalPerf.default	3674	3683	1:1
TableManyItemsPerf.default	1857	1856	1:1
TableMinimalPerf.default	400	399	1:1
TextAreaMinimalPerf.default	477	476	1:1
TreeMinimalPerf.default	768	769	1:1
AccordionMinimalPerf.default	140	141	0.99:1
CardMinimalPerf.default	542	546	0.99:1
CarouselMinimalPerf.default	446	452	0.99:1
ChatMinimalPerf.default	591	595	0.99:1
DropdownManyItemsPerf.default	679	684	0.99:1
DropdownMinimalPerf.default	3055	3079	0.99:1
RosterPerf.default	1148	1154	0.99:1
ProviderMergeThemesPerf.default	1645	1662	0.99:1
SegmentMinimalPerf.default	338	341	0.99:1
TreeWith60ListItems.default	170	172	0.99:1
AvatarMinimalPerf.default	185	188	0.98:1
ButtonSlotsPerf.default	530	541	0.98:1
CheckboxMinimalPerf.default	2693	2759	0.98:1
LabelMinimalPerf.default	374	380	0.98:1
ProviderMinimalPerf.default	985	1005	0.98:1
ReactionMinimalPerf.default	377	385	0.98:1
CustomToolbarPrototype.default	3719	3797	0.98:1
ListWith60ListItems.default	612	658	0.93:1