fixup! Render graph visualization as PNG files

JohT · JohT · commit 15c5e1d8579e · 2023-08-07T21:48:02.000+02:00
diff --git a/graph-visualization/artifactDependenciesGraph/artifactDependenciesGraph.html b/graph-visualization/artifactDependenciesGraph/artifactDependenciesGraph.html
@@ -13,7 +13,12 @@
     <script type="text/javascript" src="artifactDependenciesGraph.js"></script>
 </head>
 
-<body onload="draw()">
+<body">
+    <span>
+        <label for="neo4j-server-password">Neo4j Server Password:</label>
+        <input type="password" id="neo4j-server-password" name="neo4j-server-password" />
+        <input type="submit" id="neo4j-server-login" value="Login" onClick="draw()" />
+    </span>
     <div id="viz"></div>
 </body>
 
diff --git a/graph-visualization/artifactDependenciesGraph/artifactDependenciesGraph.js b/graph-visualization/artifactDependenciesGraph/artifactDependenciesGraph.js
@@ -4,7 +4,7 @@ function draw() {
     neo4j: {
       serverUrl: "bolt://localhost:7687",
       serverUser: "neo4j",
-      serverPassword: "neo4jinitial",
+      serverPassword: document.getElementById("neo4j-server-password").value || "neo4jinitial",
     },
     visConfig: {
       nodes: {
diff --git a/graph-visualization/renderVisualizations.js b/graph-visualization/renderVisualizations.js
@@ -26,10 +26,17 @@ const camelToKebabCase = (str) => str.replace(/[A-Z]/g, (letter) => `-${letter.t
 const takeCanvasScreenshots = async (browser, htmlFilename) => {
   const page = await browser.newPage();
   await page.setViewport({ width: 1600, height: 1000, isMobile: false, isLandscape: true, hasTouch: false, deviceScaleFactor: 1 });
-  await page.goto(`file://${htmlFilename}`, { waitUntil: "domcontentloaded" });
 
-  // Wait for a canvas element on the page
-  await page.waitForSelector("div canvas", { timeout: 40_000 });
+  console.log(`Loading ${htmlFilename}`);
+  await page.goto(`file://${htmlFilename}`);
+  
+  // Login with Neo4j server password from the environment variable NEO4J_INITIAL_PASSWORD
+  const loginButton = await page.waitForSelector('#neo4j-server-login');
+  await page.type('#neo4j-server-password', process.env.NEO4J_INITIAL_PASSWORD);
+  await loginButton.click();
+
+  // Wait for the graph visualization to be rendered onto a HTML5 canvas
+  await page.waitForSelector("div canvas");
 
   // Get all HTML canvas tag elements
   const canvasElements = await page.$$("div canvas");
