Feat: Skip unneeded intermediate step path commands

src/lib/curve/step.js

@@ -5,8 +5,11 @@ export const stepX = (points) =>
       const p0 = points[i - 1]
       const dx = p1[0] - p0[0]
       const dy = p1[1] - p0[1]
-      if (dx === 0 && dy === 0) return m
-      return m.concat(["h", dx, "v", dy])
+
+      if (dx !== 0) m.push("h", dx)
+      if (dy !== 0) m.push("v", dy)
+
+      return m
     }
   }, [])
 
@@ -17,8 +20,11 @@ export const stepY = (points) =>
       const p0 = points[i - 1]
       const dx = p1[0] - p0[0]
       const dy = p1[1] - p0[1]
-      if (dx === 0 && dy === 0) return m
-      return m.concat(["v", dy, "h", dx])
+
+      if (dy !== 0) m.push("v", dy)
+      if (dx !== 0) m.push("h", dx)
+
+      return m
     }
   }, [])
 
@@ -27,10 +33,14 @@ export const stepMidX = (points) =>
     if (i === 0) return m.concat("M", p1)
     else {
       const p0 = points[i - 1]
-      const dx = p1[0] - p0[0]
+      const dx = (p1[0] - p0[0]) / 2
       const dy = p1[1] - p0[1]
-      if (dx === 0 && dy === 0) return m
-      return m.concat(["h", dx / 2, "v", dy, "h", dx / 2])
+
+      if (dx !== 0) m.push("h", dx)
+      if (dy !== 0) m.push("v", dy)
+      if (dx !== 0) m.push("h", dx)
+
+      return m
     }
   }, [])
 
@@ -40,8 +50,12 @@ export const stepMidY = (points) =>
     else {
       const p0 = points[i - 1]
       const dx = p1[0] - p0[0]
-      const dy = p1[1] - p0[1]
-      if (dx === 0 && dy === 0) return m
-      return m.concat(["v", dy / 2, "h", dx, "v", dy / 2])
+      const dy = (p1[1] - p0[1]) / 2
+
+      if (dy !== 0) m.push("v", dy)
+      if (dx !== 0) m.push("h", dx)
+      if (dy !== 0) m.push("v", dy)
+
+      return m
     }
   }, [])

test/lib/curve.test.js

@@ -19,19 +19,19 @@ describe("curve", () => {
   })
 
   test("renders stepX curve", () => {
-    expect(curve.stepX(points)).toBe("M0 0h1v0h1v3h0v-1")
+    expect(curve.stepX(points)).toBe("M0 0h1h1v3v-1")
   })
 
   test("renders stepY curve", () => {
-    expect(curve.stepY(points)).toBe("M0 0v0h1v3h1v-1h0")
+    expect(curve.stepY(points)).toBe("M0 0h1v3h1v-1")
   })
 
   test("renders stepMidX curve", () => {
-    expect(curve.stepMidX(points)).toBe("M0 0h0.5v0h0.5h0.5v3h0.5h0v-1h0")
+    expect(curve.stepMidX(points)).toBe("M0 0h0.5h0.5h0.5v3h0.5v-1")
   })
 
   test("renders stepMidY curve", () => {
-    expect(curve.stepMidY(points)).toBe("M0 0v0h1v0v1.5h1v1.5v-0.5h0v-0.5")
+    expect(curve.stepMidY(points)).toBe("M0 0h1v1.5h1v1.5v-0.5v-0.5")
   })
 
   test("renders monotone curve", () => {