From 1eb4ac7f3457b83313895e48880c1cb81edf2070 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thomas=20Lov=C3=A9n?= <thomasloven@gmail.com>
Date: Fri, 19 Oct 2018 00:01:23 +0200
Subject: [PATCH 1/4] Safer brightness calculation for icons

---
 src/components/entity/state-badge.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/entity/state-badge.js b/src/components/entity/state-badge.js
index f0b1124bed..5c293c5261 100644
--- a/src/components/entity/state-badge.js
+++ b/src/components/entity/state-badge.js
@@ -89,7 +89,7 @@ class StateBadge extends PolymerElement {
       if (newVal.attributes.brightness) {
         const brightness = newVal.attributes.brightness;
         // lowest brighntess will be around 50% (that's pretty dark)
-        iconStyle.filter = `brightness(${(brightness + 245) / 5}%)`;
+        iconStyle.filter = `brightness(${(parseInt(brightness) + 245) / 5}%)`;
       }
     }
     Object.assign(this.$.icon.style, iconStyle);

From bdc2b31202bb2b526a32967e724aab6470ae96a6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thomas=20Lov=C3=A9n?= <thomasloven@gmail.com>
Date: Fri, 19 Oct 2018 12:07:33 +0200
Subject: [PATCH 2/4] Complain and ignore instead of fixing

---
 src/components/entity/state-badge.js | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/components/entity/state-badge.js b/src/components/entity/state-badge.js
index 5c293c5261..648bd5726d 100644
--- a/src/components/entity/state-badge.js
+++ b/src/components/entity/state-badge.js
@@ -88,8 +88,17 @@ class StateBadge extends PolymerElement {
       }
       if (newVal.attributes.brightness) {
         const brightness = newVal.attributes.brightness;
-        // lowest brighntess will be around 50% (that's pretty dark)
-        iconStyle.filter = `brightness(${(parseInt(brightness) + 245) / 5}%)`;
+        if (typeof brightness !== "number" || isNaN(brightness)) {
+          console.warn(
+            "Type error: state-badge expected number, but type of " +
+              newVal.entity_id +
+              ".attributes.brightness is " +
+              typeof brightness
+          );
+        } else {
+          // lowest brighntess will be around 50% (that's pretty dark)
+          iconStyle.filter = `brightness(${(brightness + 245) / 5}%)`;
+        }
       }
     }
     Object.assign(this.$.icon.style, iconStyle);

From 1589c3fc5129c68fd225f968822443365f795d78 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thomas=20Lov=C3=A9n?= <thomasloven@gmail.com>
Date: Fri, 19 Oct 2018 15:29:05 +0200
Subject: [PATCH 3/4] Better error message

---
 src/components/entity/state-badge.js | 21 +++++++++++----------
 1 file changed, 11 insertions(+), 10 deletions(-)

diff --git a/src/components/entity/state-badge.js b/src/components/entity/state-badge.js
index 648bd5726d..eacc96eecb 100644
--- a/src/components/entity/state-badge.js
+++ b/src/components/entity/state-badge.js
@@ -68,6 +68,7 @@ class StateBadge extends PolymerElement {
   }
 
   _updateIconAppearance(newVal) {
+    var errorMessage = null;
     const iconStyle = {
       color: "",
       filter: "",
@@ -88,21 +89,21 @@ class StateBadge extends PolymerElement {
       }
       if (newVal.attributes.brightness) {
         const brightness = newVal.attributes.brightness;
-        if (typeof brightness !== "number" || isNaN(brightness)) {
-          console.warn(
-            "Type error: state-badge expected number, but type of " +
-              newVal.entity_id +
-              ".attributes.brightness is " +
-              typeof brightness
-          );
-        } else {
-          // lowest brighntess will be around 50% (that's pretty dark)
-          iconStyle.filter = `brightness(${(brightness + 245) / 5}%)`;
+        if (typeof brightness !== "number") {
+          errorMessage = `Type error: state-badge expected number, but type of ${
+            newVal.entity_id
+          }.attributes.brightness is ${typeof brightness} (${brightness})`;
+          console.warn(errorMessage);
         }
+        // lowest brighntess will be around 50% (that's pretty dark)
+        iconStyle.filter = `brightness(${(brightness + 245) / 5}%)`;
       }
     }
     Object.assign(this.$.icon.style, iconStyle);
     Object.assign(this.style, hostStyle);
+    if (errorMessage) {
+      throw new Error(`Frontend error: ${message}`);
+    }
   }
 }
 customElements.define("state-badge", StateBadge);

From c9d140281bb906ab3693f00517eb0f5b9bf9aad4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thomas=20Lov=C3=A9n?= <thomasloven@gmail.com>
Date: Fri, 19 Oct 2018 16:35:52 +0200
Subject: [PATCH 4/4] fix typo in variable name

---
 src/components/entity/state-badge.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/entity/state-badge.js b/src/components/entity/state-badge.js
index eacc96eecb..27a401db67 100644
--- a/src/components/entity/state-badge.js
+++ b/src/components/entity/state-badge.js
@@ -102,7 +102,7 @@ class StateBadge extends PolymerElement {
     Object.assign(this.$.icon.style, iconStyle);
     Object.assign(this.style, hostStyle);
     if (errorMessage) {
-      throw new Error(`Frontend error: ${message}`);
+      throw new Error(`Frontend error: ${errorMessage}`);
     }
   }
 }