Switch to using dotviz instead of custom build of graphviz

.eslintignore

@@ -5,7 +5,6 @@
 /node_modules
 /dist
 /demo-dist
-/worker-dist
 /typings
 /test-results
 /playwright-report

.gitignore

@@ -10,9 +10,8 @@
 /node_modules
 /dist
 /demo-dist
-/worker-dist
 /middleware
 /typings
 /test-results
 /playwright-report
-/graphql-voyager-*.tgz
+/graphql-voyager-*.tgz

cspell.yml

@@ -6,8 +6,6 @@ ignorePaths:
   - cspell.yml
   - package.json
   - demo/presets
-  - worker/viz.cpp
-  - worker/Dockerfile
   - tests/*-snapshots/
 dictionaries:
   - html
@@ -22,6 +20,7 @@ overrides:
       - requestfailed
 
 words:
+  - dotviz
   - graphviz
   - svgr
   - reactroot # FIXME https://github.com/facebook/react/issues/10971
@@ -43,4 +42,3 @@ words:
   - pageview
   - jsdelivr
   - GraphiQL
-  - nojekyll

docker-compose.yml

@@ -1,10 +1,4 @@
 services:
-  build-worker:
-    build:
-      context: .
-      dockerfile: ./worker/Dockerfile
-    stdin_open: true
-    tty: true
   serve-webpack-example:
     build:
       context: .

package.json

@@ -37,12 +37,11 @@
     "preversion": "npm ci --ignore-scripts && npm test",
     "changelog": "node scripts/gen-changelog.ts",
     "test": "npm run lint && npm run check && npm run testonly && npm run prettier:check && npm run check:spell",
-    "start": "npm run build:worker && webpack serve --mode=development",
+    "start": "webpack serve --mode=development",
     "serve": "node ./scripts/serve-directory.ts -p 9090 demo-dist/graphql-voyager",
     "bundle": "rm -rf dist && webpack --mode=production",
     "build:ts": "tsc --project tsconfig.build.json",
-    "build:worker": "node scripts/bundle_worker.ts",
-    "build:release": "npm run build:worker && npm run bundle && npm run build:ts",
+    "build:release": "npm run bundle && npm run build:ts",
     "build:demo": "npm run build:release && rm -rf demo-dist && mkdir demo-dist && cp -R demo/ demo-dist/graphql-voyager/ && cp dist/voyager.css* dist/voyager.standalone.js* demo-dist/graphql-voyager/",
     "stats": "NODE_ENV=production webpack --json --mode=production > stats.json",
     "lint": "eslint --cache --max-warnings 0 .",
@@ -65,6 +64,7 @@
     "@mui/lab": "7.0.0-beta.13",
     "@mui/material": "7.1.1",
     "commonmark": "0.31.2",
+    "dotviz": "0.0.6",
     "svg-pan-zoom": "3.6.2"
   },
   "devDependencies": {

src/graph/graphviz-worker.ts

@@ -1,11 +1,8 @@
-import {
-  RenderRequest,
-  RenderResponse,
-  RenderResult,
-  VizWorkerHash,
-  VizWorkerSource,
-  // eslint-disable-next-line import/no-unresolved
-} from '../../worker/voyager.worker.ts';
+// eslint-disable-next-line import/no-unresolved
+import { type RenderResult, WASM_HASH as DotVizWorkerHash } from 'dotviz';
+import DotVizWorkerSource from 'dotviz/dotviz-inline-worker';
+import { type RenderRequest, type RenderResponse } from 'dotviz/dotviz-worker';
+
 import { computeHash } from '../utils/compute-hash.ts';
 import { LocalStorageLRUCache } from '../utils/local-storage-lru-cache.ts';
 
@@ -18,13 +15,20 @@ export class VizWorker {
   private _listeners: Map<number, (result: RenderResult) => void> = new Map();
 
   constructor() {
-    const blob = new Blob([VizWorkerSource], {
+    const blob = new Blob([DotVizWorkerSource], {
       type: 'application/javascript',
     });
     const url = URL.createObjectURL(blob);
-    this._worker = new Worker(url, { name: 'graphql-voyager-worker' });
+    this._worker = new Worker(url, {
+      name: 'graphql-voyager-worker',
+      type: 'module',
+    });
     URL.revokeObjectURL(url);
 
+    this._worker.addEventListener('error', (event) => {
+      // FIXME: better error handling
+      console.error('unexpected error from dotviz worker: ', event);
+    });
     this._worker.addEventListener('message', (event) => {
       const { id, result } = event.data as RenderResponse;
 
@@ -62,29 +66,39 @@ export class VizWorker {
 
   async generateCacheKey(dot: string): Promise<string | null> {
     const dotHash = await computeHash(dot);
-    return dotHash == null ? null : `worker:${VizWorkerHash}:dot:${dotHash}`;
+    return dotHash == null ? null : `worker:${DotVizWorkerHash}:dot:${dotHash}`;
   }
 
   _renderString(src: string): Promise<string> {
+    const id = this._listeners.size;
+    const renderRequest: RenderRequest = {
+      id,
+      input: src,
+      options: { engine: 'dot', format: 'svg' },
+    };
+
     return new Promise((resolve, reject) => {
-      const id = this._listeners.size;
-
-      this._listeners.set(id, function (result): void {
-        if ('error' in result) {
-          const { error } = result;
-          const e = new Error(error.message);
-          if (error.fileName) (e as any).fileName = error.fileName;
-          if (error.lineNumber) (e as any).lineNumber = error.lineNumber;
-          if (error.stack) (e as any).stack = error.stack;
-          return reject(e);
-        }
-        console.timeEnd('graphql-voyager: Rendering SVG');
-        resolve(result.value);
-      });
+      this._listeners.set(id, RenderResponseListener);
 
       console.time('graphql-voyager: Rendering SVG');
-      const renderRequest: RenderRequest = { id, src };
       this._worker.postMessage(renderRequest);
+
+      function RenderResponseListener(result: RenderResult): void {
+        console.timeEnd('graphql-voyager: Rendering SVG');
+        if (result.errors.length !== 0) {
+          return reject(
+            AggregateError([
+              result.errors.map(
+                (error) => new Error(`${error.level} : ${error.message}`),
+              ),
+            ]),
+          );
+        }
+        if (result.status === 'success') {
+          return resolve(result.output);
+        }
+        return reject(new Error('invalid response from dotviz worker'));
+      }
     });
   }
 }