Use polyfill from toggleAttribute (#9969)

home-assistant · Sep 6, 2021 · 4066499 · 4066499
1 parent c6e83cb
commit 4066499
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/src/components/trace/hat-trace-timeline.ts b/src/components/trace/hat-trace-timeline.ts
@@ -19,6 +19,7 @@ import { ifDefined } from "lit/directives/if-defined";
 import { formatDateTimeWithSeconds } from "../../common/datetime/format_date_time";
 import relativeTime from "../../common/datetime/relative_time";
 import { fireEvent } from "../../common/dom/fire_event";
+import { toggleAttribute } from "../../common/dom/toggle_attribute";
 import { LogbookEntry } from "../../data/logbook";
 import {
   ChooseAction,
@@ -552,7 +553,7 @@ export class HaAutomationTracer extends LitElement {
       this.shadowRoot!.querySelectorAll<HaTimeline>(
         "ha-timeline[data-path]"
       ).forEach((el) => {
-        el.toggleAttribute("selected", this.selectedPath === el.dataset.path);
+        toggleAttribute(el, "selected", this.selectedPath === el.dataset.path);
         if (!this.allowPick || el.tabIndex === 0) {
           return;
         }

diff --git a/src/panels/lovelace/cards/hui-grid-card.ts b/src/panels/lovelace/cards/hui-grid-card.ts
@@ -61,7 +61,11 @@ class HuiGridCard extends HuiStackCard<GridCardConfig> {
   setConfig(config: GridCardConfig) {
     super.setConfig(config);
     this.style.setProperty("--grid-card-column-count", String(this.columns));
-    this.toggleAttribute("square", this.square);
+    if (this.square) {
+      this.setAttribute("square", "");
+    } else {
+      this.removeAttribute("square");
+    }
   }
 
   static get styles(): CSSResultGroup {

diff --git a/src/panels/lovelace/components/hui-energy-period-selector.ts b/src/panels/lovelace/components/hui-energy-period-selector.ts
@@ -33,6 +33,7 @@ import "@material/mwc-icon-button/mwc-icon-button";
 import "../../../components/ha-svg-icon";
 import "@material/mwc-button/mwc-button";
 import "../../../components/ha-button-toggle-group";
+import { toggleAttribute } from "../../../common/dom/toggle_attribute";
 
 const viewButtons: ToggleButton[] = [
   { label: "Day", value: "day" },
@@ -55,7 +56,7 @@ export class HuiEnergyPeriodSelector extends SubscribeMixin(LitElement) {
 
   public connectedCallback() {
     super.connectedCallback();
-    this.toggleAttribute("narrow", this.offsetWidth < 600);
+    toggleAttribute(this, "narrow", this.offsetWidth < 600);
   }
 
   public hassSubscribe(): UnsubscribeFunc[] {