sniff safari 12, macos 10.14 to support COLR, as safari doesn't wait for the font to load to emit load
This commit is contained in:
parent
85b0107f6c
commit
43f642a8fe
1 changed files with 23 additions and 0 deletions
|
@ -21,6 +21,23 @@ limitations under the License.
|
||||||
* MIT license
|
* MIT license
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
function safariVersionCheck(ua) {
|
||||||
|
const safariVersionMatch = ua.match(/Mac OS X ([\d|_]+).*Version\/([\d|\.]+) Safari/);
|
||||||
|
if (safariVersionMatch) {
|
||||||
|
const macOSVersionStr = safariVersionMatch[1];
|
||||||
|
const safariVersionStr = safariVersionMatch[2];
|
||||||
|
const macOSVersion = macOSVersionStr.split("_").map(n => parseInt(n, 10));
|
||||||
|
const safariVersion = safariVersionStr.split(".").map(n => parseInt(n, 10));
|
||||||
|
const colrFontSupported = macOSVersion[0] >= 10 && macOSVersion[1] >= 14 && safariVersion[0] >= 12;
|
||||||
|
// https://www.colorfonts.wtf/ states safari supports COLR fonts from this version on
|
||||||
|
console.log(`Browser is Safari - requiring macOS 10.14 and Safari 12,` +
|
||||||
|
`detected Safari ${safariVersionStr} on macOS ${macOSVersionStr},` +
|
||||||
|
`supported: ${colrFontSupported}`);
|
||||||
|
return colrFontSupported;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
async function isColrFontSupported() {
|
async function isColrFontSupported() {
|
||||||
console.log("Checking for COLR support");
|
console.log("Checking for COLR support");
|
||||||
|
|
||||||
|
@ -32,6 +49,12 @@ async function isColrFontSupported() {
|
||||||
console.log("Browser is Firefox - assuming COLR is supported");
|
console.log("Browser is Firefox - assuming COLR is supported");
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
// Safari doesn't wait for the font to load (if it doesn't have it in cache)
|
||||||
|
// to emit the load event on the image, so there is no way to not make the check
|
||||||
|
// reliable. Instead sniff the version.
|
||||||
|
if (navigator.userAgent.includes("Safari")) {
|
||||||
|
return safariVersionCheck(navigator.userAgent);
|
||||||
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const canvas = document.createElement('canvas');
|
const canvas = document.createElement('canvas');
|
||||||
|
|
Loading…
Reference in a new issue