From 2bb4b27d9dc4c3b8a6ed9d9be3ceef4edca4f9c7 Mon Sep 17 00:00:00 2001
From: Yanyan-Wang <yanyanwang93@gmail.com>
Date: Thu, 26 Nov 2020 21:21:46 +0800
Subject: [PATCH] test: add gforce test spec

---
 tests/unit/layout/gforce-spec.ts | 352 +++++++++++++++++++++++++++++++
 1 file changed, 352 insertions(+)
 create mode 100644 tests/unit/layout/gforce-spec.ts

diff --git a/tests/unit/layout/gforce-spec.ts b/tests/unit/layout/gforce-spec.ts
new file mode 100644
index 0000000000..be65457d90
--- /dev/null
+++ b/tests/unit/layout/gforce-spec.ts
@@ -0,0 +1,352 @@
+import G6 from '../../../src';
+import dataset from './data';
+import * as d3Force from 'd3-force';
+
+const data = dataset.data;
+
+const div = document.createElement('div');
+div.id = 'gforce-layout';
+document.body.appendChild(div);
+
+describe('gforce layout', () => {
+  it('gforce layout with default configs, test emit afterlayout', (done) => {
+    const node = data.nodes[0];
+    const graph = new G6.Graph({
+      container: div,
+      layout: {
+        type: 'gforce',
+        minMovement: 0.2,
+      },
+      width: 500,
+      height: 500,
+      defaultNode: { size: 10 },
+    });
+    graph.on('afterlayout', () => {
+      if (!graph || graph.destroyed) return;
+      graph.destroy();
+      done();
+    });
+    setTimeout(() => {
+      if (!graph || graph.destroyed) return;
+      graph.destroy();
+      done();
+    }, 200);
+    graph.data(data);
+    graph.render();
+    expect(node.x).not.toEqual(undefined);
+    expect(node.y).not.toEqual(undefined);
+  });
+
+  it('force with fixed edgeStrength, nodeStrength, preventOverlap', (done) => {
+    const node = data.nodes[0];
+    const edge = data.edges[0];
+    let x: number;
+    let y: number;
+    let count = 0;
+    let isEnd = false;
+
+    const graph = new G6.Graph({
+      container: div,
+      layout: {
+        type: 'gforce',
+        linkDistance: 140,
+        edgeStrength: 0.5,
+        nodeStrength: -30,
+        preventOverlap: true,
+        onTick() {
+          count++;
+          expect(node.x !== x);
+          expect(node.y !== y);
+          expect(edge.x).toEqual(undefined);
+          expect(edge.y).toEqual(undefined);
+          x = node.x;
+          y = node.y;
+        },
+        onLayoutEnd() {
+          isEnd = true;
+          expect(node.x);
+          expect(node.y);
+          expect(edge.x).toEqual(undefined);
+          expect(edge.y).toEqual(undefined);
+        },
+      },
+      width: 500,
+      height: 500,
+      defaultNode: { size: 10 },
+    });
+
+    graph.on('afterlayout', () => {
+      if (!graph || graph.destroyed) return;
+      expect(count > 30).toEqual(true);
+      expect(isEnd === true).toEqual(true);
+      graph.destroy();
+      done();
+    });
+    setTimeout(() => {
+      if (!graph || graph.destroyed) return;
+      graph.destroy();
+      done();
+    }, 200);
+    graph.data(data);
+    graph.render();
+  });
+
+  it('preventOverlap with number nodeSpacing', (done) => {
+    let isEnd = false;
+    const nodeSpacing = 10;
+    const nodeSize = 10;
+
+    const graph = new G6.Graph({
+      container: div,
+      layout: {
+        type: 'gforce',
+        preventOverlap: true,
+        nodeSpacing,
+        minMovement: 0.1,
+        onLayoutEnd() {
+          isEnd = true;
+        },
+      },
+      width: 500,
+      height: 500,
+      defaultNode: { size: nodeSize },
+    });
+
+    setTimeout(() => {
+      if (!graph || graph.destroyed) return;
+      graph.destroy();
+      done();
+    }, 200);
+
+    graph.on('afterlayout', () => {
+      if (!graph || graph.destroyed) return;
+      expect(isEnd === true).toEqual(true);
+      const node0 = data.nodes[0];
+      const node1 = data.nodes[1];
+      const dist = Math.sqrt(
+        (node0.x - node1.x) * (node0.x - node1.x) + (node0.y - node1.y) * (node0.y - node1.y),
+      );
+      expect(dist >= nodeSize / 2 + nodeSpacing).toEqual(true);
+      graph.destroy();
+      done();
+    });
+    graph.data(data);
+    graph.render();
+  });
+
+  it('preventOverlap with function nodeSpacing and array node size', (done) => {
+    let isEnd = false;
+    const nodeSpacing = (d) => {
+      return d.size[0] / 2;
+    };
+
+    const graph = new G6.Graph({
+      container: div,
+      layout: {
+        type: 'gforce',
+        preventOverlap: true,
+        minMovement: 0.1,
+        nodeSpacing,
+        onLayoutEnd() {
+          isEnd = true;
+        },
+      },
+      width: 500,
+      height: 500,
+    });
+    data.nodes.forEach((node) => {
+      const randomWidth = 10 + Math.random() * 20;
+      const randomHeight = 5 + Math.random() * 5;
+      node.size = [randomWidth, randomHeight];
+      node.type = 'rect';
+    });
+    graph.on('afterlayout', () => {
+      if (!graph || graph.destroyed) return;
+      expect(isEnd === true).toEqual(true);
+      const node0 = data.nodes[0];
+      const node1 = data.nodes[1];
+      const dist = Math.sqrt(
+        (node0.x - node1.x) * (node0.x - node1.x) + (node0.y - node1.y) * (node0.y - node1.y),
+      );
+      const mindist =
+        node0.size[0] / 2 + node1.size[1] / 2 + nodeSpacing(node0) + nodeSpacing(node1);
+      expect(dist >= mindist).toEqual(true);
+      graph.destroy();
+      done();
+    });
+    setTimeout(() => {
+      if (!graph || graph.destroyed) return;
+      graph.destroy();
+      done();
+    }, 200);
+    graph.data(data);
+    graph.render();
+  });
+
+  it('preventOverlap with function nodeSpacing and function nodeSize', (done) => {
+    //
+    let isEnd = false;
+    const nodeSpacing = (d) => {
+      return d.dsize[0] / 3;
+    };
+    const nodeSize = (d) => {
+      return d.dsize[0];
+    };
+
+    const graph = new G6.Graph({
+      container: div,
+      layout: {
+        type: 'gforce',
+        preventOverlap: true,
+        nodeSpacing,
+        nodeSize,
+        minMovement: 0.1,
+        onLayoutEnd() {
+          isEnd = true;
+        },
+      },
+      defaultNode: {
+        size: [30, 15],
+      },
+      width: 500,
+      height: 500,
+    });
+    data.nodes.forEach((node) => {
+      node.dsize = [30, 15];
+      node.type = 'rect';
+    });
+
+    graph.on('afterlayout', () => {
+      if (!graph || graph.destroyed) return;
+      expect(isEnd === true).toEqual(true);
+      const node0 = data.nodes[0];
+      const node1 = data.nodes[1];
+      const dist = Math.sqrt(
+        (node0.x - node1.x) * (node0.x - node1.x) + (node0.y - node1.y) * (node0.y - node1.y),
+      );
+      const mindist =
+        node0.dsize[0] / 2 + node1.dsize[1] / 2 + nodeSpacing(node0) + nodeSpacing(node1);
+      expect(dist >= mindist).toEqual(true);
+      graph.destroy();
+      done();
+    });
+    setTimeout(() => {
+      if (!graph || graph.destroyed) return;
+      graph.destroy();
+      done();
+    }, 200);
+    graph.data(data);
+    graph.render();
+  });
+
+  it('preventOverlap with function nodeSpacing and array nodeSize', (done) => {
+    let isEnd = false;
+    const nodeSize = [30, 18];
+
+    const graph = new G6.Graph({
+      container: div,
+      layout: {
+        type: 'gforce',
+        preventOverlap: true,
+        nodeSize,
+        minMovement: 0.1,
+        onLayoutEnd() {
+          isEnd = true;
+        },
+      },
+      defaultNode: {
+        size: nodeSize,
+      },
+      width: 500,
+      height: 500,
+    });
+
+    graph.on('afterlayout', () => {
+      if (!graph || graph.destroyed) return;
+      expect(isEnd === true).toEqual(true);
+      const node0 = data.nodes[0];
+      const node1 = data.nodes[1];
+      const dist = Math.sqrt(
+        (node0.x - node1.x) * (node0.x - node1.x) + (node0.y - node1.y) * (node0.y - node1.y),
+      );
+      const mindist = nodeSize[0];
+      expect(dist >= mindist).toEqual(true);
+      graph.destroy();
+      done();
+    });
+    setTimeout(() => {
+      if (!graph || graph.destroyed) return;
+      graph.destroy();
+      done();
+    }, 200);
+    graph.data(data);
+    graph.render();
+  });
+
+  it('preventOverlap with function nodeSpacing and number nodeSize', (done) => {
+    let isEnd = false;
+    const nodeSize = 30;
+
+    const graph = new G6.Graph({
+      container: div,
+      layout: {
+        type: 'gforce',
+        preventOverlap: true,
+        nodeSize,
+        minMovement: 0.1,
+        onLayoutEnd() {
+          isEnd = true;
+        },
+      },
+      defaultNode: {
+        size: nodeSize,
+      },
+      width: 500,
+      height: 500,
+    });
+
+    graph.on('afterlayout', () => {
+      expect(isEnd === true).toEqual(true);
+      const node0 = data.nodes[0];
+      const node1 = data.nodes[1];
+      const dist = Math.sqrt(
+        (node0.x - node1.x) * (node0.x - node1.x) + (node0.y - node1.y) * (node0.y - node1.y),
+      );
+      const mindist = nodeSize;
+      expect(dist >= mindist).toEqual(true);
+      graph.destroy();
+      done();
+    });
+    setTimeout(() => {
+      if (!graph || graph.destroyed) return;
+      graph.destroy();
+      done();
+    }, 200);
+    graph.data(data);
+    graph.render();
+  });
+
+  xit('force re-execute, isTicking', (done) => {
+    const graph = new G6.Graph({
+      container: div,
+      layout: {
+        type: 'gforce',
+      },
+      width: 500,
+      height: 500,
+    });
+    graph.data(data);
+    graph.render();
+    const forceLayout = graph.get('layoutController').layoutMethod;
+    forceLayout.execute(); // re execute when it is ticking
+
+    setTimeout(() => {
+      const node0 = data.nodes[0];
+      expect(node0.x).not.toEqual(NaN);
+      expect(node0.y).not.toEqual(NaN);
+      forceLayout.forceSimulation.stop();
+      graph.destroy();
+      done();
+    }, 300);
+  });
+});