(web-components) fix transform fragment script issues causing template issues in the bundle

[chrisdholt]

Pull request checklist

• Addresses an existing issue: fixes [web-components] Tooltip: position relative to anchor is incorrect #19221
• Include a change request file using $ yarn change

Description of changes

Fixes transform fragments script to address incorrect spacing which breaks certain templates.

Focus areas to test

(optional)

[fabricteam]

📊 Bundle size report

_{🤖 This report was generated against e6ee3ff194c59ee27e853387fad06f161e63652c}

[size-auditor]

Asset size changes

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

Baseline commit: e6ee3ff194c59ee27e853387fad06f161e63652c (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 ead5097:

Sandbox	Source
Fluent UI React Starter	Configuration

[fabricteam]

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	852	856	5000
BaseButton	mount	867	839	5000
Breadcrumb	mount	2478	2511	1000
ButtonNext	mount	404	399	5000
Checkbox	mount	1431	1441	5000
CheckboxBase	mount	1223	1225	5000
ChoiceGroup	mount	4497	4526	5000
ComboBox	mount	944	935	1000
CommandBar	mount	9668	9635	1000
ContextualMenu	mount	5913	5879	1000
DefaultButton	mount	1059	1047	5000
DetailsRow	mount	3478	3482	5000
DetailsRowFast	mount	3513	3521	5000
DetailsRowNoStyles	mount	3301	3366	5000
Dialog	mount	2025	2028	1000
DocumentCardTitle	mount	126	136	1000
Dropdown	mount	3018	3041	5000
FluentProviderNext	mount	7214	7262	5000
FocusTrapZone	mount	1680	1700	5000
FocusZone	mount	1711	1701	5000
IconButton	mount	1644	1640	5000
Label	mount	314	321	5000
Layer	mount	1646	1667	5000
Link	mount	440	443	5000
MakeStyles	mount	1709	1710	50000
MenuButton	mount	1395	1381	5000
MessageBar	mount	1899	1890	5000
Nav	mount	3101	3053	1000
OverflowSet	mount	1065	1052	5000
Panel	mount	1975	1943	1000
Persona	mount	756	781	1000
Pivot	mount	1329	1324	1000
PrimaryButton	mount	1196	1176	5000
Rating	mount	7196	7252	5000
SearchBox	mount	1233	1242	5000
Shimmer	mount	2430	2420	5000
Slider	mount	1866	1858	5000
SpinButton	mount	4716	4746	5000
Spinner	mount	410	393	5000
SplitButton	mount	3010	3014	5000
Stack	mount	474	467	5000
StackWithIntrinsicChildren	mount	1509	1460	5000
StackWithTextChildren	mount	4313	4320	5000
SwatchColorPicker	mount	9767	9771	5000
Tabs	mount	1333	1327	1000
TagPicker	mount	2409	2401	5000
TeachingBubble	mount	11304	11351	5000
Text	mount	394	384	5000
TextField	mount	1299	1281	5000
ThemeProvider	mount	1117	1121	5000
ThemeProvider	virtual-rerender	564	571	5000
Toggle	mount	770	757	5000
buttonNative	mount	112	113	5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
ChatDuplicateMessagesPerf.default	275	255	1.08:1
AlertMinimalPerf.default	253	236	1.07:1
RadioGroupMinimalPerf.default	436	412	1.06:1
ReactionMinimalPerf.default	349	330	1.06:1
HeaderMinimalPerf.default	351	333	1.05:1
AttachmentMinimalPerf.default	146	140	1.04:1
CardMinimalPerf.default	522	501	1.04:1
CarouselMinimalPerf.default	439	421	1.04:1
ChatMinimalPerf.default	618	595	1.04:1
FlexMinimalPerf.default	283	272	1.04:1
HeaderSlotsPerf.default	742	712	1.04:1
SkeletonMinimalPerf.default	337	325	1.04:1
FormMinimalPerf.default	388	378	1.03:1
ListNestedPerf.default	518	505	1.03:1
IconMinimalPerf.default	597	579	1.03:1
TextAreaMinimalPerf.default	479	463	1.03:1
BoxMinimalPerf.default	327	322	1.02:1
ButtonSlotsPerf.default	508	500	1.02:1
CheckboxMinimalPerf.default	2592	2540	1.02:1
DialogMinimalPerf.default	716	701	1.02:1
DropdownManyItemsPerf.default	681	669	1.02:1
InputMinimalPerf.default	1259	1238	1.02:1
MenuButtonMinimalPerf.default	1527	1501	1.02:1
PortalMinimalPerf.default	171	167	1.02:1
AvatarMinimalPerf.default	184	183	1.01:1
ButtonOverridesMissPerf.default	1608	1588	1.01:1
DividerMinimalPerf.default	339	335	1.01:1
EmbedMinimalPerf.default	4090	4053	1.01:1
GridMinimalPerf.default	330	328	1.01:1
LabelMinimalPerf.default	358	353	1.01:1
SegmentMinimalPerf.default	320	317	1.01:1
SplitButtonMinimalPerf.default	3594	3553	1.01:1
TableManyItemsPerf.default	1787	1762	1.01:1
TableMinimalPerf.default	373	369	1.01:1
TextMinimalPerf.default	316	314	1.01:1
ToolbarMinimalPerf.default	892	884	1.01:1
AnimationMinimalPerf.default	385	385	1:1
ButtonMinimalPerf.default	153	153	1:1
DatepickerMinimalPerf.default	5067	5080	1:1
DropdownMinimalPerf.default	3059	3071	1:1
ItemLayoutMinimalPerf.default	1142	1140	1:1
ListWith60ListItems.default	598	596	1:1
CustomToolbarPrototype.default	3666	3674	1:1
TreeMinimalPerf.default	745	742	1:1
VideoMinimalPerf.default	577	577	1:1
AttachmentSlotsPerf.default	990	1002	0.99:1
ListCommonPerf.default	576	583	0.99:1
ListMinimalPerf.default	475	479	0.99:1
LoaderMinimalPerf.default	650	655	0.99:1
MenuMinimalPerf.default	791	796	0.99:1
PopupMinimalPerf.default	552	557	0.99:1
ProviderMinimalPerf.default	954	960	0.99:1
RefMinimalPerf.default	212	214	0.99:1
StatusMinimalPerf.default	621	626	0.99:1
TreeWith60ListItems.default	162	164	0.99:1
SliderMinimalPerf.default	1479	1503	0.98:1
TooltipMinimalPerf.default	959	980	0.98:1
LayoutMinimalPerf.default	335	344	0.97:1
ProviderMergeThemesPerf.default	1596	1643	0.97:1
AccordionMinimalPerf.default	139	145	0.96:1
ChatWithPopoverPerf.default	329	343	0.96:1
ImageMinimalPerf.default	353	368	0.96:1
RosterPerf.default	1040	1122	0.93:1

[msft-fluent-ui-bot]

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

Handy links:

• Release Notes
• Official NPM Release