diff --git a/src/assets/test/image_from_readme.svg b/src/assets/test/image_from_readme.svg index faf1be5f..6837c6fa 100644 --- a/src/assets/test/image_from_readme.svg +++ b/src/assets/test/image_from_readme.svg @@ -1,2 +1,2 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/core/QRSVG.ts b/src/core/QRSVG.ts index 8708adff..9f7148ef 100644 --- a/src/core/QRSVG.ts +++ b/src/core/QRSVG.ts @@ -153,22 +153,9 @@ export default class QRSVG { const color = options.backgroundOptions?.color; if (gradientOptions || color) { - this._createColor({ - options: gradientOptions, - color: color, - additionalRotation: 0, - x: 0, - y: 0, - height: options.height, - width: options.width, - name: `background-color-${this._instanceId}` - }); - } - - if (options.backgroundOptions?.round) { const size = Math.min(options.width, options.height); - const element = document.createElementNS("http://www.w3.org/2000/svg", "rect"); - this._backgroundClipPath = document.createElementNS("http://www.w3.org/2000/svg", "clipPath"); + const element = this._window.document.createElementNS("http://www.w3.org/2000/svg", "rect"); + this._backgroundClipPath = this._window.document.createElementNS("http://www.w3.org/2000/svg", "clipPath"); this._backgroundClipPath.setAttribute("id", `clip-path-background-color-${this._instanceId}`); this._defs.appendChild(this._backgroundClipPath); @@ -179,6 +166,17 @@ export default class QRSVG { element.setAttribute("rx", String((size / 2) * options.backgroundOptions.round)); this._backgroundClipPath.appendChild(element); + + this._createColor({ + options: gradientOptions, + color: color, + additionalRotation: 0, + x: 0, + y: 0, + height: options.height, + width: options.width, + name: `background-color-${this._instanceId}` + }); } } }