feat(plugins/core): support new debug flags for puppeteer (lowlighter#1317)

Author: lowlighter

source/app/metrics/index.mjs

@@ -38,11 +38,28 @@ export default async function metrics({login, q}, {graphql, rest, plugins, conf,
         }
         : null),
     }
+    const {"debug.flags":dflags, "experimental.features":_experimental, "config.order":_partials} = imports.metadata.plugins.core.inputs({account:"bypass", q})
     const extras = {css: imports.metadata.plugins.core.extras("extras_css", {...conf.settings, error: false}) ? q["extras.css"] ?? "" : "", js: imports.metadata.plugins.core.extras("extras_js", {...conf.settings, error: false}) ? q["extras.js"] ?? "" : ""}
     const data = {q, animated: true, large: false, base: {}, config: {}, errors: [], warnings, plugins: {}, computed: {}, extras, postscripts: []}
-    const experimental = new Set(decodeURIComponent(q["experimental.features"] ?? "").split(" ").map(x => x.trim().toLocaleLowerCase()).filter(x => x))
-    if (conf.settings["debug.headless"])
+    const experimental = new Set(_experimental)
+    if (conf.settings["debug.headless"]) {
       imports.puppeteer.headless = false
+      console.debug(`metrics/compute/${login} > disabled puppeteer headless mode`)
+    }
+    if ((conf.settings.debug)||(process.env.GITHUB_ACTIONS)) {
+      if (dflags.includes("--puppeteer-disable-headless")) {
+        imports.puppeteer.headless = false
+        console.debug(`metrics/compute/${login} > disabled puppeteer headless mode`)
+      }
+      if (dflags.includes("--puppeteer-debug")) {
+        process.env.DEBUG = "puppeteer:*"
+        console.debug(`metrics/compute/${login} > enabled puppeteer debugging`)
+      }
+      if (dflags.find(flag => flag.startsWith("--puppeteer-wait-"))) {
+        imports.puppeteer.events = dflags.filter(flag => flag.startsWith("--puppeteer-wait-")).map(flag => flag.replace("--puppeteer-wait-", ""))
+        console.debug(`metrics/compute/${login} > overridden puppeteer wait events [${imports.puppeteer.events}]`)
+      }
+    }
 
     //Metrics insights
     if (convert === "insights")
@@ -51,7 +68,7 @@ export default async function metrics({login, q}, {graphql, rest, plugins, conf,
     //Partial parts
     {
       data.partials = new Set([
-        ...decodeURIComponent(q["config.order"] ?? "").split(",").map(x => x.trim().toLocaleLowerCase()).filter(partial => partials.includes(partial)),
+        ..._partials.filter(partial => partials.includes(partial)),
         ...partials,
       ])
       console.debug(`metrics/compute/${login} > content order : ${[...data.partials]}`)

source/app/metrics/utils.mjs

@@ -52,6 +52,7 @@ export const puppeteer = {
     })
   },
   headless: true,
+  events: ["load", "domcontentloaded", "networkidle2"],
 }
 
 /**Plural formatter */
@@ -492,7 +493,7 @@ export const svg = {
     console.debug("metrics/svg/pdf > loading svg")
     const page = await svg.resize.browser.newPage()
     page.on("console", ({_text: text}) => console.debug(`metrics/svg/pdf > puppeteer > ${text}`))
-    await page.setContent(`<main class="markdown-body">${rendered}</main>`, {waitUntil: ["load", "domcontentloaded", "networkidle2"]})
+    await page.setContent(`<main class="markdown-body">${rendered}</main>`, {waitUntil: puppeteer.events})
     console.debug("metrics/svg/pdf > loaded svg successfully")
     const margins = (Array.isArray(paddings) ? paddings : paddings.split(",")).join(" ")
     console.debug(`metrics/svg/pdf > margins set to ${margins}`)
@@ -537,7 +538,7 @@ export const svg = {
     page
       .on("console", message => console.debug(`metrics/svg/resize > puppeteer > ${message.text()}`))
       .on("pageerror", error => console.debug(`metrics/svg/resize > puppeteer > ${error.message}`))
-    await page.setContent(rendered, {waitUntil: ["load", "domcontentloaded", "networkidle2"]})
+    await page.setContent(rendered, {waitUntil: puppeteer.events})
     console.debug("metrics/svg/resize > loaded svg successfully")
     await page.addStyleTag({content: "body { margin: 0; padding: 0; }"})
     let mime = "image/svg+xml"
@@ -611,7 +612,7 @@ export const svg = {
     }
     //Compute hash
     const page = await svg.resize.browser.newPage()
-    await page.setContent(rendered, {waitUntil: ["load", "domcontentloaded", "networkidle2"]})
+    await page.setContent(rendered, {waitUntil: puppeteer.events})
     const data = await page.evaluate(async () => {
       document.querySelector("footer")?.remove()
       return document.querySelector("svg").outerHTML

source/plugins/core/metadata.yml

@@ -538,13 +538,29 @@ inputs:
       - `--cakeday`: simulate registration anniversary
       - `--halloween`: enable halloween colors
       - `--error`: force render error
+      - `--puppeteer-debug`: enable puppeteer debug mode\*
+      - `--puppeteer-disable-headless`: disable puppeteer headless mode *(requires a graphical environment)*\*
+      - `--puppeteer-wait-load`: override puppeteer wait events\*
+      - `--puppeteer-wait-domcontentloaded`: override puppeteer wait events\*
+      - `--puppeteer-wait-networkidle0`: override puppeteer wait events\*
+      - `--puppeteer-wait-networkidle2`: override puppeteer wait events\*
+
+      > *\* 🌐 Web instances needs to have [`debug`](/source/plugins/core/README.md#debug) set in `settings.json` for these flags to be supported.*
+
+      > ⚠️ No backward compatibility is guaranteed for these features, they are only meant for debugging purposes.
     type: array
     format: space-separated
     default: ""
     values:
       - --cakeday
       - --halloween
       - --error
+      - --puppeteer-debug
+      - --puppeteer-disable-headless
+      - --puppeteer-wait-load
+      - --puppeteer-wait-domcontentloaded
+      - --puppeteer-wait-networkidle0
+      - --puppeteer-wait-networkidle2
     testing: yes
     preset: no