Set correct lang attribute (home-assistant#5479)

* Set correct lang attribute * Update lit-localize-lite-mixin.ts * Update translations-mixin.ts * Remove lang="" * Move logic out of mixin
sqrtroot · Apr 8, 2020 · 4f70ec7 · 4f70ec7
1 parent a71f423
commit 4f70ec7
Show file tree

Hide file tree

Showing 8 changed files with 29 additions and 14 deletions.
diff --git a/demo/src/html/index.html.template b/demo/src/html/index.html.template
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html>
   <head>
     <meta charset="utf-8" />
     <link rel="manifest" href="/manifest.json" crossorigin="use-credentials" />

diff --git a/src/auth/ha-authorize.ts b/src/auth/ha-authorize.ts
@@ -123,6 +123,13 @@ class HaAuthorize extends litLocalizeLiteMixin(LitElement) {
     }
   }
 
+  protected updated(changedProps: PropertyValues) {
+    super.updated(changedProps);
+    if (changedProps.has("language")) {
+      document.querySelector("html")!.setAttribute("lang", this.language!);
+    }
+  }
+
   private async _fetchAuthProviders() {
     // Fetch auth providers
     try {

diff --git a/src/html/authorize.html.template b/src/html/authorize.html.template
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html>
   <head>
     <title>Home Assistant</title>
     <link rel="preload" href="<%= latestPageJS %>" as="script" crossorigin="use-credentials" />

diff --git a/src/html/index.html.template b/src/html/index.html.template
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html>
   <head>
     <link rel="preload" href="<%= latestCoreJS %>" as="script" crossorigin="use-credentials" />
     <link

diff --git a/src/html/onboarding.html.template b/src/html/onboarding.html.template
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html>
   <head>
     <title>Home Assistant</title>
     <link rel="preload" href="<%= latestPageJS %>" as="script" crossorigin="use-credentials" />

diff --git a/src/mixins/lit-localize-lite-mixin.ts b/src/mixins/lit-localize-lite-mixin.ts
@@ -19,23 +19,24 @@ export const litLocalizeLiteMixin = <T extends Constructor<LitElement>>(
     public connectedCallback(): void {
       super.connectedCallback();
       this._initializeLocalizeLite();
-      this.localize = computeLocalize(
-        this.constructor.prototype,
-        this.language!,
-        this.resources!
-      );
     }
 
     protected updated(changedProperties: PropertyValues) {
       super.updated(changedProperties);
+      if (changedProperties.get("translationFragment")) {
+        this._initializeLocalizeLite();
+      }
+
       if (
-        changedProperties.has("language") ||
-        changedProperties.has("resources")
+        this.language &&
+        this.resources &&
+        (changedProperties.has("language") ||
+          changedProperties.has("resources"))
       ) {
         this.localize = computeLocalize(
           this.constructor.prototype,
-          this.language!,
-          this.resources!
+          this.language,
+          this.resources
         );
       }
     }

diff --git a/src/onboarding/ha-onboarding.ts b/src/onboarding/ha-onboarding.ts
@@ -95,6 +95,13 @@ class HaOnboarding extends litLocalizeLiteMixin(HassElement) {
     this.addEventListener("onboarding-step", (ev) => this._handleStepDone(ev));
   }
 
+  protected updated(changedProps: PropertyValues) {
+    super.updated(changedProps);
+    if (changedProps.has("language")) {
+      document.querySelector("html")!.setAttribute("lang", this.language!);
+    }
+  }
+
   private _curStep() {
     return this._steps ? this._steps.find((stp) => !stp.done) : undefined;
   }

diff --git a/src/state/translations-mixin.ts b/src/state/translations-mixin.ts
@@ -68,11 +68,11 @@ export default <T extends Constructor<HassBaseEl>>(superClass: T) =>
       if (saveToBackend) {
         saveTranslationPreferences(this.hass, { language });
       }
-
       this._applyTranslations(this.hass);
     }
 
     private _applyTranslations(hass: HomeAssistant) {
+      document.querySelector("html")!.setAttribute("lang", hass.language);
       this.style.direction = computeRTL(hass) ? "rtl" : "ltr";
       this._loadCoreTranslations(hass.language);
       this._loadHassTranslations(hass.language);