3.2.3

fix: generate random id for svg elements. Fixes #71 (#78 )
build(deps): bump json5 from 2.2.1 to 2.2.3 (#76 )
2023-07-21 20:04:46 +08:00 · 2023-06-22 15:36:02 +08:00 · 2023-02-24 18:33:45 +08:00 · 2023-02-24 18:33:13 +08:00 · 2022-04-30 17:31:10 +08:00 · 2022-04-30 17:14:20 +08:00
--- a/.github/workflows/nodejs.yml
+++ b/.github/workflows/nodejs.yml
@ -7,7 +7,7 @@ jobs:

    strategy:
      matrix:
-        node: [8, 10, 12]
+        node: [12, 14, 16, 18]
        os: [ubuntu-latest]

    runs-on: ${{ matrix.os }}
--- a/README.md
+++ b/README.md
@ -49,7 +49,7 @@ Available color names:
 ```html
 <script src="https://unpkg.com/badgen"></script>
 <script>
-  var svgString = badgen.badgen({ /*...*/ })
+  var svgString = badgen({ /*...*/ })
 </script>
 ```

--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "badgen",
-  "version": "3.2.2",
+  "version": "3.2.3",
  "description": "Fast svg badge generator.",
  "repository": "amio/badgen",
  "author": "Amio <amio.cn@gmail.com>",
@ -13,7 +13,7 @@
    "preview": "node preview/serve.js",
    "snaptests": "TAP_SNAPSHOT=1 npm test",
    "pretest": "npm run build",
-    "test": "tap test/*.spec.ts",
+    "test": "tap --no-check-coverage",
    "prebuild": "rm -rf dist",
    "esbuild": "esbuild src/index.ts --bundle --minify --sourcemap",
    "build:types": "tsc --emitDeclarationOnly",
@ -26,9 +26,9 @@
  "devDependencies": {
    "@types/node": "^14.0.14",
    "benchmark": "^2.1.4",
-    "esbuild": "^0.8.17",
+    "esbuild": "^0.14.38",
    "serve-marked": "^3.1.0",
-    "tap": "^14.10.7",
+    "tap": "^16.1.0",
    "typescript": "^4.1.2"
  }
 }
--- a/src/calc-text-width.ts
+++ b/src/calc-text-width.ts
@ -1,8 +1,8 @@
 // import widthsVerdana110 from './widths-verdana-110.json'
 // @ts-ignore
-const widthsVerdana110 = require('./widths-verdana-110.json')
+const widthsVerdana110: number[] = require('./widths-verdana-110.json')

