Initial safari compatibility (#1609)

* Update environment info to return the 'safari' browser

* Fix popup display on Safari

* Update environment assignment

* Add data-loading-stalled property when loading takes longer than expected

* Add notification when loading has stalled

* Allow getDictionaryInfo invocation on non-privileged contexts

* Update _validatePrivilegedMessageSender

* Don't listen to 'voiceschanged' event unless addEventListener is present

Also expose an event

2 files changed, 23 insertions, 5 deletions

diff --git a/ext/js/background/backend.js b/ext/js/background/backend.js
index a6b9c0dc..21b18e99 100644
--- a/ext/js/background/backend.js
+++ b/ext/js/background/backend.js
@@ -112,7 +112,7 @@ class Backend {
             ['getDisplayTemplatesHtml',      {async: true,  contentScript: true,  handler: this._onApiGetDisplayTemplatesHtml.bind(this)}],
             ['getZoom',                      {async: true,  contentScript: true,  handler: this._onApiGetZoom.bind(this)}],
             ['getDefaultAnkiFieldTemplates', {async: false, contentScript: true,  handler: this._onApiGetDefaultAnkiFieldTemplates.bind(this)}],
-            ['getDictionaryInfo',            {async: true,  contentScript: false, handler: this._onApiGetDictionaryInfo.bind(this)}],
+            ['getDictionaryInfo',            {async: true,  contentScript: true,  handler: this._onApiGetDictionaryInfo.bind(this)}],
             ['getDictionaryCounts',          {async: true,  contentScript: false, handler: this._onApiGetDictionaryCounts.bind(this)}],
             ['purgeDatabase',                {async: true,  contentScript: false, handler: this._onApiPurgeDatabase.bind(this)}],
             ['getMedia',                     {async: true,  contentScript: true,  handler: this._onApiGetMedia.bind(this)}],
@@ -1288,10 +1288,14 @@ class Backend {
     }
 
     _validatePrivilegedMessageSender(sender) {
-        const url = sender.url;
-        if (!(typeof url === 'string' && yomichan.isExtensionUrl(url))) {
-            throw new Error('Invalid message sender');
-        }
+        let {url} = sender;
+        if (typeof url === 'string' && yomichan.isExtensionUrl(url)) { return; }
+        const {tab} = url;
+        if (typeof tab === 'object' && tab !== null) {
+            ({url} = tab);
+            if (typeof url === 'string' && yomichan.isExtensionUrl(url)) { return; }
+        }
+        throw new Error('Invalid message sender');
     }
 
     _getBrowserIconTitle() {
diff --git a/ext/js/background/environment.js b/ext/js/background/environment.js
index 04099ca1..8111741f 100644
--- a/ext/js/background/environment.js
+++ b/ext/js/background/environment.js
@@ -83,9 +83,23 @@ class Environment {
             } catch (e) {
                 // NOP
             }
+            if (this._isSafari()) {
+                return 'safari';
+            }
             return 'firefox';
         } else {
             return 'chrome';
         }
     }
+
+    _isSafari() {
+        const {vendor, userAgent} = navigator;
+        return (
+            typeof vendor === 'string' &&
+            typeof userAgent === 'string' &&
+            vendor.includes('Apple') &&
+            !userAgent.includes('CriOS') &&
+            !userAgent.includes('FxiOS')
+        );
+    }
 }