Fix issue where bezier paths could be closed incorrectly (#2418)

Author: calda

Sources/Private/Utility/Primitives/BezierPath.swift

@@ -343,7 +343,14 @@ extension BezierPath: Codable {
       totalLength = totalLength + pathElement.length
     }
     if closed {
-      let closeElement = previousElement.pathElementTo(firstVertex)
+      // Don't use an out tangent for the closing point, since the
+      // closing point is exactly equal to the starting point.
+      let closeVertex = CurveVertex(
+        point: firstVertex.point,
+        inTangentRelative: firstVertex.inTangentRelative,
+        outTangentRelative: .zero)
+
+      let closeElement = previousElement.pathElementTo(closeVertex)
       decodedElements.append(closeElement)
       totalLength = totalLength + closeElement.length
     }
@@ -448,7 +455,14 @@ extension BezierPath: AnyInitializable {
       totalLength = totalLength + pathElement.length
     }
     if closed {
-      let closeElement = previousElement.pathElementTo(firstVertex)
+      // Don't use an out tangent for the closing point, since the
+      // closing point is exactly equal to the starting point.
+      let closeVertex = CurveVertex(
+        point: firstVertex.point,
+        inTangentRelative: firstVertex.inTangentRelative,
+        outTangentRelative: .zero)
+
+      let closeElement = previousElement.pathElementTo(closeVertex)
       decodedElements.append(closeElement)
       totalLength = totalLength + closeElement.length
     }

Tests/Samples/Issues/issue_2342.json

@@ -0,0 +1 @@
+{"v":"5.6.9","fr":24,"ip":0,"op":32,"w":136,"h":136,"nm":"loading_video123","ddd":0,"assets":[{"id":"image_0","w":136,"h":136,"u":"images/","p":"img_0.png","e":0}],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"形状图层 6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[69.125,67,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[51.082,51.082],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"椭圆路径 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":14,"ix":5},"lc":2,"lj":1,"ml":4,"bm":0,"nm":"描边 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0.721568644047,0.721568644047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"填充 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[-1.767,-2.399],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"变换"}],"nm":"椭圆 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"tm","s":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":16,"s":[0]},{"t":32,"s":[100]}],"ix":1},"e":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[0]},{"t":16,"s":[100]}],"ix":2},"o":{"a":0,"k":0,"ix":3},"m":1,"ix":2,"nm":"修剪路径 1","mn":"ADBE Vector Filter - Trim","hd":false}],"ip":0,"op":192,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Mask","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[244.052,-71.582,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[22.39,0],[0,40.91],[0,0],[0,0],[0,0],[0,0]],"o":[[-22.39,0],[0,0],[0,0],[0,0],[0,0],[0,40.91]],"v":[[0.1,63.5],[-59.5,-0.1],[-59.5,-41.08],[0.1,-63.5],[59.5,-41.08],[59.5,-0.1]],"c":true},"ix":2},"nm":"路径 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"rd","nm":"圆角 1","r":{"a":0,"k":15.356,"ix":1},"ix":2,"mn":"ADBE Vector Filter - RC","hd":false},{"ty":"st","c":{"a":0,"k":[1,0.933333337307,0.635294139385,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":6,"ix":5},"lc":2,"lj":1,"ml":4,"bm":0,"nm":"描边 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[-176.302,139.082],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"变换"}],"nm":"Mask","np":4,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":120,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":2,"nm":"loading.png","cl":"png","refId":"image_0","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[68,67,0],"ix":2},"a":{"a":0,"k":[68,68,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ip":0,"op":192,"st":0,"bm":0}],"markers":[]}

Tests/__Snapshots__/AutomaticEngineTests/testAutomaticEngineDetection.Issues-issue_2342.txt

@@ -0,0 +1,2 @@
+Does not support Core Animation engine. Encountered compatibility issues:
+[形状图层 6.修剪路径 1] The Core Animation rendering engine doesn't currently support applying trims to filled shapes (only stroked shapes).