Merge pull request #3038 from matrix-org/bwindels/colr-check-race2

Exclude chrome in ua from safari version check for colr support

src/utils/FontManager.js

@@ -22,6 +22,7 @@ limitations under the License.
  */
 
 function safariVersionCheck(ua) {
+    console.log("Browser is Safari - checking version for COLR support");
     try {
         const safariVersionMatch = ua.match(/Mac OS X ([\d|_]+).*Version\/([\d|.]+).*Safari/);
         if (safariVersionMatch) {
@@ -31,33 +32,36 @@ function safariVersionCheck(ua) {
             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, ` +
+            console.log(`COLR support on Safari requires macOS 10.14 and Safari 12, ` +
                 `detected Safari ${safariVersionStr} on macOS ${macOSVersionStr}, ` +
                 `COLR supported: ${colrFontSupported}`);
             return colrFontSupported;
         }
     } catch (err) {
-        console.error("Couldn't determine Safari version to check COLR font support, assuming no.", err);
+        console.error("Error in Safari COLR version check", err);
     }
+    console.warn("Couldn't determine Safari version to check COLR font support, assuming no.");
     return false;
 }
 
 async function isColrFontSupported() {
     console.log("Checking for COLR support");
 
+    const {userAgent} = navigator;
     // Firefox has supported COLR fonts since version 26
     // but doesn't support the check below without
     // "Extract canvas data" permissions
     // when content blocking is enabled.
-    if (navigator.userAgent.includes("Firefox")) {
+    if (userAgent.includes("Firefox")) {
         console.log("Browser is Firefox - assuming COLR is supported");
         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);
+    // Excluding "Chrome", as it's user agent unhelpfully also contains Safari...
+    if (!userAgent.includes("Chrome") && userAgent.includes("Safari")) {
+        return safariVersionCheck(userAgent);
     }
 
     try {