-const calcWidth = (charWidthTable) => {
+const calcWidth = (charWidthTable: number[]) => {
  const fallbackWidth = charWidthTable[64] // Width as "@" for overflows

  return ([...text]) => {
--- a/src/color-presets.ts
+++ b/src/color-presets.ts
@ -10,4 +10,4 @@ export default {
  gray: '999',
  cyan: '1BC',
  black: '2A2A2A'
-}
+} as Record<string, string>
--- a/src/index.ts
+++ b/src/index.ts
@ -2,12 +2,13 @@ export { Verdana110 as calcWidth } from './calc-text-width'
 import { Verdana110 as calcWidth } from './calc-text-width'
 import colorPresets from './color-presets'

-type StyleOption = 'flat' | 'classic'
+export type StyleOption = 'flat' | 'classic'
+export type ColorPreset = keyof typeof colorPresets

-interface BadgenOptions {
+export interface BadgenOptions {
  status: string;
  subject?: string;
-  color?: string;
+  color?: ColorPreset;
  label?: string;
  labelColor?: string
  style?: StyleOption;
@ -38,17 +39,23 @@ export function badgen ({
  labelColor = colorPresets[labelColor] || labelColor
  iconWidth = iconWidth * 10

-  const iconSpanWidth = icon ? (label.length ? iconWidth + 30 : iconWidth - 18) : 0
+  const iconSpanWidth = icon ? (label?.length ? iconWidth + 30 : iconWidth - 18) : 0
  const sbTextStart = icon ? (iconSpanWidth + 50) : 50
-  const sbTextWidth = calcWidth(label)
+  const sbTextWidth = label ? calcWidth(label) : 0
  const stTextWidth = calcWidth(status)
  const sbRectWidth = sbTextWidth + 100 + iconSpanWidth
  const stRectWidth = stTextWidth + 100
  const width = sbRectWidth + stRectWidth
  const xlink = icon ? ' xmlns:xlink="http://www.w3.org/1999/xlink"' : ''

-  label = sanitize(label)
+  const gradientId = generateRandomID(5)
+  const maskId = generateRandomID(5)
+
+  label = label ? sanitize(label) : ''
  status = sanitize(status)
+  color = sanitize(color)
+  labelColor = sanitize(labelColor)
+  icon = icon ? sanitize(icon) : icon
  const accessibleText = createAccessibleText({label, status})

  if (style === 'flat') {
@ -70,15 +77,15 @@ export function badgen ({

  return `<svg width="${scale * width / 10}" height="${scale * 20}" viewBox="0 0 ${width} 200" xmlns="http://www.w3.org/2000/svg"${xlink} role="img" aria-label="${accessibleText}">
  <title>${accessibleText}</title>
-  <linearGradient id="a" x2="0" y2="100%">
+  <linearGradient id="${gradientId}" x2="0" y2="100%">
    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
    <stop offset="1" stop-opacity=".1"/>
  </linearGradient>
-  <mask id="m"><rect width="${width}" height="200" rx="30" fill="#FFF"/></mask>
-  <g mask="url(#m)">
+  <mask id="${maskId}"><rect width="${width}" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#${maskId})">
    <rect width="${sbRectWidth}" height="200" fill="#${labelColor}"/>
    <rect width="${stRectWidth}" height="200" fill="#${color}" x="${sbRectWidth}"/>
-    <rect width="${width}" height="200" fill="url(#a)"/>
+    <rect width="${width}" height="200" fill="url(#${gradientId})"/>
  </g>
  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
    <text x="${sbTextStart + 10}" y="148" textLength="${sbTextWidth}" fill="#000" opacity="0.25">${label}</text>
@ -90,14 +97,18 @@ export function badgen ({
 </svg>`
 }

-function bare ({ status, color, style, scale }) {
+function bare ({ status, color = 'blue', style, scale = 1 }: BadgenOptions) {
  typeAssert(typeof status === 'string', '<status> must be string')
  color = colorPresets[color] || color || colorPresets.blue

  const stTextWidth = calcWidth(status)
  const stRectWidth = stTextWidth + 115

+  const gradientId = generateRandomID(5)
+  const maskId = generateRandomID(5)
+
  status = sanitize(status)
+  color = sanitize(color)

  if (style === 'flat') {
    return `<svg width="${scale * stRectWidth / 10}" height="${scale * 20}" viewBox="0 0 ${stRectWidth} 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="${status}">
@ -114,14 +125,14 @@ function bare ({ status, color, style, scale }) {

  return `<svg width="${scale * stRectWidth / 10}" height="${scale * 20}" viewBox="0 0 ${stRectWidth} 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="${status}">
  <title>${status}</title>
-  <linearGradient id="a" x2="0" y2="100%">
+  <linearGradient id="${gradientId}" x2="0" y2="100%">
    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
    <stop offset="1" stop-opacity=".1"/>
  </linearGradient>
-  <mask id="m"><rect width="${stRectWidth}" height="200" rx="30" fill="#FFF"/></mask>
-  <g mask="url(#m)">
+  <mask id="${maskId}"><rect width="${stRectWidth}" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#${maskId})">
    <rect width="${stRectWidth}" height="200" fill="#${color}" x="0"/>
-    <rect width="${stRectWidth}" height="200" fill="url(#a)"/>
+    <rect width="${stRectWidth}" height="200" fill="url(#${gradientId})"/>
  </g>
  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
    <text x="65" y="148" textLength="${stTextWidth}" fill="#000" opacity="0.25">${status}</text>
@ -144,6 +155,17 @@ interface AccessibleTextProps {
  label?: string;
 }

+function generateRandomID(length: number): string {
+  const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
+  let result = '';
+
+  for (let i = 0; i < length; i++) {
+    result += characters.charAt(Math.floor(Math.random() * characters.length));
+  }
+
+  return result;
+}
+
 function createAccessibleText({label, status}: AccessibleTextProps): string {
  const labelPrefix = label ? `${label}: ` : '';
  return labelPrefix + status;
--- a/tap-snapshots/test-badgen.spec.ts-TAP.test.js
+++ b/tap-snapshots/test-badgen.spec.ts-TAP.test.js
@ -5,6 +5,48 @@
 * Make sure to inspect the output below.  Do not ignore changes!
 */
 'use strict'
+exports[`test/badgen.spec.ts TAP ensure badgen() correctly escapes string inputs > snapshot 1`] = `
+<svg width="191.2" height="20" viewBox="0 0 1912 200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" aria-label="&lt;escape me&gt;: &lt;escape me&gt;">
+  <title>&lt;escape me&gt;: &lt;escape me&gt;</title>
+  <linearGradient id="a" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="m"><rect width="1912" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#m)">
+    <rect width="1036" height="200" fill="#&lt;escape me&gt;"/>
+    <rect width="876" height="200" fill="#&lt;escape me&gt;" x="1036"/>
+    <rect width="1912" height="200" fill="url(#a)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="220" y="148" textLength="776" fill="#000" opacity="0.25">&lt;escape me&gt;</text>
+    <text x="210" y="138" textLength="776">&lt;escape me&gt;</text>
+    <text x="1091" y="148" textLength="776" fill="#000" opacity="0.25">&lt;escape me&gt;</text>
+    <text x="1081" y="138" textLength="776">&lt;escape me&gt;</text>
+  </g>
+  <image x="40" y="35" width="130" height="130" xlink:href="&lt;escape me&gt;"/>
+</svg>
+`
+
+exports[`test/badgen.spec.ts TAP ensure bare() correctly escapes string inputs > snapshot 1`] = `
+<svg width="89.1" height="20" viewBox="0 0 891 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="&lt;escape me&gt;">
+  <title>&lt;escape me&gt;</title>
+  <linearGradient id="a" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="m"><rect width="891" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#m)">
+    <rect width="891" height="200" fill="#&lt;escape me&gt;" x="0"/>
+    <rect width="891" height="200" fill="url(#a)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="65" y="148" textLength="776" fill="#000" opacity="0.25">&lt;escape me&gt;</text>
+    <text x="55" y="138" textLength="776">&lt;escape me&gt;</text>
+  </g>
+</svg>
+`
+
 exports[`test/badgen.spec.ts TAP generate badge with { label, status } > snapshot 1`] = `
 <svg width="80.4" height="20" viewBox="0 0 804 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="npm: v1.0.0">
  <title>npm: v1.0.0</title>
--- a/tap-snapshots/test-calc-width.spec.js-TAP.test.js
+++ b/tap-snapshots/test-calc-width.spec.js-TAP.test.js
@ -5,18 +5,18 @@
 * Make sure to inspect the output below.  Do not ignore changes!
 */
 'use strict'
-exports[`test/calc-width.spec.js TAP calc width for "npm" > result is correct 1`] = `
+exports[`test/calc-width.spec.ts TAP calc width for "npm" > result is correct 1`] = `
 249
 `

-exports[`test/calc-width.spec.js TAP calc width for emojis > result is correct 1`] = `
+exports[`test/calc-width.spec.ts TAP calc width for emojis > result is correct 1`] = `
 330
 `

-exports[`test/calc-width.spec.js TAP calc width for special chars > result is correct 1`] = `
+exports[`test/calc-width.spec.ts TAP calc width for special chars > result is correct 1`] = `
 600
 `

-exports[`test/calc-width.spec.js TAP calc width for unicode > result is correct 1`] = `
+exports[`test/calc-width.spec.ts TAP calc width for unicode > result is correct 1`] = `
 550
 `
--- a/tap-snapshots/test/badgen.spec.js.test.cjs
+++ b/tap-snapshots/test/badgen.spec.js.test.cjs
@ -0,0 +1,265 @@
+/* IMPORTANT
+ * This snapshot file is auto-generated, but designed for humans.
+ * It should be checked into source control and tracked carefully.
+ * Re-generate by setting TAP_SNAPSHOT=1 and running tests.
+ * Make sure to inspect the output below.  Do not ignore changes!
+ */
+'use strict'
+exports[`test/badgen.spec.js TAP ensure badgen() correctly escapes string inputs > snapshot 1`] = `
+<svg width="191.2" height="20" viewBox="0 0 1912 200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" aria-label="&lt;escape me&gt;: &lt;escape me&gt;">
+  <title>&lt;escape me&gt;: &lt;escape me&gt;</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="1912" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="1036" height="200" fill="#&lt;escape me&gt;"/>
+    <rect width="876" height="200" fill="#&lt;escape me&gt;" x="1036"/>
+    <rect width="1912" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="220" y="148" textLength="776" fill="#000" opacity="0.25">&lt;escape me&gt;</text>
+    <text x="210" y="138" textLength="776">&lt;escape me&gt;</text>
+    <text x="1091" y="148" textLength="776" fill="#000" opacity="0.25">&lt;escape me&gt;</text>
+    <text x="1081" y="138" textLength="776">&lt;escape me&gt;</text>
+  </g>
+  <image x="40" y="35" width="130" height="130" xlink:href="&lt;escape me&gt;"/>
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP ensure bare() correctly escapes string inputs > snapshot 1`] = `
+<svg width="89.1" height="20" viewBox="0 0 891 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="&lt;escape me&gt;">
+  <title>&lt;escape me&gt;</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="891" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="891" height="200" fill="#&lt;escape me&gt;" x="0"/>
+    <rect width="891" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="65" y="148" textLength="776" fill="#000" opacity="0.25">&lt;escape me&gt;</text>
+    <text x="55" y="138" textLength="776">&lt;escape me&gt;</text>
+  </g>
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate badge with { label, status } > snapshot 1`] = `
+<svg width="80.4" height="20" viewBox="0 0 804 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="npm: v1.0.0">
+  <title>npm: v1.0.0</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="804" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="349" height="200" fill="#555"/>
+    <rect width="455" height="200" fill="#08C" x="349"/>
+    <rect width="804" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="60" y="148" textLength="249" fill="#000" opacity="0.25">npm</text>
+    <text x="50" y="138" textLength="249">npm</text>
+    <text x="404" y="148" textLength="355" fill="#000" opacity="0.25">v1.0.0</text>
+    <text x="394" y="138" textLength="355">v1.0.0</text>
+  </g>
+  
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate badge with { label, status, color } > snapshot 1`] = `
+<svg width="80.4" height="20" viewBox="0 0 804 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="npm: v1.0.0">
+  <title>npm: v1.0.0</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="804" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="349" height="200" fill="#555"/>
+    <rect width="455" height="200" fill="#ADF" x="349"/>
+    <rect width="804" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="60" y="148" textLength="249" fill="#000" opacity="0.25">npm</text>
+    <text x="50" y="138" textLength="249">npm</text>
+    <text x="404" y="148" textLength="355" fill="#000" opacity="0.25">v1.0.0</text>
+    <text x="394" y="138" textLength="355">v1.0.0</text>
+  </g>
+  
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate badge with { label, status, color, style } > snapshot 1`] = `
+<svg width="80.4" height="20" viewBox="0 0 804 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="npm: v1.0.0">
+  <title>npm: v1.0.0</title>
+  <g>
+    <rect fill="#555" width="349" height="200"/>
+    <rect fill="#ADF" x="349" width="455" height="200"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="60" y="148" textLength="249" fill="#000" opacity="0.1">npm</text>
+    <text x="50" y="138" textLength="249">npm</text>
+    <text x="404" y="148" textLength="355" fill="#000" opacity="0.1">v1.0.0</text>
+    <text x="394" y="138" textLength="355">v1.0.0</text>
+  </g>
+  
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate badge with { label, status, icon } > snapshot 1`] = `
+<svg width="95.5" height="20" viewBox="0 0 955 200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" aria-label="docker: icon">
+  <title>docker: icon</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="955" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="631" height="200" fill="#555"/>
+    <rect width="324" height="200" fill="#08C" x="631"/>
+    <rect width="955" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="220" y="148" textLength="371" fill="#000" opacity="0.25">docker</text>
+    <text x="210" y="138" textLength="371">docker</text>
+    <text x="686" y="148" textLength="224" fill="#000" opacity="0.25">icon</text>
+    <text x="676" y="138" textLength="224">icon</text>
+  </g>
+  <image x="40" y="35" width="130" height="130" xlink:href="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNGRkYiIHZpZXdCb3g9IjAgMCAyNCAyNCI+CiAgPHBhdGggZD0iTTE2LjIxIDguNjlsNi43Mi0xLjY4QTEyLjAzIDEyLjAzIDAgMCAxIDI0IDExLjk3YTEyLjA5IDEyLjA5IDAgMCAxLTEyLjk0IDEybDQuOS04LjM1Yy4zNi0uMzguNjYtLjguODktMS4yN2E1LjQ1IDUuNDUgMCAwIDAtLjA1LTQuNzUgNS4xNiA1LjE2IDAgMCAwLS41OS0uOTF6bS0zLjI0IDguNTdsLTIuMTIgNi42OUExMi4wMiAxMi4wMiAwIDAgMSAyLjA0IDUuMjhsNC44MyA4LjM4Yy4xOC41NCAxLjEyIDIuNTggMy4wNyAzLjMyIDEgLjM5IDIuMDQuNDggMy4wMy4yOXptLTEtOS42NGE0LjUyIDQuNTIgMCAwIDAtNC4yOCAzLjUxIDQuNDggNC40OCAwIDAgMCAxLjI0IDQuMDMgNC40OSA0LjQ5IDAgMCAwIDQuNzMuOTMgNC40OSA0LjQ5IDAgMCAwIDIuNy0zLjQzIDQuNTMgNC41MyAwIDAgMC0yLjUtNC42MyA0LjQxIDQuNDEgMCAwIDAtMS44OS0uNDF6TTcuMDUgOS45NmwtNC44LTVBMTIuMDQgMTIuMDQgMCAwIDEgMTIgMGM0LjU2IDAgOC43NCAyLjYgMTAuNzcgNi42N0gxMi41NmE1LjU0IDUuNTQgMCAwIDAtNC4yNyAxLjQ2IDUuMzQgNS4zNCAwIDAgMC0xLjI0IDEuODN6Ii8+Cjwvc3ZnPgo="/>
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate badge with { label, status, icon, style } > snapshot 1`] = `
+<svg width="95.5" height="20" viewBox="0 0 955 200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" aria-label="docker: icon">
+  <title>docker: icon</title>
+  <g>
+    <rect fill="#555" width="631" height="200"/>
+    <rect fill="#08C" x="631" width="324" height="200"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="220" y="148" textLength="371" fill="#000" opacity="0.1">docker</text>
+    <text x="210" y="138" textLength="371">docker</text>
+    <text x="686" y="148" textLength="224" fill="#000" opacity="0.1">icon</text>
+    <text x="676" y="138" textLength="224">icon</text>
+  </g>
+  <image x="40" y="35" width="130" height="132" xlink:href="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNDAuOTI1IiBoZWlnaHQ9IjIwMi42NzYiIHZpZXdCb3g9IjAgMCA5MC4yMDMgNTMuNjI1Ij48ZyBmaWxsPSIjZmZmIj48cGF0aCBvcGFjaXR5PSIuNDU2IiBkPSJNNDUuMjE2IDMuODI2Yy0xMi44MzYgMC0yMi4yOCAzLjYzNC0yNi44ODQgMTAuNTMxLS4wOTEtLjEwNi0uMTcxLS4xNzItLjI2Ni0uMzAyLS40NTktLjYyOS0uOTQ1LTEuNDg2LTEuNDI4LTIuMzg0LS40ODQtLjg5OC0uOTY3LTEuODM1LTEuNDg1LTIuNjctLjUxOC0uODM1LTEuMDI1LTEuNTkzLTEuODc0LTIuMTE2LS45MjctLjU3My0xLjczMy0uODI4LTIuMzQ3LS45MTZhMy42ODMgMy42ODMgMCAwIDAtLjg2Mi0uMDE1Yy0xLjUzNS4wMDYtMi43MTQgMS4wMTgtMy42MiAyLjI1NS0uOTEgMS4yNDEtMS42MDkgMi44MzUtMi4wNDIgNC41ODYtLjg2NiAzLjQ5OS0uNzAzIDcuNzU4IDIuMDU2IDEwLjU2IDEuNDYgMS40OTMgMy40MDQgMi4zNSA1LjI2NSAyLjg1IDEuMzIuMzU1IDIuNTMuNDc4IDMuNjI5LjUwOS42MDggNy4xMzMgNC43OTcgMTMuNDA2IDEwLjM5IDE2LjU1OWguMDAxYzIuOTg1IDEuNjc3IDYuMDg0IDIuNTM4IDguNzk5IDMuNTc3IDMuNDY4IDEuMzQgNi44MzQgMi42NDMgMTAuMzY2IDIuOTUybC4wNTguMDA2aC40MDVjMy43MDUgMCA3LjA3Ni0xLjY1NiAxMC40NzgtMi45NTYgMi43MS0xLjAzNyA1LjgxMi0xLjg3NiA4LjgwMi0zLjU1NiA1LjYyMy0zLjE1MiA5LjgxLTkuNDQgMTAuNDItMTYuNTcyIDIuNjc4LS4wNTIgNi4zNTYtLjgyOCA4Ljg0MS0zLjM2NyAyLjc2MS0yLjgwMiAyLjkyNS03LjA2MiAyLjA1OC0xMC41NjItLjQzMy0xLjc1LTEuMTMxLTMuMzQ1LTIuMDQxLTQuNTg2LS45MDctMS4yMzctMi4wODYtMi4yNS0zLjYyMS0yLjI1NWEzLjY4NCAzLjY4NCAwIDAgMC0uODYyLjAxNWMtLjYxNC4wODgtMS40Mi4zNDMtMi4zNDguOTE2LS44NDQuNTItMS4zNSAxLjI3My0xLjg2NSAyLjEwMi0uNTE2LjgzLS45OTcgMS43Ni0xLjQ3OCAyLjY1NS0uNDguODk0LS45NjQgMS43NS0xLjQyIDIuMzgyLS4wOTQuMTMtLjE3NC4xOTctLjI2NC4zMDMtNC42MTEtNi44Ny0xNC4wNDUtMTAuNS0yNi44Ni0xMC41eiIvPjxwYXRoIGQ9Ik00NS4xMyAwQzM0LjE3OCAwIDI0LjkyMiAyLjU1MSAxOC44NCA3LjkyOGMtLjE4NC0uMzI3LS4zMTktLjYxLS41My0uOTQ5LS42MzYtMS4wMjUtMS4yMzEtMi4xODktMy4xMS0zLjM0Ny0xLjMzMS0uODIzLTIuNjU3LTEuMjgyLTMuODEtMS40NS0uNTc0LS4wODItMS4yNDItLjA1NS0xLjc2OC0uMDA3bC4zNzEtLjA0N2MtMy40MTcgMC01LjQyMSAyLjA1LTYuNzE4IDMuODE4QzEuOTggNy43MTUgMS4xNDUgOS43LjYwNyAxMS44NzJjLTEuMDc1IDQuMzQzLTEuMDg4IDkuOTY1IDMuMDQgMTQuMTYgMi4xNjQgMi4yMDggNC43MDYgMy4yNDQgNy4wMDUgMy44Ni40NDMuMTE4LjgzNy4xNDggMS4yNjIuMjM2IDEuNDk5IDcuMTEgNS45MzYgMTMuMTIzIDExLjg3IDE2LjQ2N2wuMDAyLjAwMy4wMDQuMDAxYzMuNDkxIDEuOTYyIDYuODA2IDIuODYgOS4yOSAzLjgxIDMuNDc2IDEuMzQgNy4xNCAyLjgyMyAxMS40MTMgMy4xOTdsLjIyNC4wMmguNTY3YzQuOTA1IDAgOC42MjctMS45ODIgMTEuODQ2LTMuMjEyaC4wMDJjMi40Ni0uOTQyIDUuNzg4LTEuODE0IDkuMzA1LTMuNzlhMjMuMTM5IDIzLjEzOSAwIDAgMCA0LjQ5OC0zLjMwOSAyNS40MDMgMjUuNDAzIDAgMCAwIDcuMzkyLTEyLjk2MmMyLjcyNy0uNDY2IDUuNjItMS42NiA4LjIzLTQuMzIzIDQuMTI2LTQuMTk0IDQuMTE0LTkuODE2IDMuMDQtMTQuMTU4LS41MzktMi4xNzItMS4zNzMtNC4xNTctMi42Ny01LjkyNi0xLjI5Ni0xLjc2OS0zLjMtMy44MTgtNi43MTctMy44MThsLjM3OC4wNDhjLS41My0uMDQ4LTEuMi0uMDc2LTEuNzc1LjAwNy0xLjE1Mi4xNjgtMi40NzMuNjI4LTMuOCAxLjQ0OC0xLjg3MyAxLjE1NC0yLjQ3IDIuMzE1LTMuMTA1IDMuMzM2LS4yMDguMzM0LS4zNC42MTMtLjUyMi45MzZDNjUuMzA2IDIuNTQ2IDU2LjA2NSAwIDQ1LjEzIDB6bS4wODcgNS4xNWMxMy4zNjkgMCAyMi42MDIgNC4wMDMgMjYuNTI2IDExLjE2NSAyLjM2NC0uOTE3IDQuMTA3LTcuMTA1IDYuMDU2LTguMzA0IDEuNTc4LS45NzYgMi41MDEtLjczNSAyLjUwMS0uNzM1IDMuNTcxIDAgNy4yNSAxMC41MTMgMi42NzUgMTUuMTU0LTIuNDE4IDIuNDcxLTYuODgxIDMuMTY1LTkuMTA0IDIuOTg4LS4xNjggNy4xNjMtNC4zNDEgMTMuNjMtOS44NjIgMTYuNzI0LTIuODA5IDEuNTc4LTUuODMyIDIuNDA0LTguNjI3IDMuNDc0LTMuNDY0IDEuMzI1LTYuNzE1IDIuODY4LTEwLjAwNiAyLjg2OGgtLjM0N2MtMy4yNzctLjI4Ni02LjU0LTEuNTMtMTAuMDA1LTIuODY4LTIuNzk2LTEuMDctNS44MTgtMS45MTgtOC42MjctMy40OTYtNS40OS0zLjA5NS05LjY2Ni05LjU0Mi05LjgzNC0xNi43MDQtMi4yMDYuMTktNi43MTktLjQ5Ny05LjE1NS0yLjk4Ni00LjU3NC00LjY0LS44OTUtMTUuMTU0IDIuNjc2LTE1LjE1NCAwIDAgLjkyMy0uMjQxIDIuNTAxLjczNSAxLjk2IDEuMjA1IDMuNzEgNy40NTQgNi4wOTQgOC4zMTlDMjIuNTk3IDkuMTUgMzEuODM2IDUuMTUgNDUuMjE3IDUuMTV6Ii8+PHBhdGggZD0iTTQ3LjE0IDQwLjk5Yy45MDIgMCAxLjQyMy0uNTg0IDEuNDIzLTEuMzczIDAtMS4yMzktLjUyMi0xLjcxNC0xLjQxOC0xLjc4Ni0uMzItLjAyNi0uNTg0LjA2NS0uNjc0LjM0Ny0uMDkuMjgyLjA1NC42MzMuMzQ3LjY3NC42ODYuMDk3LjY4NS4yMTYuNjg1LjU2NiAwIC4zNDgtLjQwMi40OTQtLjQ4NS41MTNhLjUzNi41MzYgMCAwIDAgLjEyMSAxLjA1OG0tMy44MzMuMDAxYy0uOTAyIDAtMS40MjMtLjU4NC0xLjQyMy0xLjM3MyAwLTEuMjM5LjUyMS0xLjcxNCAxLjQxNy0xLjc4Ni4zMjEtLjAyNi41ODQuMDY1LjY3NS4zNDcuMDkuMjgyLS4wNTQuNjMzLS4zNDcuNjc0LS42ODYuMDk3LS42ODYuMjE2LS42ODYuNTY2IDAgLjM0OC40MDMuNDk0LjQ4Ni41MTNhLjUzNi41MzYgMCAwIDEtLjEyMiAxLjA1OG0xNi40NzYtMjcuMDgxYy02LjMzNiAwLTExLjQ3MiA1LjEzNy0xMS40NzIgMTEuNDczIDAgNi4zMzYgNS4xMzYgMTEuNDczIDExLjQ3MiAxMS40NzMgNi4zMzYgMCAxMS40NzMtNS4xMzcgMTEuNDczLTExLjQ3MyAwLTYuMzM2LTUuMTM3LTExLjQ3My0xMS40NzMtMTEuNDczem0tMS42MDYgNi40NGE1LjEgNS4xIDAgMCAxIDAgMTAuMTk3IDUuMDk4IDUuMDk4IDAgMCAxLTQuOTM4LTYuMzY3IDIuMTQ0IDIuMTQ0IDAgMSAwIDIuMDc0LTIuOTUgNS4wNzIgNS4wNzIgMCAwIDEgMi44NjQtLjg4em0tMjcuNTI1LTYuNDRjLTYuMzM2IDAtMTEuNDcyIDUuMTM3LTExLjQ3MiAxMS40NzMgMCA2LjMzNiA1LjEzNiAxMS40NzMgMTEuNDcyIDExLjQ3MyA2LjMzNiAwIDExLjQ3My01LjEzNyAxMS40NzMtMTEuNDczIDAtNi4zMzYtNS4xMzctMTEuNDczLTExLjQ3My0xMS40NzN6bTEuNjQgNi40NGE1LjEgNS4xIDAgMCAxIDAgMTAuMTk3IDUuMDk4IDUuMDk4IDAgMCAxLTQuOTM4LTYuMzY3IDIuMTQ0IDIuMTQ0IDAgMCAwIDQuMTI3LS44MSAyLjE0MiAyLjE0MiAwIDAgMC0yLjA1NC0yLjE0IDUuMDc0IDUuMDc0IDAgMCAxIDIuODY0LS44OHoiLz48L2c+PC9zdmc+"/>
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate badge with { label, status, style } > snapshot 1`] = `
+<svg width="80.4" height="20" viewBox="0 0 804 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="npm: v1.0.0">
+  <title>npm: v1.0.0</title>
+  <g>
+    <rect fill="#555" width="349" height="200"/>
+    <rect fill="#08C" x="349" width="455" height="200"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="60" y="148" textLength="249" fill="#000" opacity="0.1">npm</text>
+    <text x="50" y="138" textLength="249">npm</text>
+    <text x="404" y="148" textLength="355" fill="#000" opacity="0.1">v1.0.0</text>
+    <text x="394" y="138" textLength="355">v1.0.0</text>
+  </g>
+  
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate badge with { status, icon } > snapshot 1`] = `
+<svg width="53.6" height="20" viewBox="0 0 536 200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" aria-label="icon">
+  <title>icon</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="536" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="212" height="200" fill="#555"/>
+    <rect width="324" height="200" fill="#08C" x="212"/>
+    <rect width="536" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="172" y="148" textLength="0" fill="#000" opacity="0.25"></text>
+    <text x="162" y="138" textLength="0"></text>
+    <text x="267" y="148" textLength="224" fill="#000" opacity="0.25">icon</text>
+    <text x="257" y="138" textLength="224">icon</text>
+  </g>
+  <image x="40" y="35" width="130" height="130" xlink:href="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNGRkYiIHZpZXdCb3g9IjAgMCAyNCAyNCI+CiAgPHBhdGggZD0iTTE2LjIxIDguNjlsNi43Mi0xLjY4QTEyLjAzIDEyLjAzIDAgMCAxIDI0IDExLjk3YTEyLjA5IDEyLjA5IDAgMCAxLTEyLjk0IDEybDQuOS04LjM1Yy4zNi0uMzguNjYtLjguODktMS4yN2E1LjQ1IDUuNDUgMCAwIDAtLjA1LTQuNzUgNS4xNiA1LjE2IDAgMCAwLS41OS0uOTF6bS0zLjI0IDguNTdsLTIuMTIgNi42OUExMi4wMiAxMi4wMiAwIDAgMSAyLjA0IDUuMjhsNC44MyA4LjM4Yy4xOC41NCAxLjEyIDIuNTggMy4wNyAzLjMyIDEgLjM5IDIuMDQuNDggMy4wMy4yOXptLTEtOS42NGE0LjUyIDQuNTIgMCAwIDAtNC4yOCAzLjUxIDQuNDggNC40OCAwIDAgMCAxLjI0IDQuMDMgNC40OSA0LjQ5IDAgMCAwIDQuNzMuOTMgNC40OSA0LjQ5IDAgMCAwIDIuNy0zLjQzIDQuNTMgNC41MyAwIDAgMC0yLjUtNC42MyA0LjQxIDQuNDEgMCAwIDAtMS44OS0uNDF6TTcuMDUgOS45NmwtNC44LTVBMTIuMDQgMTIuMDQgMCAwIDEgMTIgMGM0LjU2IDAgOC43NCAyLjYgMTAuNzcgNi42N0gxMi41NmE1LjU0IDUuNTQgMCAwIDAtNC4yNyAxLjQ2IDUuMzQgNS4zNCAwIDAgMC0xLjI0IDEuODN6Ii8+Cjwvc3ZnPgo="/>
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate badge with { status, icon, iconWidth } > snapshot 1`] = `
+<svg width="59.6" height="20" viewBox="0 0 596 200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" aria-label="icon">
+  <title>icon</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="596" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="272" height="200" fill="#555"/>
+    <rect width="324" height="200" fill="#08C" x="272"/>
+    <rect width="596" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="232" y="148" textLength="0" fill="#000" opacity="0.25"></text>
+    <text x="222" y="138" textLength="0"></text>
+    <text x="327" y="148" textLength="224" fill="#000" opacity="0.25">icon</text>
+    <text x="317" y="138" textLength="224">icon</text>
+  </g>
+  <image x="40" y="35" width="190" height="130" xlink:href="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNDAuOTI1IiBoZWlnaHQ9IjIwMi42NzYiIHZpZXdCb3g9IjAgMCA5MC4yMDMgNTMuNjI1Ij48ZyBmaWxsPSIjZmZmIj48cGF0aCBvcGFjaXR5PSIuNDU2IiBkPSJNNDUuMjE2IDMuODI2Yy0xMi44MzYgMC0yMi4yOCAzLjYzNC0yNi44ODQgMTAuNTMxLS4wOTEtLjEwNi0uMTcxLS4xNzItLjI2Ni0uMzAyLS40NTktLjYyOS0uOTQ1LTEuNDg2LTEuNDI4LTIuMzg0LS40ODQtLjg5OC0uOTY3LTEuODM1LTEuNDg1LTIuNjctLjUxOC0uODM1LTEuMDI1LTEuNTkzLTEuODc0LTIuMTE2LS45MjctLjU3My0xLjczMy0uODI4LTIuMzQ3LS45MTZhMy42ODMgMy42ODMgMCAwIDAtLjg2Mi0uMDE1Yy0xLjUzNS4wMDYtMi43MTQgMS4wMTgtMy42MiAyLjI1NS0uOTEgMS4yNDEtMS42MDkgMi44MzUtMi4wNDIgNC41ODYtLjg2NiAzLjQ5OS0uNzAzIDcuNzU4IDIuMDU2IDEwLjU2IDEuNDYgMS40OTMgMy40MDQgMi4zNSA1LjI2NSAyLjg1IDEuMzIuMzU1IDIuNTMuNDc4IDMuNjI5LjUwOS42MDggNy4xMzMgNC43OTcgMTMuNDA2IDEwLjM5IDE2LjU1OWguMDAxYzIuOTg1IDEuNjc3IDYuMDg0IDIuNTM4IDguNzk5IDMuNTc3IDMuNDY4IDEuMzQgNi44MzQgMi42NDMgMTAuMzY2IDIuOTUybC4wNTguMDA2aC40MDVjMy43MDUgMCA3LjA3Ni0xLjY1NiAxMC40NzgtMi45NTYgMi43MS0xLjAzNyA1LjgxMi0xLjg3NiA4LjgwMi0zLjU1NiA1LjYyMy0zLjE1MiA5LjgxLTkuNDQgMTAuNDItMTYuNTcyIDIuNjc4LS4wNTIgNi4zNTYtLjgyOCA4Ljg0MS0zLjM2NyAyLjc2MS0yLjgwMiAyLjkyNS03LjA2MiAyLjA1OC0xMC41NjItLjQzMy0xLjc1LTEuMTMxLTMuMzQ1LTIuMDQxLTQuNTg2LS45MDctMS4yMzctMi4wODYtMi4yNS0zLjYyMS0yLjI1NWEzLjY4NCAzLjY4NCAwIDAgMC0uODYyLjAxNWMtLjYxNC4wODgtMS40Mi4zNDMtMi4zNDguOTE2LS44NDQuNTItMS4zNSAxLjI3My0xLjg2NSAyLjEwMi0uNTE2LjgzLS45OTcgMS43Ni0xLjQ3OCAyLjY1NS0uNDguODk0LS45NjQgMS43NS0xLjQyIDIuMzgyLS4wOTQuMTMtLjE3NC4xOTctLjI2NC4zMDMtNC42MTEtNi44Ny0xNC4wNDUtMTAuNS0yNi44Ni0xMC41eiIvPjxwYXRoIGQ9Ik00NS4xMyAwQzM0LjE3OCAwIDI0LjkyMiAyLjU1MSAxOC44NCA3LjkyOGMtLjE4NC0uMzI3LS4zMTktLjYxLS41My0uOTQ5LS42MzYtMS4wMjUtMS4yMzEtMi4xODktMy4xMS0zLjM0Ny0xLjMzMS0uODIzLTIuNjU3LTEuMjgyLTMuODEtMS40NS0uNTc0LS4wODItMS4yNDItLjA1NS0xLjc2OC0uMDA3bC4zNzEtLjA0N2MtMy40MTcgMC01LjQyMSAyLjA1LTYuNzE4IDMuODE4QzEuOTggNy43MTUgMS4xNDUgOS43LjYwNyAxMS44NzJjLTEuMDc1IDQuMzQzLTEuMDg4IDkuOTY1IDMuMDQgMTQuMTYgMi4xNjQgMi4yMDggNC43MDYgMy4yNDQgNy4wMDUgMy44Ni40NDMuMTE4LjgzNy4xNDggMS4yNjIuMjM2IDEuNDk5IDcuMTEgNS45MzYgMTMuMTIzIDExLjg3IDE2LjQ2N2wuMDAyLjAwMy4wMDQuMDAxYzMuNDkxIDEuOTYyIDYuODA2IDIuODYgOS4yOSAzLjgxIDMuNDc2IDEuMzQgNy4xNCAyLjgyMyAxMS40MTMgMy4xOTdsLjIyNC4wMmguNTY3YzQuOTA1IDAgOC42MjctMS45ODIgMTEuODQ2LTMuMjEyaC4wMDJjMi40Ni0uOTQyIDUuNzg4LTEuODE0IDkuMzA1LTMuNzlhMjMuMTM5IDIzLjEzOSAwIDAgMCA0LjQ5OC0zLjMwOSAyNS40MDMgMjUuNDAzIDAgMCAwIDcuMzkyLTEyLjk2MmMyLjcyNy0uNDY2IDUuNjItMS42NiA4LjIzLTQuMzIzIDQuMTI2LTQuMTk0IDQuMTE0LTkuODE2IDMuMDQtMTQuMTU4LS41MzktMi4xNzItMS4zNzMtNC4xNTctMi42Ny01LjkyNi0xLjI5Ni0xLjc2OS0zLjMtMy44MTgtNi43MTctMy44MThsLjM3OC4wNDhjLS41My0uMDQ4LTEuMi0uMDc2LTEuNzc1LjAwNy0xLjE1Mi4xNjgtMi40NzMuNjI4LTMuOCAxLjQ0OC0xLjg3MyAxLjE1NC0yLjQ3IDIuMzE1LTMuMTA1IDMuMzM2LS4yMDguMzM0LS4zNC42MTMtLjUyMi45MzZDNjUuMzA2IDIuNTQ2IDU2LjA2NSAwIDQ1LjEzIDB6bS4wODcgNS4xNWMxMy4zNjkgMCAyMi42MDIgNC4wMDMgMjYuNTI2IDExLjE2NSAyLjM2NC0uOTE3IDQuMTA3LTcuMTA1IDYuMDU2LTguMzA0IDEuNTc4LS45NzYgMi41MDEtLjczNSAyLjUwMS0uNzM1IDMuNTcxIDAgNy4yNSAxMC41MTMgMi42NzUgMTUuMTU0LTIuNDE4IDIuNDcxLTYuODgxIDMuMTY1LTkuMTA0IDIuOTg4LS4xNjggNy4xNjMtNC4zNDEgMTMuNjMtOS44NjIgMTYuNzI0LTIuODA5IDEuNTc4LTUuODMyIDIuNDA0LTguNjI3IDMuNDc0LTMuNDY0IDEuMzI1LTYuNzE1IDIuODY4LTEwLjAwNiAyLjg2OGgtLjM0N2MtMy4yNzctLjI4Ni02LjU0LTEuNTMtMTAuMDA1LTIuODY4LTIuNzk2LTEuMDctNS44MTgtMS45MTgtOC42MjctMy40OTYtNS40OS0zLjA5NS05LjY2Ni05LjU0Mi05LjgzNC0xNi43MDQtMi4yMDYuMTktNi43MTktLjQ5Ny05LjE1NS0yLjk4Ni00LjU3NC00LjY0LS44OTUtMTUuMTU0IDIuNjc2LTE1LjE1NCAwIDAgLjkyMy0uMjQxIDIuNTAxLjczNSAxLjk2IDEuMjA1IDMuNzEgNy40NTQgNi4wOTQgOC4zMTlDMjIuNTk3IDkuMTUgMzEuODM2IDUuMTUgNDUuMjE3IDUuMTV6Ii8+PHBhdGggZD0iTTQ3LjE0IDQwLjk5Yy45MDIgMCAxLjQyMy0uNTg0IDEuNDIzLTEuMzczIDAtMS4yMzktLjUyMi0xLjcxNC0xLjQxOC0xLjc4Ni0uMzItLjAyNi0uNTg0LjA2NS0uNjc0LjM0Ny0uMDkuMjgyLjA1NC42MzMuMzQ3LjY3NC42ODYuMDk3LjY4NS4yMTYuNjg1LjU2NiAwIC4zNDgtLjQwMi40OTQtLjQ4NS41MTNhLjUzNi41MzYgMCAwIDAgLjEyMSAxLjA1OG0tMy44MzMuMDAxYy0uOTAyIDAtMS40MjMtLjU4NC0xLjQyMy0xLjM3MyAwLTEuMjM5LjUyMS0xLjcxNCAxLjQxNy0xLjc4Ni4zMjEtLjAyNi41ODQuMDY1LjY3NS4zNDcuMDkuMjgyLS4wNTQuNjMzLS4zNDcuNjc0LS42ODYuMDk3LS42ODYuMjE2LS42ODYuNTY2IDAgLjM0OC40MDMuNDk0LjQ4Ni41MTNhLjUzNi41MzYgMCAwIDEtLjEyMiAxLjA1OG0xNi40NzYtMjcuMDgxYy02LjMzNiAwLTExLjQ3MiA1LjEzNy0xMS40NzIgMTEuNDczIDAgNi4zMzYgNS4xMzYgMTEuNDczIDExLjQ3MiAxMS40NzMgNi4zMzYgMCAxMS40NzMtNS4xMzcgMTEuNDczLTExLjQ3MyAwLTYuMzM2LTUuMTM3LTExLjQ3My0xMS40NzMtMTEuNDczem0tMS42MDYgNi40NGE1LjEgNS4xIDAgMCAxIDAgMTAuMTk3IDUuMDk4IDUuMDk4IDAgMCAxLTQuOTM4LTYuMzY3IDIuMTQ0IDIuMTQ0IDAgMSAwIDIuMDc0LTIuOTUgNS4wNzIgNS4wNzIgMCAwIDEgMi44NjQtLjg4em0tMjcuNTI1LTYuNDRjLTYuMzM2IDAtMTEuNDcyIDUuMTM3LTExLjQ3MiAxMS40NzMgMCA2LjMzNiA1LjEzNiAxMS40NzMgMTEuNDcyIDExLjQ3MyA2LjMzNiAwIDExLjQ3My01LjEzNyAxMS40NzMtMTEuNDczIDAtNi4zMzYtNS4xMzctMTEuNDczLTExLjQ3My0xMS40NzN6bTEuNjQgNi40NGE1LjEgNS4xIDAgMCAxIDAgMTAuMTk3IDUuMDk4IDUuMDk4IDAgMCAxLTQuOTM4LTYuMzY3IDIuMTQ0IDIuMTQ0IDAgMCAwIDQuMTI3LS44MSAyLjE0MiAyLjE0MiAwIDAgMC0yLjA1NC0yLjE0IDUuMDc0IDUuMDc0IDAgMCAxIDIuODY0LS44OHoiLz48L2c+PC9zdmc+"/>
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate bare badge with { status } > snapshot 1`] = `
+<svg width="47" height="20" viewBox="0 0 470 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="v1.0.0">
+  <title>v1.0.0</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="470" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="470" height="200" fill="#08C" x="0"/>
+    <rect width="470" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="65" y="148" textLength="355" fill="#000" opacity="0.25">v1.0.0</text>
+    <text x="55" y="138" textLength="355">v1.0.0</text>
+  </g>
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate bare badge with { status, color } > snapshot 1`] = `
+<svg width="47" height="20" viewBox="0 0 470 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="v1.0.0">
+  <title>v1.0.0</title>
+  <linearGradient id="aaaaa" x2="0" y2="100%">
+    <stop offset="0" stop-opacity=".1" stop-color="#EEE"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <mask id="aaaaa"><rect width="470" height="200" rx="30" fill="#FFF"/></mask>
+  <g mask="url(#aaaaa)">
+    <rect width="470" height="200" fill="#ADF" x="0"/>
+    <rect width="470" height="200" fill="url(#aaaaa)"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="65" y="148" textLength="355" fill="#000" opacity="0.25">v1.0.0</text>
+    <text x="55" y="138" textLength="355">v1.0.0</text>
+  </g>
+</svg>
+`
+
+exports[`test/badgen.spec.js TAP generate bare badge with { status, style } > snapshot 1`] = `
+<svg width="47" height="20" viewBox="0 0 470 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="v1.0.0">
+  <title>v1.0.0</title>
+  <g>
+    <rect fill="#08C" x="0" width="470" height="200"/>
+  </g>
+  <g aria-hidden="true" fill="#fff" text-anchor="start" font-family="Verdana,DejaVu Sans,sans-serif" font-size="110">
+    <text x="65" y="148" textLength="355" fill="#000" opacity="0.1">v1.0.0</text>
+    <text x="55" y="138" textLength="355">v1.0.0</text>
+  </g>
+</svg>
+`
--- a/tap-snapshots/test-calc-width.spec.ts-TAP.test.js
+++ b/tap-snapshots/test-calc-width.spec.ts-TAP.test.js
@ -5,18 +5,18 @@
 * Make sure to inspect the output below.  Do not ignore changes!
 */
 'use strict'
-exports[`test/calc-width.spec.ts TAP calc width for "npm" > result is correct 1`] = `
+exports[`test/calc-width.spec.js TAP calc width for "npm" > result is correct 1`] = `
 249
 `

-exports[`test/calc-width.spec.ts TAP calc width for emojis > result is correct 1`] = `
+exports[`test/calc-width.spec.js TAP calc width for emojis > result is correct 1`] = `
 330
 `

-exports[`test/calc-width.spec.ts TAP calc width for special chars > result is correct 1`] = `
+exports[`test/calc-width.spec.js TAP calc width for special chars > result is correct 1`] = `
 600
 `

-exports[`test/calc-width.spec.ts TAP calc width for unicode > result is correct 1`] = `
+exports[`test/calc-width.spec.js TAP calc width for unicode > result is correct 1`] = `
 550
 `
--- a/test/badgen.spec.js
+++ b/test/badgen.spec.js
@ -1,6 +1,13 @@
-import tap from 'tap'
-import { badgen } from '../dist'
-import * as icons from './assets/icon-data-uri.js'
+const tap = require('tap')
+const { badgen } = require('../dist')
+const icons = require('./assets/icon-data-uri.js')
+
+const originalMath = global.Math
+const mockMath = Object.create(global.Math)
+mockMath.random = () => 0.5
+
+tap.beforeEach(async t => { global.Math = mockMath })
+tap.afterEach(async t => { global.Math = originalMath })

 tap.test('generate badge with { label, status }', t => {
  const svg = badgen({ label: 'npm', status: 'v1.0.0' })
@ -54,6 +61,18 @@ tap.test('generate badge with { label, status, icon, style }', t => {
  t.end()
 })

+tap.test('ensure badgen() correctly escapes string inputs', t => {
+  const svg = badgen({
+    label: '<escape me>',
+    status: '<escape me>',
+    color: '<escape me>',
+    icon: '<escape me>',
+    labelColor: '<escape me>',
+  })
+  t.matchSnapshot(svg, 'snapshot')
+  t.end()
+})
+
 tap.test('generate bare badge with { status }', t => {
  const svg = badgen({ status: 'v1.0.0' })
  t.ok(typeof svg === 'string', 'successfully generated')
@ -75,6 +94,15 @@ tap.test('generate bare badge with { status, style }', t => {
  t.end()
 })

+tap.test('ensure bare() correctly escapes string inputs', t => {
+  const svg = badgen({
+    status: '<escape me>',
+    color: '<escape me>',
+  })
+  t.matchSnapshot(svg, 'snapshot')
+  t.end()
+})
+
 tap.test('type checking', t => {
  // @ts-ignore
  t.throws(() => badgen({}), TypeError, 'throw if status is non-string')
--- a/test/calc-width.spec.js
+++ b/test/calc-width.spec.js
@ -1,5 +1,5 @@
-import tap from 'tap'
-import { calcWidth } from '../dist'
+const tap = require('tap')
+const { calcWidth } = require('../dist')

 tap.test('basic functions', t => {
  t.ok(typeof calcWidth === 'function', 'export calcWidth function')
--- a/tsconfig.json
+++ b/tsconfig.json
@ -1,5 +1,7 @@
 {
  "compilerOptions": {
+    "strict": true,
+
    "target": "es2017",
    "module": "commonjs",
    "lib": ["esnext", "dom"],
@ -12,7 +14,8 @@

    "resolveJsonModule": true,
    "experimentalDecorators": true,
-    "allowSyntheticDefaultImports": true
+    "allowSyntheticDefaultImports": true,
+    "forceConsistentCasingInFileNames": true,
  },
  "include": ["src"]
 }
Autor	SHA1	Wiadomość	Data
Amio	a303e46dad	3.2.3	2023-07-21 20:04:46 +08:00
Amio Jin	23108a625f	fix: generate random id for svg elements. Fixes #71 (#78 )	2023-06-22 15:36:02 +08:00
dependabot[bot]	25ee3bd4bd	build(deps): bump json5 from 2.2.1 to 2.2.3 (#76 ) Bumps [json5](https://github.com/json5/json5) from 2.2.1 to 2.2.3. - [Release notes](https://github.com/json5/json5/releases) - [Changelog](https://github.com/json5/json5/blob/main/CHANGELOG.md) - [Commits](https://github.com/json5/json5/compare/v2.2.1...v2.2.3) --- updated-dependencies: - dependency-name: json5 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2023-02-24 18:33:45 +08:00
简静凡	665dc507ee	feat: export typescript types (#77 ) - export type StyleOption - export type ColorPreset - export type BadgenOptions	2023-02-24 18:33:13 +08:00
Amio	fdfe99c051	fix: correctly render undefined label	2022-04-30 17:31:10 +08:00
Amio	2ca1ce4755	chore: disable coverage check in tap	2022-04-30 17:14:20 +08:00
Amio	609f95c21a	chore: remove test for nodejs 8 and 10	2022-04-30 17:14:20 +08:00
Amio	18f79c98b8	chore: bump esbuild to 0.14, tap to 16	2022-04-30 17:14:20 +08:00
Amio	49b999f5da	chore: update tsconfig	2022-04-30 17:14:20 +08:00
Amio	ef2f2914d8	chore: npm update	2022-04-30 17:14:20 +08:00
Andrew Patton	ab4c32e145	docs: fix in-browser code sample (#72 )	2022-04-30 15:54:32 +08:00
chris48s	df6c6f026d	feat: apply escaping to all string inputs (#68 )	2021-03-28 11:25:47 +08:00