Fix Group2d getSvgPathData() missing move markers

[lorenzolewis]

Currently for the Group2d.getSvgPathData() method it will take into account the index for the children to determine which is the first when generating SVG paths. I believe this is incorrect because each child as a group should be isolated and not connected. This removes that index check and treats each child as the beginning for when generating SVG data.

Testing

I tested this in a project using 1) Polyline2d followed by 2) CubicBezier2d both added to a Group2d (the cubic bezier curve being added last). You can see in the below screenshot that the end of the poly line (on the left side) is being connected to the cubic bezier.

In the fixed version the cubic bezier is correctly not connecting to the poly line.

Before

<svg class="tl-svg-container">
  <!-- Notice the missing `M` between the `L` and `C` definitions -->
  <path stroke-width="2" stroke="#f2f2f2" fill="none" d="M 0 0 L 100 0  C50, 12.5 50, 12.5 75, 0"></path>
</svg>

After

<svg class="tl-svg-container">
  <!-- Missing `M` now added -->
  <path stroke-width="2" stroke="#f2f2f2" fill="none" d="M 0 0 L 100 0 M 25, 0  C50, 12.5 50, 12.5 75, 0"></path>
</svg>

Change type

• bugfix
• improvement
• feature
• api
• other

Test plan

1. Create a Group2D shape with multiple children
2. Use the getSvgPathData() method
3. Check that the paths are not connected but that each child is indeed distinct

• Unit tests
• End to end tests

Release notes

• Fixed a bug with Group2D.getSvgPathData() so that children in the resulting SVG have their starting points defined correctly.

[vercel]

@lorenzolewis is attempting to deploy a commit to the tldraw Team on Vercel.

A member of the Team first needs to authorize it.

[mimecuvalo]

adding @steveruizok to review - I'm not sure about what the original check was gating for