Fix loading fonts in Safari iOS 12.2+

This commit is contained in:
Eduard Kuzmenko 2021-06-25 15:10:50 +03:00
parent ce0443e758
commit 5ad39cf69d
2 changed files with 16 additions and 6 deletions

View File

@ -5,8 +5,13 @@
*/ */
let promise: Promise<any>; let promise: Promise<any>;
export default function loadFonts(): Promise<void> { export default function loadFonts(): Promise<any> {
if(promise) return promise; if(promise) return promise;
// @ts-ignore return promise = 'fonts' in document ?
return promise = 'fonts' in document ? Promise.all(['400 1rem Roboto', '500 1rem Roboto', '500 1rem tgico'].map(font => document.fonts.load(font))) : Promise.resolve(); Promise.race([
// @ts-ignore
Promise.all(['400 1rem Roboto', '500 1rem Roboto', '500 1rem tgico'].map(font => document.fonts.load(font))),
new Promise((resolve) => setTimeout(resolve, 1e3))
]) :
Promise.resolve();
} }

View File

@ -279,7 +279,7 @@ console.timeEnd('get storage1'); */
/** /**
* won't fire if font is loaded too fast * won't fire if font is loaded too fast
*/ */
function fadeInWhenFontsReady(elem: HTMLElement, promise: Promise<void>) { function fadeInWhenFontsReady(elem: HTMLElement, promise: Promise<any>) {
elem.style.opacity = '0'; elem.style.opacity = '0';
promise.then(() => { promise.then(() => {
@ -346,8 +346,13 @@ console.timeEnd('get storage1'); */
await pagePromise; await pagePromise;
} }
// @ts-ignore const promise = 'fonts' in document ?
const promise = 'fonts' in document ? document.fonts.ready : Promise.resolve(); Promise.race([
new Promise((resolve) => setTimeout(resolve, 1e3)),
// @ts-ignore
document.fonts.ready
]) :
Promise.resolve();
fadeInWhenFontsReady(scrollable, promise); fadeInWhenFontsReady(scrollable, promise);
} }