mystiq/hydrogen-web
Archived
4
1
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity

Log error when loading css file fails

Browse source
This commit is contained in:
RMidhunSuresh 2022-08-15 22:28:40 +05:30
parent 2e12ce74b7
commit 7590c55404
2 changed files with 29 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/platform/web/Platform.js
View file

@ -192,7 +192,7 @@ export class Platform {
await this._themeLoader?.init(manifests, log);
const { themeName, themeVariant } = await this._themeLoader.getActiveTheme();
log.log({ l: "Active theme", name: themeName, variant: themeVariant });
this._themeLoader.setTheme(themeName, themeVariant, log);
await this._themeLoader.setTheme(themeName, themeVariant, log);
}
});
} catch (err) {
@ -332,7 +332,10 @@ export class Platform {
return this._themeLoader;
}
replaceStylesheet(newPath) {
async replaceStylesheet(newPath, log) {
await this.logger.wrapOrRun(log, { l: "replaceStylesheet", location: newPath, }, async (l) => {
let resolve;
const promise = new Promise(r => resolve = r);
const head = document.querySelector("head");
// remove default theme
document.querySelectorAll(".theme").forEach(e => e.remove());
@ -342,7 +345,18 @@ export class Platform {
styleTag.rel = "stylesheet";
styleTag.type = "text/css";
styleTag.className = "theme";
styleTag.onerror = () => {
const error = new Error(`Failed to load stylesheet at ${newPath}`);
l.catch(error);
resolve();
throw error
};
styleTag.onload = () => {
resolve();
};
head.appendChild(styleTag);
await promise;
});
}
get description() {

6
src/platform/web/theming/ThemeLoader.ts
View file

@ -88,8 +88,8 @@ export class ThemeLoader {
});
}
setTheme(themeName: string, themeVariant?: "light" | "dark" | "default", log?: ILogItem) {
this._platform.logger.wrapOrRun(log, { l: "change theme", name: themeName, variant: themeVariant }, () => {
async setTheme(themeName: string, themeVariant?: "light" | "dark" | "default", log?: ILogItem) {
await this._platform.logger.wrapOrRun(log, { l: "change theme", name: themeName, variant: themeVariant }, async (l) => {
let cssLocation: string, variables: Record<string, string>;
let themeDetails = this._themeMapping[themeName];
if ("id" in themeDetails) {
@ -103,7 +103,7 @@ export class ThemeLoader {
cssLocation = themeDetails[themeVariant].cssLocation;
variables = themeDetails[themeVariant].variables;
}
this._platform.replaceStylesheet(cssLocation);
await this._platform.replaceStylesheet(cssLocation, l);
if (variables) {
log?.log({l: "Derived Theme", variables});
this._injectCSSVariables(variables);