fix(deps): update (#1556)

* fix(deps): update * style: reformat * fix(deps): add missing postcss dev dep Co-authored-by: Vis Bot <[email protected]>
visjs · Jul 24, 2021 · b5ef1ab · b5ef1ab
1 parent 47134b0
commit b5ef1ab
Show file tree

Hide file tree

Showing 31 changed files with 11,958 additions and 8,717 deletions.
diff --git a/.husky/pre-commit b/.husky/pre-commit
@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged
diff --git a/cypress.json b/cypress.json
@@ -1,4 +1,10 @@
 {
+  "env": {
+    "SNAPSHOT_BASE_DIRECTORY": "./cypress/snapshots/base",
+    "SNAPSHOT_DIFF_DIRECTORY": "./cypress/snapshots/diff"
+  },
+  "screenshotsFolder": "./cypress/snapshots/actual",
+  "trashAssetsBeforeRuns": true,
   "viewportHeight": 1600,
   "viewportWidth": 1200
 }
diff --git a/cypress/integration/functional/directed-hierarchical-layout.spec.ts b/cypress/integration/functional/directed-hierarchical-layout.spec.ts
@@ -167,17 +167,23 @@ describe("Directed hierarchical layout", (): void => {
     const configs = [
       { nodes: [], swallowsEdges: 0 },
       ...(clusterConfigs || []),
-    ].map(({ nodes }, i, arr): {
-      expectedVisibleEdges: number;
-      nodesToCluster: Set<IdType>;
-    } => ({
-      expectedVisibleEdges:
-        data.edges.length -
+    ].map(
+      (
+        { nodes },
+        i,
         arr
-          .slice(0, i + 1)
-          .reduce((acc, { swallowsEdges }): number => acc + swallowsEdges, 0),
-      nodesToCluster: new Set(nodes),
-    }));
+      ): {
+        expectedVisibleEdges: number;
+        nodesToCluster: Set<IdType>;
+      } => ({
+        expectedVisibleEdges:
+          data.edges.length -
+          arr
+            .slice(0, i + 1)
+            .reduce((acc, { swallowsEdges }): number => acc + swallowsEdges, 0),
+        nodesToCluster: new Set(nodes),
+      })
+    );
 
     describe(name, (): void => {
       it("Preparation", (): void => {
@@ -244,28 +250,40 @@ describe("Directed hierarchical layout", (): void => {
                  * No matter how much ESLint think they're unnecessary, these two
                  * assertions are indeed necessary.
                  */
-                // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
-                const visibleEdges = (Object.values(
-                  // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
-                  (network as any).body.edges
-                ) as any[]).filter(
+                const visibleEdges = Object.values(
+                  (
+                    network as unknown as {
+                      body: {
+                        edges: {
+                          fromId: string;
+                          toId: string;
+                        }[];
+                      };
+                    }
+                  ).body.edges
+                ).filter(
                   (edge): boolean =>
                     visibleNodeIds.has(edge.fromId) &&
                     visibleNodeIds.has(edge.toId)
                 );
 
                 const invalidEdges = visibleEdges
-                  .map(({ fromId, toId }): {
-                    fromId: IdType;
-                    fromPosition: Point;
-                    toId: IdType;
-                    toPosition: Point;
-                  } => ({
-                    fromId,
-                    fromPosition: network.getPositions([fromId])[fromId],
-                    toId,
-                    toPosition: network.getPositions([toId])[toId],
-                  }))
+                  .map(
+                    ({
+                      fromId,
+                      toId,
+                    }): {
+                      fromId: IdType;
+                      fromPosition: Point;
+                      toId: IdType;
+                      toPosition: Point;
+                    } => ({
+                      fromId,
+                      fromPosition: network.getPositions([fromId])[fromId],
+                      toId,
+                      toPosition: network.getPositions([toId])[toId],
+                    })
+                  )
                   .filter(({ fromPosition, toPosition }): boolean => {
                     return !(fromPosition.y < toPosition.y);
                   });

diff --git a/cypress/integration/functional/drags.spec.ts b/cypress/integration/functional/drags.spec.ts
@@ -18,9 +18,11 @@ function drag(
 ): { name: string; event: VisEvent }[] {
   const events: { name: string; event: VisEvent }[] = [];
 
-  const eventListener = (name: string) => (event: VisEvent): void => {
-    events.push({ name, event });
-  };
+  const eventListener =
+    (name: string) =>
+    (event: VisEvent): void => {
+      events.push({ name, event });
+    };
 
   cy.visRunWithWindow(({ network }): void => {
     network.on("dragStart", eventListener("dragStart"));

diff --git a/cypress/integration/helpers/common.ts b/cypress/integration/helpers/common.ts
@@ -29,16 +29,14 @@ export function createGridPoints(
   const offset = (size * ((perRowOrCol - 1) / perRowOrCol)) / 2;
 
   return Object.freeze<Point[]>(
-    new Array(amount).fill(null).map(
-      (_, i): Point => {
-        const col = Math.floor(i / perRowOrCol);
-        const row = i - col * perRowOrCol;
+    new Array(amount).fill(null).map((_, i): Point => {
+      const col = Math.floor(i / perRowOrCol);
+      const row = i - col * perRowOrCol;
 
-        return Object.freeze<Point>({
-          x: (row / perRowOrCol) * size - offset,
-          y: (col / perRowOrCol) * size - offset,
-        });
-      }
-    )
+      return Object.freeze<Point>({
+        x: (row / perRowOrCol) * size - offset,
+        y: (col / perRowOrCol) * size - offset,
+      });
+    })
   );
 }
diff --git a/cypress/pages/standard-cytest-script.ts b/cypress/pages/standard-cytest-script.ts
@@ -205,13 +205,15 @@ type VisUtil = typeof visUtil;
   updateSelectionJSON();
 
   // Selection events:
-  ([
-    "deselectEdge",
-    "deselectNode",
-    "select",
-    "selectEdge",
-    "selectNode",
-  ] as const).forEach((eventName): void => {
+  (
+    [
+      "deselectEdge",
+      "deselectNode",
+      "select",
+      "selectEdge",
+      "selectNode",
+    ] as const
+  ).forEach((eventName): void => {
     network.on(eventName, updateSelectionJSON);
 
     network.on(eventName, (): void => {
@@ -239,40 +241,42 @@ type VisUtil = typeof visUtil;
 
   // Event queue:
   const eventQueue: VisWindow["visEventQueue"] = {} as any;
-  ([
-    "afterDrawing",
-    "animationFinished",
-    "beforeDrawing",
-    "blurEdge",
-    "blurNode",
-    "click",
-    "configChange",
-    "controlNodeDragEnd",
-    "controlNodeDragging",
-    "deselectEdge",
-    "deselectNode",
-    "doubleClick",
-    "dragEnd",
-    "dragStart",
-    "dragging",
-    "hidePopup",
-    "hold",
-    "hoverEdge",
-    "hoverNode",
-    "initRedraw",
-    "oncontext",
-    "release",
-    "resize",
-    "select",
-    "selectEdge",
-    "selectNode",
-    "showPopup",
-    "stabilizationIterationsDone",
-    "stabilizationProgress",
-    "stabilized",
-    "startStabilizing",
-    "zoom",
-  ] as const).forEach((eventName): void => {
+  (
+    [
+      "afterDrawing",
+      "animationFinished",
+      "beforeDrawing",
+      "blurEdge",
+      "blurNode",
+      "click",
+      "configChange",
+      "controlNodeDragEnd",
+      "controlNodeDragging",
+      "deselectEdge",
+      "deselectNode",
+      "doubleClick",
+      "dragEnd",
+      "dragStart",
+      "dragging",
+      "hidePopup",
+      "hold",
+      "hoverEdge",
+      "hoverNode",
+      "initRedraw",
+      "oncontext",
+      "release",
+      "resize",
+      "select",
+      "selectEdge",
+      "selectNode",
+      "showPopup",
+      "stabilizationIterationsDone",
+      "stabilizationProgress",
+      "stabilized",
+      "startStabilizing",
+      "zoom",
+    ] as const
+  ).forEach((eventName): void => {
     eventQueue[eventName] = [];
     network.on(eventName, (params: any): void => {
       eventQueue[eventName].push({ params });

diff --git a/cypress/plugins/index.js b/cypress/plugins/index.js
@@ -34,7 +34,7 @@ module.exports = (on, config) => {
       config.screenshotsFolder = "./cypress/snapshots/actual";
     }
 
-    getCompareSnapshotsPlugin(on);
+    getCompareSnapshotsPlugin(on, config);
   }
 
   if (all || config.env.FUNCTIONAL) {

diff --git a/cypress/support/commands/vis-assert-event.ts b/cypress/support/commands/vis-assert-event.ts
@@ -32,12 +32,10 @@ declare global {
 }
 
 export function visShiftAndAssertEventFired(name: NetworkEvents): void {
-  cy.visRun(
-    async ({ eventQueue }): Promise<void> => {
-      expect(eventQueue[name], `${name} event queue`).to.not.be.empty;
-      eventQueue[name].shift();
-    }
-  );
+  cy.visRun(async ({ eventQueue }): Promise<void> => {
+    expect(eventQueue[name], `${name} event queue`).to.not.be.empty;
+    eventQueue[name].shift();
+  });
 }
 Cypress.Commands.add(
   "visShiftAndAssertEventFired",
@@ -48,15 +46,13 @@ export function visShiftAndAssertEventFiredWithParams(
   name: NetworkEvents,
   params: any
 ): void {
-  cy.visRun(
-    async ({ eventQueue }): Promise<void> => {
-      expect(eventQueue[name], `${name} event queue`).to.not.be.empty;
-      const event = eventQueue[name].shift();
-      expect(event, `${name} event`)
-        .to.have.ownProperty("params")
-        .that.deep.equals(params);
-    }
-  );
+  cy.visRun(async ({ eventQueue }): Promise<void> => {
+    expect(eventQueue[name], `${name} event queue`).to.not.be.empty;
+    const event = eventQueue[name].shift();
+    expect(event, `${name} event`)
+      .to.have.ownProperty("params")
+      .that.deep.equals(params);
+  });
 }
 Cypress.Commands.add(
   "visShiftAndAssertEventFiredWithParams",
@@ -66,12 +62,10 @@ Cypress.Commands.add(
 export function visShiftAndAssertEventNone(
   ...names: readonly NetworkEvents[]
 ): void {
-  cy.visRun(
-    async ({ eventQueue }): Promise<void> => {
-      for (const name of names) {
-        expect(eventQueue[name], `${name} event queue`).to.be.empty;
-      }
+  cy.visRun(async ({ eventQueue }): Promise<void> => {
+    for (const name of names) {
+      expect(eventQueue[name], `${name} event queue`).to.be.empty;
     }
-  );
+  });
 }
 Cypress.Commands.add("visShiftAndAssertEventNone", visShiftAndAssertEventNone);
diff --git a/cypress/support/commands/vis-assert-selection.ts b/cypress/support/commands/vis-assert-selection.ts
@@ -16,10 +16,7 @@ declare global {
   }
 }
 
-function sortSelection(selection: {
-  nodes: IdType[];
-  edges: IdType[];
-}): {
+function sortSelection(selection: { nodes: IdType[]; edges: IdType[] }): {
   nodes: IdType[];
   edges: IdType[];
 } {

diff --git a/cypress/support/commands/vis-run.ts b/cypress/support/commands/vis-run.ts
@@ -30,23 +30,20 @@ export function visRun(
   callback: (props: VisGlobals) => void | Promise<void>,
   { timeout = VIS_DEFAULT_RUN_TIMEOUT }: VisRunOptions = {}
 ): void {
-  cy.window().then(
-    { timeout },
-    async (win: any): Promise<void> => {
-      const {
-        visEdges: edges,
-        visEventQueue: eventQueue,
-        visLastEvents: lastEvents,
-        visNetwork: network,
-        visNodes: nodes,
-      }: VisWindow = win;
+  cy.window().then({ timeout }, async (win: any): Promise<void> => {
+    const {
+      visEdges: edges,
+      visEventQueue: eventQueue,
+      visLastEvents: lastEvents,
+      visNetwork: network,
+      visNodes: nodes,
+    }: VisWindow = win;
 
-      if (edges && lastEvents && network && nodes) {
-        await callback({ edges, eventQueue, lastEvents, network, nodes });
-      } else {
-        throw new Error("No page globals were found.");
-      }
+    if (edges && lastEvents && network && nodes) {
+      await callback({ edges, eventQueue, lastEvents, network, nodes });
+    } else {
+      throw new Error("No page globals were found.");
     }
-  );
+  });
 }
 Cypress.Commands.add("visRun", visRun);
diff --git a/examples/network/edgeStyles/imageArrowHeads.html b/examples/network/edgeStyles/imageArrowHeads.html
@@ -126,8 +126,7 @@ <h3>Image Arrow Heads</h3>
               type: "image",
               imageWidth: 24,
               imageHeight: 24,
-              src:
-                "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='width:24px;height:24px' viewBox='0 0 24 24'%3E%3Cpath fill='%23000000' d='M19,3A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3H9.18C9.6,1.84 10.7,1 12,1C13.3,1 14.4,1.84 14.82,3H19M12,8L7,13H10V17H14V13H17L12,8M12,3A1,1 0 0,0 11,4A1,1 0 0,0 12,5A1,1 0 0,0 13,4A1,1 0 0,0 12,3Z' /%3E%3C/svg%3E",
+              src: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='width:24px;height:24px' viewBox='0 0 24 24'%3E%3Cpath fill='%23000000' d='M19,3A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3H9.18C9.6,1.84 10.7,1 12,1C13.3,1 14.4,1.84 14.82,3H19M12,8L7,13H10V17H14V13H17L12,8M12,3A1,1 0 0,0 11,4A1,1 0 0,0 12,5A1,1 0 0,0 13,4A1,1 0 0,0 12,3Z' /%3E%3C/svg%3E",
             },
           },
         },

diff --git a/examples/network/other/changingClusteredEdgesNodes.html b/examples/network/other/changingClusteredEdgesNodes.html
@@ -134,9 +134,8 @@ <h2 id="eventSpanHeading"></h2>
           );
           document.getElementById("eventSpanHeading").innerText =
             "selectEdge event:";
-          document.getElementById(
-            "eventSpanContent"
-          ).innerText = JSON.stringify(obj, null, 4);
+          document.getElementById("eventSpanContent").innerText =
+            JSON.stringify(obj, null, 4);
         }
       });
     </script>

diff --git a/examples/network/other/manipulation.html b/examples/network/other/manipulation.html
@@ -116,9 +116,8 @@
                 data,
                 callback
               );
-              document.getElementById(
-                "cancelButton"
-              ).onclick = clearPopUp.bind();
+              document.getElementById("cancelButton").onclick =
+                clearPopUp.bind();
               document.getElementById("network-popUp").style.display = "block";
             },
             editNode: function (data, callback) {