From f65d64aa53b8d541df092e1e52d07f341cf4ac09 Mon Sep 17 00:00:00 2001
From: Zeno Zeng <zenoofzeng@gmail.com>
Date: Thu, 3 Feb 2022 12:05:24 +0800
Subject: [PATCH] utils.toString for
 https://github.com/zenozeng/p5.js-svg/issues/204

---
 README.md         | 4 ++++
 context.js        | 5 ++++-
 package-lock.json | 5 +++--
 package.json      | 2 +-
 utils.js          | 8 ++++++++
 5 files changed, 20 insertions(+), 4 deletions(-)
 create mode 100644 utils.js

diff --git a/README.md b/README.md
index 35d6e9c..3001f8e 100644
--- a/README.md
+++ b/README.md
@@ -28,6 +28,10 @@ const mySerializedSVG = ctx.getSerializedSvg();
 
 ## CHANGELOG
 
+### v2.0.6
+
+- utils.toString for https://github.com/zenozeng/p5.js-svg/issues/204
+
 ### v2.0.5
 
 - Fix adding CanvasPattern ([Xavier Delamotte](https://github.com/x4d3)) [#7](https://github.com/zenozeng/svgcanvas/pull/7)
diff --git a/context.js b/context.js
index 2d58188..9002ef8 100644
--- a/context.js
+++ b/context.js
@@ -13,6 +13,8 @@
  *  Copyright (c) 2021 Zeno Zeng
  */
 
+import * as utils from 'utils';
+
 export default (function () {
     "use strict";
 
@@ -194,6 +196,7 @@ export default (function () {
     CanvasGradient.prototype.addColorStop = function (offset, color) {
         var stop = this.__ctx.__createElement("stop"), regex, matches;
         stop.setAttribute("offset", offset);
+        color = utils.toString(color);
         if (color.indexOf("rgba") !== -1) {
             //separate alpha value, since webkit can't handle it
             regex = /rgba\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d?\.?\d*)\s*\)/gi;
@@ -394,7 +397,7 @@ export default (function () {
                     //gradient
                     currentElement.setAttribute(style.apply, format("url(#{id})", {id:value.__root.getAttribute("id")}));
                 } else if (style.apply.indexOf(type)!==-1 && style.svg !== value) {
-                    if ((style.svgAttr === "stroke" || style.svgAttr === "fill") && value.indexOf("rgba") !== -1) {
+                    if ((style.svgAttr === "stroke" || style.svgAttr === "fill") && utils.toString(value).indexOf("rgba") !== -1) {
                         //separate alpha value, since illustrator can't handle it
                         regex = /rgba\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d?\.?\d*)\s*\)/gi;
                         matches = regex.exec(value);
diff --git a/package-lock.json b/package-lock.json
index d529749..5348861 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,11 +1,12 @@
 {
   "name": "svgcanvas",
-  "version": "2.0.1",
+  "version": "2.0.6",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
-      "version": "2.0.1",
+      "name": "svgcanvas",
+      "version": "2.0.6",
       "license": "MIT",
       "devDependencies": {
         "rollup": "^2.51.1"
diff --git a/package.json b/package.json
index 9ff8c63..77e74f7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "svgcanvas",
-  "version": "2.0.5",
+  "version": "2.0.6",
   "description": "svgcanvas",
   "main": "dist/svgcanvas.js",
   "scripts": {
diff --git a/utils.js b/utils.js
new file mode 100644
index 0000000..baa79e7
--- /dev/null
+++ b/utils.js
@@ -0,0 +1,8 @@
+function toString(obj) {
+    if (typeof obj === 'string') {
+        return obj
+    }
+    return obj.toString()
+}
+
+export {toString};
\ No newline at end of file