Update lint rules (#6490)

.eslintrc.json

@@ -1,7 +1,7 @@
 {
   "extends": [
-    "plugin:@typescript-eslint/recommended",
     "airbnb-typescript/base",
+    "plugin:@typescript-eslint/recommended",
     "plugin:wc/recommended",
     "plugin:lit/recommended",
     "prettier",
@@ -45,16 +45,16 @@
     "func-names": 0,
     "prefer-arrow-callback": 0,
     "no-underscore-dangle": 0,
-    "no-var": 0,
     "strict": 0,
     "prefer-spread": 0,
     "no-plusplus": 0,
-    "no-bitwise": 0,
+    "no-bitwise": 2,
     "comma-dangle": 0,
     "vars-on-top": 0,
     "no-continue": 0,
     "no-param-reassign": 0,
     "no-multi-assign": 0,
+    "no-console": 2,
     "radix": 0,
     "no-alert": 0,
     "no-return-await": 0,

src/common/entity/battery_icon.ts

@@ -13,7 +13,7 @@ export const batteryIcon = (
     return "hass:battery-unknown";
   }
 
-  var icon = "hass:battery";
+  let icon = "hass:battery";
   const batteryRound = Math.round(battery / 10) * 10;
   if (battery_charging && battery > 10) {
     icon += `-charging-${batteryRound}`;

src/common/entity/supports-feature.ts

@@ -4,6 +4,6 @@ export const supportsFeature = (
   stateObj: HassEntity,
   feature: number
 ): boolean => {
-  // eslint-disable-next-line:no-bitwise
+  // eslint-disable-next-line no-bitwise
   return (stateObj.attributes.supported_features! & feature) !== 0;
 };

src/components/buttons/ha-call-service-button.js

@@ -54,8 +54,8 @@ class HaCallServiceButton extends EventsMixin(PolymerElement) {
   callService() {
     this.progress = true;
     // eslint-disable-next-line @typescript-eslint/no-this-alias
-    var el = this;
+    const el = this;
-    var eventData = {
+    const eventData = {
       domain: this.domain,
       service: this.service,
       serviceData: this.serviceData,

src/components/buttons/ha-progress-button.js

@@ -78,7 +78,7 @@ class HaProgressButton extends PolymerElement {
   }
 
   tempClass(className) {
-    var classList = this.$.container.classList;
+    const classList = this.$.container.classList;
     classList.add(className);
     setTimeout(() => {
       classList.remove(className);

src/components/dialog/ha-iron-focusables-helper.js

@@ -23,10 +23,10 @@ export const HaIronFocusablesHelper = {
    * @return {!Array<!HTMLElement>}
    */
   getTabbableNodes: function (node) {
-    var result = [];
+    const result = [];
     // If there is at least one element with tabindex > 0, we need to sort
     // the final array by tabindex.
-    var needsSortByTabIndex = this._collectTabbableNodes(node, result);
+    const needsSortByTabIndex = this._collectTabbableNodes(node, result);
     if (needsSortByTabIndex) {
       return IronFocusablesHelper._sortByTabIndex(result);
     }
@@ -50,9 +50,9 @@ export const HaIronFocusablesHelper = {
     ) {
       return false;
     }
-    var element = /** @type {!HTMLElement} */ (node);
+    const element = /** @type {!HTMLElement} */ (node);
-    var tabIndex = IronFocusablesHelper._normalizedTabIndex(element);
+    const tabIndex = IronFocusablesHelper._normalizedTabIndex(element);
-    var needsSort = tabIndex > 0;
+    let needsSort = tabIndex > 0;
     if (tabIndex >= 0) {
       result.push(element);
     }
@@ -70,7 +70,7 @@ export const HaIronFocusablesHelper = {
     //   <input id="B" slot="b" tabindex="1">
     //  </div>
     // TODO(valdrin) support ShadowDOM v1 when upgrading to Polymer v2.0.
-    var children;
+    let children;
     if (element.localName === "content" || element.localName === "slot") {
       children = dom(element).getDistributedNodes();
     } else {
@@ -80,7 +80,7 @@ export const HaIronFocusablesHelper = {
       children = dom(element.shadowRoot || element.root || element).children;
       // /////////////////////////
     }
-    for (var i = 0; i < children.length; i++) {
+    for (let i = 0; i < children.length; i++) {
       // Ensure method is always invoked to collect tabbable children.
       needsSort = this._collectTabbableNodes(children[i], result) || needsSort;
     }

src/components/ha-color-picker.js

@@ -188,10 +188,10 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
   // origin is wheel center
   // returns {x: X, y: Y} object
   convertToCanvasCoordinates(clientX, clientY) {
-    var svgPoint = this.interactionLayer.createSVGPoint();
+    const svgPoint = this.interactionLayer.createSVGPoint();
     svgPoint.x = clientX;
     svgPoint.y = clientY;
-    var cc = svgPoint.matrixTransform(
+    const cc = svgPoint.matrixTransform(
       this.interactionLayer.getScreenCTM().inverse()
     );
     return { x: cc.x, y: cc.y };
@@ -225,7 +225,7 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
   // Touch events
 
   onTouchStart(ev) {
-    var touch = ev.changedTouches[0];
+    const touch = ev.changedTouches[0];
     const cc = this.convertToCanvasCoordinates(touch.clientX, touch.clientY);
     // return if we're not on the wheel
     if (!this.isInWheel(cc.x, cc.y)) {
@@ -275,8 +275,8 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
 
   // Process user input to color
   processUserSelect(ev) {
-    var canvasXY = this.convertToCanvasCoordinates(ev.clientX, ev.clientY);
+    const canvasXY = this.convertToCanvasCoordinates(ev.clientX, ev.clientY);
-    var hs = this.getColor(canvasXY.x, canvasXY.y);
+    const hs = this.getColor(canvasXY.x, canvasXY.y);
     this.onColorSelect(hs);
   }
 
@@ -319,11 +319,11 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
 
   // set marker position to the given color
   setMarkerOnColor(hs) {
-    var dist = hs.s * this.radius;
+    const dist = hs.s * this.radius;
-    var theta = ((hs.h - 180) / 180) * Math.PI;
+    const theta = ((hs.h - 180) / 180) * Math.PI;
-    var markerdX = -dist * Math.cos(theta);
+    const markerdX = -dist * Math.cos(theta);
-    var markerdY = -dist * Math.sin(theta);
+    const markerdY = -dist * Math.sin(theta);
-    var translateString = `translate(${markerdX},${markerdY})`;
+    const translateString = `translate(${markerdX},${markerdY})`;
     this.marker.setAttribute("transform", translateString);
     this.tooltip.setAttribute("transform", translateString);
   }
@@ -358,8 +358,8 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
 
   // get angle (degrees)
   getAngle(dX, dY) {
-    var theta = Math.atan2(-dY, -dX); // radians from the left edge, clockwise = positive
+    const theta = Math.atan2(-dY, -dX); // radians from the left edge, clockwise = positive
-    var angle = (theta / Math.PI) * 180 + 180; // degrees, clockwise from right
+    const angle = (theta / Math.PI) * 180 + 180; // degrees, clockwise from right
     return angle;
   }
 
@@ -378,9 +378,9 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
    */
 
   getColor(x, y) {
-    var hue = this.getAngle(x, y); // degrees, clockwise from right
+    const hue = this.getAngle(x, y); // degrees, clockwise from right
-    var relativeDistance = this.getDistance(x, y); // edge of radius = 1
+    const relativeDistance = this.getDistance(x, y); // edge of radius = 1
-    var sat = Math.min(relativeDistance, 1); // Distance from center
+    const sat = Math.min(relativeDistance, 1); // Distance from center
     return { h: hue, s: sat };
   }
 
@@ -402,9 +402,9 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
       if (this.saturationSegments === 1) {
         hs.s = 1;
       } else {
-        var segmentSize = 1 / this.saturationSegments;
+        const segmentSize = 1 / this.saturationSegments;
-        var saturationStep = 1 / (this.saturationSegments - 1);
+        const saturationStep = 1 / (this.saturationSegments - 1);
-        var calculatedSat = Math.floor(hs.s / segmentSize) * saturationStep;
+        const calculatedSat = Math.floor(hs.s / segmentSize) * saturationStep;
         hs.s = Math.min(calculatedSat, 1);
       }
     }
@@ -477,9 +477,9 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
       hueSegments = hueSegments || 360; // reset 0 segments to 360
       const angleStep = 360 / hueSegments;
       const halfAngleStep = angleStep / 2; // center segments on color
-      for (var angle = 0; angle <= 360; angle += angleStep) {
+      for (let angle = 0; angle <= 360; angle += angleStep) {
-        var startAngle = (angle - halfAngleStep) * (Math.PI / 180);
+        const startAngle = (angle - halfAngleStep) * (Math.PI / 180);
-        var endAngle = (angle + halfAngleStep + 1) * (Math.PI / 180);
+        const endAngle = (angle + halfAngleStep + 1) * (Math.PI / 180);
         context.beginPath();
         context.moveTo(cX, cY);
         context.arc(
@@ -492,7 +492,7 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
         );
         context.closePath();
         // gradient
-        var gradient = context.createRadialGradient(
+        const gradient = context.createRadialGradient(
           cX,
           cY,
           0,
@@ -507,8 +507,8 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
         if (saturationSegments > 0) {
           const ratioStep = 1 / saturationSegments;
           let ratio = 0;
-          for (var stop = 1; stop < saturationSegments; stop += 1) {
+          for (let stop = 1; stop < saturationSegments; stop += 1) {
-            var prevLighness = lightness;
+            const prevLighness = lightness;
             ratio = stop * ratioStep;
             lightness = 100 - 50 * ratio;
             gradient.addColorStop(

src/components/ha-cover-controls.js

@@ -95,7 +95,7 @@ class HaCoverControls extends PolymerElement {
     if (stateObj.state === UNAVAILABLE) {
       return true;
     }
-    var assumedState = stateObj.attributes.assumed_state === true;
+    const assumedState = stateObj.attributes.assumed_state === true;
     return (entityObj.isFullyOpen || entityObj.isOpening) && !assumedState;
   }
 
@@ -103,7 +103,7 @@ class HaCoverControls extends PolymerElement {
     if (stateObj.state === UNAVAILABLE) {
       return true;
     }
-    var assumedState = stateObj.attributes.assumed_state === true;
+    const assumedState = stateObj.attributes.assumed_state === true;
     return (entityObj.isFullyClosed || entityObj.isClosing) && !assumedState;
   }
 

src/components/ha-cover-tilt-controls.js

@@ -75,7 +75,7 @@ class HaCoverTiltControls extends PolymerElement {
     if (stateObj.state === UNAVAILABLE) {
       return true;
     }
-    var assumedState = stateObj.attributes.assumed_state === true;
+    const assumedState = stateObj.attributes.assumed_state === true;
     return entityObj.isFullyOpenTilt && !assumedState;
   }
 
@@ -83,7 +83,7 @@ class HaCoverTiltControls extends PolymerElement {
     if (stateObj.state === UNAVAILABLE) {
       return true;
     }
-    var assumedState = stateObj.attributes.assumed_state === true;
+    const assumedState = stateObj.attributes.assumed_state === true;
     return entityObj.isFullyClosedTilt && !assumedState;
   }
 

src/components/ha-service-description.js

@@ -16,9 +16,9 @@ class HaServiceDescription extends PolymerElement {
   }
 
   _getDescription(hass, domain, service) {
-    var domainServices = hass.services[domain];
+    const domainServices = hass.services[domain];
     if (!domainServices) return "";
-    var serviceObject = domainServices[service];
+    const serviceObject = domainServices[service];
     if (!serviceObject) return "";
     return serviceObject.description;
   }

src/components/paper-time-input.js

@@ -322,9 +322,9 @@ export class PaperTimeInput extends PolymerElement {
    * @return {boolean}
    */
   validate() {
-    var valid = true;
+    let valid = true;
     // Validate hour & min fields
-    if (!this.$.hour.validate() | !this.$.min.validate()) {
+    if (!this.$.hour.validate() || !this.$.min.validate()) {
       valid = false;
     }
     // Validate second field

src/dialogs/more-info/controls/more-info-configurator.js

@@ -123,12 +123,12 @@ class MoreInfoConfigurator extends PolymerElement {
   }
 
   fieldChanged(ev) {
-    var el = ev.target;
+    const el = ev.target;
     this.fieldInput[el.name] = el.value;
   }
 
   submitClicked() {
-    var data = {
+    const data = {
       configure_id: this.stateObj.attributes.configure_id,
       fields: this.fieldInput,
     };

src/dialogs/more-info/controls/more-info-cover.js

@@ -97,7 +97,7 @@ class MoreInfoCover extends LocalizeMixin(PolymerElement) {
   }
 
   computeClassNames(stateObj) {
-    var classes = [
+    const classes = [
       attributeClassNames(stateObj, [
         "current_position",
         "current_tilt_position",

src/dialogs/more-info/controls/more-info-fan.js

@@ -140,8 +140,8 @@ class MoreInfoFan extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   speedChanged(ev) {
-    var oldVal = this.stateObj.attributes.speed;
+    const oldVal = this.stateObj.attributes.speed;
-    var newVal = ev.detail.value;
+    const newVal = ev.detail.value;
 
     if (!newVal || oldVal === newVal) return;
 
@@ -152,8 +152,8 @@ class MoreInfoFan extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   oscillationToggleChanged(ev) {
-    var oldVal = this.stateObj.attributes.oscillating;
+    const oldVal = this.stateObj.attributes.oscillating;
-    var newVal = ev.target.checked;
+    const newVal = ev.target.checked;
 
     if (oldVal === newVal) return;
 

src/dialogs/more-info/controls/more-info-group.js

@@ -53,11 +53,11 @@ class MoreInfoGroup extends PolymerElement {
   }
 
   computeStates(stateObj, hass) {
-    var states = [];
+    const states = [];
-    var entIds = stateObj.attributes.entity_id || [];
+    const entIds = stateObj.attributes.entity_id || [];
 
-    for (var i = 0; i < entIds.length; i++) {
+    for (let i = 0; i < entIds.length; i++) {
-      var state = hass.states[entIds[i]];
+      const state = hass.states[entIds[i]];
 
       if (state) {
         states.push(state);

src/dialogs/more-info/controls/more-info-input_datetime.js

@@ -78,14 +78,14 @@ class DatetimeInput extends PolymerElement {
     if (stateObj.state === "unknown") {
       return "";
     }
-    var monthFiller;
+    let monthFiller;
     if (stateObj.attributes.month < 10) {
       monthFiller = "0";
     } else {
       monthFiller = "";
     }
 
-    var dayFiller;
+    let dayFiller;
     if (stateObj.attributes.day < 10) {
       dayFiller = "0";
     } else {
@@ -119,15 +119,18 @@ class DatetimeInput extends PolymerElement {
     };
 
     if (this.stateObj.attributes.has_time) {
-      changed |=
+      changed =
+        changed ||
         parseInt(this.selectedMinute) !== this.stateObj.attributes.minute;
-      changed |= parseInt(this.selectedHour) !== this.stateObj.attributes.hour;
+      changed =
+        changed ||
+        parseInt(this.selectedHour) !== this.stateObj.attributes.hour;
       if (this.selectedMinute < 10) {
         minuteFiller = "0";
       } else {
         minuteFiller = "";
       }
-      var timeStr =
+      const timeStr =
         this.selectedHour + ":" + minuteFiller + this.selectedMinute;
       serviceData.time = timeStr;
     }
@@ -144,7 +147,7 @@ class DatetimeInput extends PolymerElement {
         this.stateObj.attributes.day
       );
 
-      changed |= dateValState !== dateValInput;
+      changed = changed || dateValState !== dateValInput;
 
       serviceData.date = this.selectedDate;
     }

src/dialogs/more-info/controls/more-info-light.js

@@ -290,8 +290,8 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   effectChanged(ev) {
-    var oldVal = this.stateObj.attributes.effect;
+    const oldVal = this.stateObj.attributes.effect;
-    var newVal = ev.detail.value;
+    const newVal = ev.detail.value;
 
     if (!newVal || oldVal === newVal) return;
 
@@ -302,7 +302,7 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   brightnessSliderChanged(ev) {
-    var bri = parseInt(ev.target.value, 10);
+    const bri = parseInt(ev.target.value, 10);
 
     if (isNaN(bri)) return;
 
@@ -313,7 +313,7 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   ctSliderChanged(ev) {
-    var ct = parseInt(ev.target.value, 10);
+    const ct = parseInt(ev.target.value, 10);
 
     if (isNaN(ct)) return;
 
@@ -324,7 +324,7 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
   }
 
   wvSliderChanged(ev) {
-    var wv = parseInt(ev.target.value, 10);
+    const wv = parseInt(ev.target.value, 10);
 
     if (isNaN(wv)) return;
 

src/dialogs/more-info/controls/more-info-media_player.js

@@ -329,8 +329,8 @@ class MoreInfoMediaPlayer extends LocalizeMixin(EventsMixin(PolymerElement)) {
   handleSourceChanged(ev) {
     if (!this.playerObj) return;
 
-    var oldVal = this.playerObj.source;
+    const oldVal = this.playerObj.source;
-    var newVal = ev.detail.value;
+    const newVal = ev.detail.value;
 
     if (!newVal || oldVal === newVal) return;
 
@@ -340,8 +340,8 @@ class MoreInfoMediaPlayer extends LocalizeMixin(EventsMixin(PolymerElement)) {
   handleSoundModeChanged(ev) {
     if (!this.playerObj) return;
 
-    var oldVal = this.playerObj.soundMode;
+    const oldVal = this.playerObj.soundMode;
-    var newVal = ev.detail.value;
+    const newVal = ev.detail.value;
 
     if (!newVal || oldVal === newVal) return;
 

src/dialogs/more-info/controls/more-info-water_heater.js

@@ -193,7 +193,7 @@ class MoreInfoWaterHeater extends LocalizeMixin(EventsMixin(PolymerElement)) {
       4: "has-away_mode",
     };
 
-    var classes = [featureClassNames(stateObj, _featureClassNames)];
+    const classes = [featureClassNames(stateObj, _featureClassNames)];
 
     classes.push("more-info-water_heater");
 

src/entrypoints/service_worker.ts

@@ -84,7 +84,7 @@ function initPushNotifications() {
   }
 
   self.addEventListener("push", function (event) {
-    var data;
+    let data;
     if (event.data) {
       data = event.data.json();
       if (data.dismiss) {
@@ -113,8 +113,6 @@ function initPushNotifications() {
   });
 
   self.addEventListener("notificationclick", function (event) {
-    var url;
-
     notificationEventCallback("clicked", event);
 
     event.notification.close();
@@ -127,7 +125,7 @@ function initPushNotifications() {
       return;
     }
 
-    url = event.notification.data.url;
+    const url = event.notification.data.url;
 
     if (!url) return;
 
@@ -137,8 +135,8 @@ function initPushNotifications() {
           type: "window",
         })
         .then(function (windowClients) {
-          var i;
+          let i;
-          var client;
+          let client;
           for (i = 0; i < windowClients.length; i++) {
             client = windowClients[i];
             if (client.url === url && "focus" in client) {

src/panels/config/ha-entity-config.js

@@ -182,9 +182,9 @@ class HaEntityConfig extends PolymerElement {
       return;
     }
 
-    var oldEntityId = oldEntities[this.selectedEntity].entity_id;
+    const oldEntityId = oldEntities[this.selectedEntity].entity_id;
 
-    var newIndex = entities.findIndex(function (ent) {
+    const newIndex = entities.findIndex(function (ent) {
       return ent.entity_id === oldEntityId;
     });
 
@@ -198,12 +198,12 @@ class HaEntityConfig extends PolymerElement {
 
   entityChanged(index) {
     if (!this.entities || !this.formEl) return;
-    var entity = this.entities[index];
+    const entity = this.entities[index];
     if (!entity) return;
 
     this.formState = "loading";
     // eslint-disable-next-line @typescript-eslint/no-this-alias
-    var el = this;
+    const el = this;
     this.formEl.loadEntity(entity).then(function () {
       el.formState = "editing";
     });
@@ -212,7 +212,7 @@ class HaEntityConfig extends PolymerElement {
   saveEntity() {
     this.formState = "saving";
     // eslint-disable-next-line @typescript-eslint/no-this-alias
-    var el = this;
+    const el = this;
     this.formEl.saveEntity().then(function () {
       el.formState = "editing";
     });

src/panels/developer-tools/state/developer-tools-state.js

@@ -245,7 +245,7 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
   }
 
   entitySelected(ev) {
-    var state = ev.model.entity;
+    const state = ev.model.entity;
     this._entityId = state.entity_id;
     this._state = state.state;
     this._stateAttributes = safeDump(state.attributes);
@@ -258,7 +258,7 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
       this._stateAttributes = "";
       return;
     }
-    var state = this.hass.states[this._entityId];
+    const state = this.hass.states[this._entityId];
     if (!state) {
       return;
     }
@@ -305,12 +305,12 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
         }
 
         if (_attributeFilter !== "") {
-          var attributeFilter = _attributeFilter.toLowerCase();
+          const attributeFilter = _attributeFilter.toLowerCase();
-          var colonIndex = attributeFilter.indexOf(":");
+          const colonIndex = attributeFilter.indexOf(":");
-          var multiMode = colonIndex !== -1;
+          const multiMode = colonIndex !== -1;
 
-          var keyFilter = attributeFilter;
+          let keyFilter = attributeFilter;
-          var valueFilter = attributeFilter;
+          let valueFilter = attributeFilter;
 
           if (multiMode) {
             // we need to filter keys and values separately
@@ -318,10 +318,10 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
             valueFilter = attributeFilter.substring(colonIndex + 1).trim();
           }
 
-          var attributeKeys = Object.keys(value.attributes);
+          const attributeKeys = Object.keys(value.attributes);
 
-          for (var i = 0; i < attributeKeys.length; i++) {
+          for (let i = 0; i < attributeKeys.length; i++) {
-            var key = attributeKeys[i];
+            const key = attributeKeys[i];
 
             if (key.includes(keyFilter) && !multiMode) {
               return true; // in single mode we're already satisfied with this match
@@ -330,7 +330,7 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
               continue;
             }
 
-            var attributeValue = value.attributes[key];
+            const attributeValue = value.attributes[key];
 
             if (
               attributeValue !== null &&
@@ -366,11 +366,11 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
   }
 
   attributeString(entity) {
-    var output = "";
+    let output = "";
-    var i;
+    let i;
-    var keys;
+    let keys;
-    var key;
+    let key;
-    var value;
+    let value;
 
     for (i = 0, keys = Object.keys(entity.attributes); i < keys.length; i++) {
       key = keys[i];

src/panels/map/ha-panel-map.js

@@ -98,7 +98,7 @@ class HaPanelMap extends LocalizeMixin(PolymerElement) {
   }
 
   fitMap() {
-    var bounds;
+    let bounds;
 
     if (this._mapItems.length === 0) {
       this._map.setView(
@@ -118,7 +118,7 @@ class HaPanelMap extends LocalizeMixin(PolymerElement) {
 
   drawEntities(hass) {
     /* eslint-disable vars-on-top */
-    var map = this._map;
+    const map = this._map;
     if (!map) return;
 
     if (this._darkMode !== this.hass.themes.darkMode) {
@@ -136,17 +136,17 @@ class HaPanelMap extends LocalizeMixin(PolymerElement) {
         marker.remove();
       });
     }
-    var mapItems = (this._mapItems = []);
+    const mapItems = (this._mapItems = []);
 
     if (this._mapZones) {
       this._mapZones.forEach(function (marker) {
         marker.remove();
       });
     }
-    var mapZones = (this._mapZones = []);
+    const mapZones = (this._mapZones = []);
 
     Object.keys(hass.states).forEach((entityId) => {
-      var entity = hass.states[entityId];
+      const entity = hass.states[entityId];
 
       if (
         entity.state === "home" ||
@@ -156,15 +156,15 @@ class HaPanelMap extends LocalizeMixin(PolymerElement) {
         return;
       }
 
-      var title = computeStateName(entity);
+      const title = computeStateName(entity);
-      var icon;
+      let icon;
 
       if (computeStateDomain(entity) === "zone") {
         // DRAW ZONE
         if (entity.attributes.passive) return;
 
         // create icon
-        var iconHTML = "";
+        let iconHTML = "";
         if (entity.attributes.icon) {
           const el = document.createElement("ha-icon");
           el.setAttribute("icon", entity.attributes.icon);
@@ -210,8 +210,8 @@ class HaPanelMap extends LocalizeMixin(PolymerElement) {
 
       // DRAW ENTITY
       // create icon
-      var entityPicture = entity.attributes.entity_picture || "";
+      const entityPicture = entity.attributes.entity_picture || "";
-      var entityName = title
+      const entityName = title
         .split(" ")
         .map(function (part) {
           return part.substr(0, 1);

src/state-summary/state-card-cover.js

@@ -61,7 +61,7 @@ class StateCardCover extends PolymerElement {
   }
 
   computeEntityObj(hass, stateObj) {
-    var entity = new CoverEntity(hass, stateObj);
+    const entity = new CoverEntity(hass, stateObj);
     return entity;
   }
 }

src/util/hass-media-player-model.js

@@ -56,7 +56,7 @@ export default class MediaPlayerEntity {
   }
 
   get currentProgress() {
-    var progress = this._attr.media_position;
+    let progress = this._attr.media_position;
     if (this.isPlaying) {
       progress +=
         (Date.now() -
@@ -123,7 +123,7 @@ export default class MediaPlayerEntity {
       return this._attr.media_artist;
     }
     if (this.isTVShow) {
-      var text = this._attr.media_series_title;
+      let text = this._attr.media_series_title;
 
       if (this._attr.media_season) {
         text += " S" + this._attr.media_season;