Repository: hustcc/jest-canvas-mock
Pull request #76 (2020-12-21 11:45:13)

optimize(Path2D): replace reassign-concat with for-push

coveralls: 
[![Coverage Status](https://coveralls.io/builds/35861728/badge)](https://coveralls.io/builds/35861728)

Coverage decreased (-0.06%) to 99.935% when pulling **2861ccf824015b5c5c0f4bb6567f9e6e395ab084 on milahu:patch-2** into **c4d1fb2981b00415b465701f63a488666fd2e825 on hustcc:master**.

jtenner: This might be a valid performance gain, with the trade-off that the software becomes less simple. Also, why did code coverage decrease?
jtenner: @milahu I think this might be another micro-optimization, however, it's probably fine.

https://coveralls.io/builds/35861728/source?filename=src%2Fclasses%2FPath2D.js#L43

Please address this code coverage issue if you can. We need to add a way to validate that push gets called. 
milahu: sorry .. note to self: run tests offline

Patch:
diff --git a/package.json b/package.json
index c7005d9..219a31a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "jest-canvas-mock",
-  "version": "2.2.0",
+  "version": "2.3.1",
   "description": "Mock a canvas in your jest tests.",
   "main": "lib/index.js",
   "types": "types/index.d.ts",
@@ -16,6 +16,7 @@
     "moo-color": "^1.0.2"
   },
   "devDependencies": {
+    "@antv/g2plot": "^2.3.11",
     "@babel/cli": "^7.8.4",
     "@babel/core": "^7.9.0",
     "@babel/plugin-proposal-class-properties": "^7.8.3",
diff --git a/src/classes/CanvasRenderingContext2D.js b/src/classes/CanvasRenderingContext2D.js
index d6b897e..08cfddf 100644
--- a/src/classes/CanvasRenderingContext2D.js
+++ b/src/classes/CanvasRenderingContext2D.js
@@ -1639,7 +1639,7 @@ export default class CanvasRenderingContext2D {
     result = this._lineDashStack[this._stackIndex] =
       result.length % 2 === 1 ? result.concat(result) : result;
     const event = createCanvasEvent('setLineDash', getTransformSlice(this), {
-      value: result.slice(),
+      segments: result.slice(),
     });
     this._events.push(event);
   }
diff --git a/src/classes/Path2D.js b/src/classes/Path2D.js
index 2d984e8..01dc12d 100644
--- a/src/classes/Path2D.js
+++ b/src/classes/Path2D.js
@@ -39,6 +39,7 @@ export default class Path2D {
       throw new TypeError(
         "Failed to execute 'addPath' on 'Path2D': parameter 1 is not of type 'Path2D'."
       );
-    this._path = this._path.concat(path._path);
+    for (let i = 0; i < path._path.length; i++)
+      this._path.push(path._path[i]);
   }
 }


Test patch:
diff --git a/__tests__/classes/Path2D.js b/__tests__/classes/Path2D.js
index 71fef0e..95fe505 100644
--- a/__tests__/classes/Path2D.js
+++ b/__tests__/classes/Path2D.js
@@ -58,4 +58,19 @@ describe('Path2D', () => {
     mockWindow(window);
     expect(saved === window.Path2D).toBe(true);
   });
+
+  test('Path2D addPath calls _path.push', () => {
+    const path1 = new Path2D();
+    path1.moveTo(10, 10);
+    path1.lineTo(20, 20);
+    const path2 = new Path2D();
+    path2.moveTo(30, 30);
+    path2.lineTo(40, 40);
+    expect(path1._path.length).toBe(2);
+    path1.addPath(path2);
+    expect(path1._path.length).toBe(4);
+    expect(path1._path[2]).toBe(path2._path[0]);
+    expect(path1._path[3]).toBe(path2._path[1]);
+  });
+
 });
diff --git a/__tests__/classes/__snapshots__/CanvasRenderingContext2D.__getEvents.js.snap b/__tests__/classes/__snapshots__/CanvasRenderingContext2D.__getEvents.js.snap
index 4989694..3e531ef 100644
--- a/__tests__/classes/__snapshots__/CanvasRenderingContext2D.__getEvents.js.snap
+++ b/__tests__/classes/__snapshots__/CanvasRenderingContext2D.__getEvents.js.snap
@@ -1561,7 +1561,7 @@ exports[`__getEvents should have an event when setLineDash is called 1`] = `
 Array [
   Object {
     "props": Object {
-      "value": Array [
+      "segments": Array [
         1,
         2,
         3,
diff --git a/__tests__/vis.js b/__tests__/vis.js
new file mode 100644
index 0000000..3dd8925
--- /dev/null
+++ b/__tests__/vis.js
@@ -0,0 +1,29 @@
+/**
+ * test vis @AntV/G2Plot
+ */
+
+import { Line } from '@antv/g2plot';
+
+describe('vis', () => {
+  it('vis can pass', () => {
+    const div = document.createElement('canvas');
+
+    const line = new Line(div, {
+      data: [
+        { x: 'A', y: 10 },
+        { x: 'B', y: 20 },
+        { x: 'C', y: 30 },
+      ],
+      xField: 'x',
+      yField: 'y',
+    });
+
+    line.render();
+
+    expect(line.container.querySelector('canvas')).not.toBe(null);
+
+    line.destroy();
+
+    expect(line.container.querySelector('canvas')).toBe(null);
+  });
+});