Fix isPivotItem check for IE11

[behowell]

Pull request checklist

• Addresses an existing issue: Fixes getLinkItems method from Pivot crashes the web app in IE11 #19190
• Include a change request file using $ yarn change

Description of changes

The isPivotItem check relies on the Function.name prop to check the type of PivotItem; however, that is not available in IE11. The v7 version most likely works because it includes a falsey-check for item as well, so it doesn't return true for null/undefined items. In v8, that falsey check was removed and it relies only on the Function.name prop.

Fix: add a React.isValidElement check to isPivotItem so it doesn't return true for null or non-react items. It'll still incorrectly return true for non-PivotItems on IE11. However, that type of error is a developer mistake and generates a warning on newer browsers.

[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 500780a:

Sandbox	Source
Fluent UI React Starter	Configuration

[fabricteam]

📊 Bundle size report

_{🤖 This report was generated against c55f2388771a2e169c5f8cf0a1f1441e6ef28d15}

[size-auditor]

Asset size changes

Project	Bundle	Baseline Size	New Size	Difference
office-ui-fabric-react	fluentui-react-Pivot	174.437 kB	174.425 kB	-12 bytes

 Over Tolerance (1024 B)  Over Baseline  Below Baseline  New   Removed 1 kB = 1000 B

Baseline commit: c55f2388771a2e169c5f8cf0a1f1441e6ef28d15 (build)

[fabricteam]

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	886	872	5000
BaseButton	mount	972	982	5000
Breadcrumb	mount	2700	2717	1000
ButtonNext	mount	500	452	5000
Checkbox	mount	1787	1922	5000
CheckboxBase	mount	1553	1422	5000
ChoiceGroup	mount	5285	5574	5000
ComboBox	mount	1081	1099	1000
CommandBar	mount	10681	10640	1000
ContextualMenu	mount	6347	6535	1000
DefaultButton	mount	1281	1247	5000
DetailsRow	mount	4088	3921	5000
DetailsRowFast	mount	4063	3965	5000
DetailsRowNoStyles	mount	3752	3744	5000
Dialog	mount	2317	2289	1000
DocumentCardTitle	mount	164	169	1000
Dropdown	mount	3581	3652	5000
FluentProviderNext	mount	7557	7555	5000
FocusTrapZone	mount	1905	1831	5000
FocusZone	mount	1858	1853	5000
IconButton	mount	2010	1926	5000
Label	mount	376	364	5000
Layer	mount	2013	1980	5000
Link	mount	515	498	5000
MakeStyles	mount	1862	1877	50000
MenuButton	mount	1674	1625	5000
MessageBar	mount	2127	2169	5000
Nav	mount	3540	3542	1000
OverflowSet	mount	1167	1166	5000
Panel	mount	2156	2223	1000
Persona	mount	900	841	1000
Pivot	mount	1508	1546	1000
PrimaryButton	mount	1378	1422	5000
Rating	mount	8795	8412	5000
SearchBox	mount	1428	1467	5000
Shimmer	mount	2867	2851	5000
Slider	mount	2097	2084	5000
SpinButton	mount	5202	5334	5000
Spinner	mount	421	436	5000
SplitButton	mount	3497	3387	5000
Stack	mount	563	651	5000
StackWithIntrinsicChildren	mount	1737	1849	5000
StackWithTextChildren	mount	4907	5194	5000
SwatchColorPicker	mount	11064	10665	5000
Tabs	mount	1516	1509	1000
TagPicker	mount	2791	2846	5000
TeachingBubble	mount	12849	12217	5000
Text	mount	455	469	5000
TextField	mount	1522	1528	5000
ThemeProvider	mount	1313	1282	5000
ThemeProvider	virtual-rerender	628	624	5000
Toggle	mount	858	886	5000
buttonNative	mount	119	116	5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
SegmentMinimalPerf.default	408	374	1.09:1
TableMinimalPerf.default	468	430	1.09:1
FlexMinimalPerf.default	315	293	1.08:1
AvatarMinimalPerf.default	233	217	1.07:1
ListWith60ListItems.default	715	668	1.07:1
TextMinimalPerf.default	392	367	1.07:1
TreeWith60ListItems.default	185	173	1.07:1
AccordionMinimalPerf.default	186	175	1.06:1
ChatMinimalPerf.default	729	689	1.06:1
ImageMinimalPerf.default	423	398	1.06:1
AlertMinimalPerf.default	315	301	1.05:1
BoxMinimalPerf.default	394	375	1.05:1
ButtonMinimalPerf.default	191	182	1.05:1
ChatWithPopoverPerf.default	401	382	1.05:1
DividerMinimalPerf.default	397	379	1.05:1
ListMinimalPerf.default	577	548	1.05:1
ReactionMinimalPerf.default	427	406	1.05:1
CardMinimalPerf.default	635	610	1.04:1
DialogMinimalPerf.default	815	787	1.04:1
GridMinimalPerf.default	375	362	1.04:1
HeaderMinimalPerf.default	397	380	1.04:1
HeaderSlotsPerf.default	857	822	1.04:1
RadioGroupMinimalPerf.default	496	477	1.04:1
ToolbarMinimalPerf.default	1085	1041	1.04:1
AttachmentSlotsPerf.default	1181	1146	1.03:1
CarouselMinimalPerf.default	507	494	1.03:1
AttachmentMinimalPerf.default	183	179	1.02:1
ButtonOverridesMissPerf.default	1840	1805	1.02:1
DropdownMinimalPerf.default	3260	3182	1.02:1
FormMinimalPerf.default	464	454	1.02:1
InputMinimalPerf.default	1328	1296	1.02:1
ListNestedPerf.default	600	586	1.02:1
PortalMinimalPerf.default	181	178	1.02:1
RefMinimalPerf.default	246	242	1.02:1
SkeletonMinimalPerf.default	411	401	1.02:1
TooltipMinimalPerf.default	1100	1076	1.02:1
ListCommonPerf.default	693	685	1.01:1
RosterPerf.default	1266	1251	1.01:1
ProviderMinimalPerf.default	1089	1079	1.01:1
SplitButtonMinimalPerf.default	4114	4093	1.01:1
TableManyItemsPerf.default	2128	2102	1.01:1
CustomToolbarPrototype.default	4077	4036	1.01:1
CheckboxMinimalPerf.default	2866	2866	1:1
DropdownManyItemsPerf.default	737	737	1:1
EmbedMinimalPerf.default	4325	4345	1:1
ItemLayoutMinimalPerf.default	1305	1302	1:1
LabelMinimalPerf.default	411	410	1:1
LayoutMinimalPerf.default	388	387	1:1
MenuButtonMinimalPerf.default	1791	1783	1:1
PopupMinimalPerf.default	617	614	1:1
SliderMinimalPerf.default	1695	1694	1:1
AnimationMinimalPerf.default	461	466	0.99:1
ButtonSlotsPerf.default	594	599	0.99:1
MenuMinimalPerf.default	892	897	0.99:1
StatusMinimalPerf.default	748	755	0.99:1
IconMinimalPerf.default	649	657	0.99:1
TreeMinimalPerf.default	888	895	0.99:1
TextAreaMinimalPerf.default	556	568	0.98:1
VideoMinimalPerf.default	715	729	0.98:1
LoaderMinimalPerf.default	723	747	0.97:1
ProviderMergeThemesPerf.default	1686	1747	0.97:1
ChatDuplicateMessagesPerf.default	311	329	0.95:1
DatepickerMinimalPerf.default	5678	5992	0.95:1

[ecraig12345]

I tried this together with my change and it seems to work.

[msft-fluent-ui-bot]

🎉@fluentui/[email protected] has been released which incorporates this pull request.:tada:

Handy links:

• Release Notes
• Official NPM Release