From d118c96fd95086bf70dc39c3980eeae3c4436f9d Mon Sep 17 00:00:00 2001
From: Alois Klink <alois@aloisklink.com>
Date: Wed, 17 Aug 2022 20:31:11 +0100
Subject: [PATCH] test: test whether '--backgroundColor' works

Adds some simple tests that check whether the backgroundColor option
works.

It looks like it doesn't work for PDFs. If we want to enable PDF
background colors, we need to set the puppeteer option
`printBackground: true`,
see https://pptr.dev/api/puppeteer.pdfoptions.printbackground
---
 .github/workflows/compile-mermaid.yml | 2 ++
 run-tests.sh                          | 7 +++++++
 src-test/test.js                      | 7 +++++++
 src/index.js                          | 2 +-
 4 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/compile-mermaid.yml b/.github/workflows/compile-mermaid.yml
index a690a917..cc8cb8ff 100644
--- a/.github/workflows/compile-mermaid.yml
+++ b/.github/workflows/compile-mermaid.yml
@@ -60,6 +60,8 @@ jobs:
           # This will overwite any PNG files with the same name that have been created by run-tests.sh
           $(npm bin)/convert-svg-to-png ${{env.INPUT_DATA}}/graph-with-br.mmd.svg
           $(npm bin)/convert-svg-to-png ${{env.INPUT_DATA}}/graph-with-br.mmd-stdin.svg
+          # svg file is named `-svg` so it doesn't overwrite .png file
+          $(npm bin)/convert-svg-to-png ${{env.INPUT_DATA}}/flowchart1-red-background-svg.svg
 
       - name: Upload diagrams for manual inspection
         uses: actions/upload-artifact@v3
diff --git a/run-tests.sh b/run-tests.sh
index 40c4228b..3d052a97 100755
--- a/run-tests.sh
+++ b/run-tests.sh
@@ -13,6 +13,13 @@ for i in $(ls $INPUT_DATA/*.md); do docker run --rm -v $(pwd):/data $IMAGETAG -i
 # Test if the CLI actually works (PDF)
 for i in $(ls $INPUT_DATA/*.mmd); do docker run --rm -v $(pwd):/data $IMAGETAG -i /data/$i -o /data/$i.pdf; done
 
+# Test if passing background colors works
+for format in "svg" "png"; do
+  # must have different names, since we convert .svg to .png for percy upload
+  outputFileName="/data/$INPUT_DATA/flowchart1-red-background-${format}.${format}"
+  docker run --rm -v $(pwd):/data $IMAGETAG -i /data/$INPUT_DATA/flowchart1.mmd --backgroundColor "red" -o "$outputFileName"
+done
+
 # Test if a diagram from STDIN can be understood
 cat $INPUT_DATA/flowchart1.mmd | docker run --rm -i -v $(pwd):/data $IMAGETAG -o /data/$INPUT_DATA/flowchart1-stdin.png -w 800
 
diff --git a/src-test/test.js b/src-test/test.js
index 278ca031..ce02bea8 100644
--- a/src-test/test.js
+++ b/src-test/test.js
@@ -176,6 +176,13 @@ describe("mermaid-cli", () => {
       expectBytesAreFormat(await fs.readFile(file), 'svg')
     }))
   }, timeout)
+
+  test.concurrent.each(['svg', 'png', 'pdf'])('should set red background to %s', async (format) => {
+    await promisify(execFile)('node', [
+      'src/cli.js', '-i', 'test-positive/flowchart1.mmd', '-o', `test-output/flowchart1-red-background.${format}`,
+      '--backgroundColor', 'red'
+    ])
+  }, timeout)
 });
 
 describe("NodeJS API (import ... from '@mermaid-js/mermaid-cli')", () => {
diff --git a/src/index.js b/src/index.js
index 27f9ae2e..01ee7f57 100644
--- a/src/index.js
+++ b/src/index.js
@@ -75,7 +75,7 @@ commander
   .option('-H, --height [height]', 'Height of the page. Optional. Default: 600', /^\d+$/, '600')
   .option('-i, --input <input>', 'Input mermaid file. Files ending in .md will be treated as Markdown and all charts (e.g. ```mermaid (...)```) will be extracted and generated. Required.')
   .option('-o, --output [output]', 'Output file. It should be either md, svg, png or pdf. Optional. Default: input + ".svg"')
-  .option('-b, --backgroundColor [backgroundColor]', 'Background color. Example: transparent, red, \'#F0F0F0\'. Optional. Default: white')
+  .option('-b, --backgroundColor [backgroundColor]', 'Background color for pngs/svgs (not pdfs). Example: transparent, red, \'#F0F0F0\'. Optional. Default: white')
   .option('-c, --configFile [configFile]', 'JSON configuration file for mermaid. Optional')
   .option('-C, --cssFile [cssFile]', 'CSS file for the page. Optional')
   .option('-s, --scale [scale]', 'Puppeteer scale factor, default 1. Optional')