feat(app/metrics/utils): remove dependencies on d3-node (#1329) [skip ci]

package.json

@@ -41,13 +41,13 @@
     "compression": "^1.7.4",
     "csso": "^5.0.5",
     "d3": "^7.8.0",
-    "d3-node": "^3.0.0",
     "ejs": "^3.1.8",
     "emoji-name-map": "^1.2.9",
     "express": "^4.18.2",
     "express-rate-limit": "^6.7.0",
     "file-type": "^18.2.0",
     "js-yaml": "^4.1.0",
+    "jsdom": "^20.0.3",
     "linguist-js": "^2.5.3",
     "marked": "^4.2.5",
     "memory-cache": "^0.2.0",

source/app/metrics/utils.mjs

@@ -4,8 +4,8 @@ import axios from "axios"
 import processes from "child_process"
 import crypto from "crypto"
 import { minify as csso } from "csso"
+import { JSDOM } from "jsdom"
 import * as d3 from "d3"
-import D3node from "d3-node"
 import emoji from "emoji-name-map"
 import { fileTypeFromBuffer } from "file-type"
 import fss from "fs"
@@ -34,7 +34,7 @@ import xmlformat from "xml-formatter"
 prism_lang()
 
 //Exports
-export { axios, d3, D3node, emoji, fetch, fs, git, minimatch, opengraph, os, paths, processes, sharp, url, util }
+export { axios, d3, emoji, fetch, fs, git, minimatch, opengraph, os, paths, processes, sharp, url, util }
 
 /**Returns module __dirname */
 export function __module(module) {
@@ -790,3 +790,26 @@ export async function gif({page, width, height, frames, x = 0, y = 0, repeat = t
   await fs.unlink(path)
   return `data:image/gif;base64,${result}`
 }
+
+/**D3 node wrapper (loosely based on https://github.com/d3-node/d3-node)*/
+export class D3node {
+  constructor() {
+    this.jsdom = new JSDOM()
+    this.document = this.jsdom.window.document
+  }
+
+  get element() {
+    return d3.select(this.document.body)
+  }
+
+  createSVG(width, height) {
+    const svg = this.element.append("svg").attr("xmlns", "http://www.w3.org/2000/svg")
+    if ((width)&&(height))
+      svg.attr("width", width).attr("height", height)
+    return svg
+  }
+
+  svgString() {
+    return this.element.select("svg").node()?.outerHTML || ""
+  }
+}

source/plugins/stargazers/worldmap/index.mjs

@@ -2,7 +2,7 @@
 import { Client as Gmap } from "@googlemaps/google-maps-services-js"
 import color from "color"
 import * as d3 from "d3"
-import D3Node from "d3-node"
+import {D3node} from "../../../app/metrics/utils.mjs"
 
 /**
  * Worldmap
@@ -38,7 +38,7 @@ export default async function(login, {locations, sample, imports, token}) {
   }
 
   //Generate SVG
-  const d3n = new D3Node()
+  const d3n = new D3node()
   const svg = d3n.createSVG(480, 315)
   const countries = JSON.parse(await imports.fs.readFile(imports.paths.join(imports.__module(import.meta.url), "atlas/50m_countries.geojson")))
   const geopath = d3.geoPath(d3.geoMercator().fitWidth(svg.attr("width"), countries))