Fix dark theme in non-Chrome browsers
Styling the master document from stylesheets defined in HTML Imports is
deprecated, and does not work at all in Safari and Firefox. Appending
the style module to the root of the app is an acceptable method,
however.
Bug: Issue 9044
Change-Id: I4466a24bab6811e7ec55a1863bb271ff624b2d26
diff --git a/polygerrit-ui/app/elements/gr-app.js b/polygerrit-ui/app/elements/gr-app.js
index af9c27a..53ffc60 100644
--- a/polygerrit-ui/app/elements/gr-app.js
+++ b/polygerrit-ui/app/elements/gr-app.js
@@ -128,7 +128,9 @@
});
if (window.localStorage.getItem('dark-theme')) {
- this.$.libLoader.loadDarkTheme();
+ this.$.libLoader.getDarkTheme().then(module => {
+ Polymer.dom(this.root).appendChild(module);
+ });
}
// Note: this is evaluated here to ensure that it only happens after the
diff --git a/polygerrit-ui/app/elements/shared/gr-lib-loader/gr-lib-loader.js b/polygerrit-ui/app/elements/shared/gr-lib-loader/gr-lib-loader.js
index 3ca4aa8..28ff45d 100644
--- a/polygerrit-ui/app/elements/shared/gr-lib-loader/gr-lib-loader.js
+++ b/polygerrit-ui/app/elements/shared/gr-lib-loader/gr-lib-loader.js
@@ -63,10 +63,18 @@
},
/**
- * Load and apply the dark theme document.
+ * Loads the dark theme document. Returns a promise that resolves with a
+ * custom-style DOM element.
+ * @return {!Promise<Element>}
*/
- loadDarkTheme() {
- this.importHref(this._getLibRoot() + DARK_THEME_PATH);
+ getDarkTheme() {
+ return new Promise((resolve, reject) => {
+ this.importHref(this._getLibRoot() + DARK_THEME_PATH, () => {
+ const module = document.createElement('style', 'custom-style');
+ module.setAttribute('include', 'dark-theme');
+ resolve(module);
+ });
+ });
},
/**
