feat: allow mermaid to be configured via some query params

mermaid/package.json

@@ -18,15 +18,16 @@
     "url": "https://github.com/yuzutech/kroki.git"
   },
   "dependencies": {
+    "lodash": "^4.17.21",
     "micro": "9.4.1",
     "pino": "8.8.0",
     "pino-debug": "2.0.0",
     "puppeteer": "14.4.1"
   },
   "devDependencies": {
-    "mermaid": "9.3.0",
     "chai": "4.3.7",
     "dirty-chai": "^2.0.1",
+    "mermaid": "9.3.0",
     "mocha": "10.2.0",
     "pngjs": "^6.0.0",
     "standard": "17.0.0"

mermaid/src/index.js

@@ -12,13 +12,14 @@ const instance = require('./browser-instance')
   const server = micro(async (req, res) => {
     // TODO: add a /_status route (return mermaid version)
     // TODO: read the diagram source as plain text
-    const outputType = req.url.match(/\/(png|svg)$/)?.[1]
+    const url = new URL(req.url, 'http://localhost') // create a URL object. The base is not important here
+    const outputType = url.pathname.match(/\/(png|svg)$/)?.[1]
     if (outputType) {
       const diagramSource = await micro.text(req, { limit: '1mb', encoding: 'utf8' })
       if (diagramSource) {
         try {
           const isPng = outputType === 'png'
-          const output = await worker.convert(new Task(diagramSource, isPng))
+          const output = await worker.convert(new Task(diagramSource, isPng), url.searchParams)
           res.setHeader('Content-Type', isPng ? 'image/png' : 'image/svg+xml')
           return micro.send(res, 200, output)
         } catch (err) {

mermaid/src/worker.js

@@ -2,6 +2,7 @@
 const { logger } = require('./logger')
 const path = require('path')
 const puppeteer = require('puppeteer')
+const set = require('lodash/set')
 
 class SyntaxError extends Error {
   constructor () {
@@ -15,12 +16,13 @@ class Worker {
     this.pageUrl = process.env.KROKI_MERMAID_PAGE_URL || `file://${path.join(__dirname, '..', 'assets', 'index.html')}`
   }
 
-  async convert (task) {
+  async convert (task, config) {
     const browser = await puppeteer.connect({
       browserWSEndpoint: this.browserWSEndpoint,
       ignoreHTTPSErrors: true
     })
     const page = await browser.newPage()
+    this.updateConfig(task, config)
     try {
       page.setViewport({ height: 800, width: 600 })
       await page.goto(this.pageUrl)
@@ -65,6 +67,42 @@ class Worker {
       }
     }
   }
+
+  updateConfig (task, config) {
+    for (const property in Object.fromEntries(config)) {
+      const propertyCamelCase = this.convertPropertyToCamelCase(property)
+      const value = this.getTypedValue(config.get(property))
+      set(task.mermaidConfig, propertyCamelCase, value)
+    }
+  }
+
+  convertPropertyToCamelCase (property) {
+    const propertySplit = property.split('_')
+    for (let i = 0; i < propertySplit.length; i++) {
+      const split = propertySplit[i]
+      const subSplit = split.split('-')
+      if (subSplit.length > 1) {
+        for (let j = 1; j < subSplit.length; j++) {
+          subSplit[j] = subSplit[j].charAt(0).toUpperCase() + subSplit[j].substring(1)
+        }
+        propertySplit[i] = subSplit.join('')
+      }
+    }
+    return propertySplit.join('.')
+  }
+
+  getTypedValue (value) {
+    if (value.toLowerCase() === 'true' || value.toLocaleString() === 'false') {
+      return value === 'true'
+    }
+    if (value.startsWith('[') && value.endsWith(']')) {
+      return value.substring(1, value.length - 1).split(',').map(item => this.getTypedValue(item))
+    }
+    if (!isNaN(value)) {
+      return Number(value)
+    }
+    return value
+  }
 }
 
 module.exports = {