首頁 探索 說明
註冊 登入
ylproj
/
jupyterlab
2
0
複刻 0
檔案 問題管理 0 合併請求 0 Wiki
瀏覽代碼

Fix Safari multiple tabs by working around a Safari bug.

Fixes #6921

We use local storage events to communicate between browser tabs in order to see if there are any other tabs with a particular workspace name. The standard says that local storage events are only supposed to be triggered by local storage changes from *other* tabs. However, Safari sometimes triggers these events from changes by the current tab. Here is an example illustrating this:

```html
<html>
  <body>
    <div id='report'>No events received</div>
    <script>
      let date = new Date().getTime();
      let report = document.getElementById('report');
      window.addEventListener('storage', ev => {
        if (ev.key !== 'SOME KEY') {
          return;
        }
        if (ev.newValue === date.toString()) {
          report.innerText = `BUG: received my own local storage change (${date}) as an event.`;
        } else {
          report.innerText = `Another tab was reloaded with timestamp ${ev.newValue}`;
        }
      });
      window.localStorage.setItem('SOME KEY', date);
        </script>
  </body>
</html>
```

Open that page in two different Safari tabs and start refreshing each one alternately. It was pretty easy for me to get one of the tabs to indicate the bug was happening. Things worked fine in firefox and presumably would in Chrome too.

A workaround implemented here is to manually ignore local storage events that we triggered.

Even if we move to BroadcastChannel (see #7315), we'll still need to deal with this since Safari doesn't implement broadcast channel, so we'd have to fall back to something like local storage on Safari.
Jason Grout 5 年之前
父節點
4cead36d53
當前提交
8de18f54f6
共有 1 個文件被更改，包括 21 次插入 和 2 次删除
分割檢視 顯示文件統計
  1. 21 2
      packages/apputils/src/windowresolver.ts

+ 21 - 2
packages/apputils/src/windowresolver.ts
查看文件 

@@ -84,6 +84,18 @@ namespace Private {
 
    */
 
   const WINDOW = `${PREFIX}:window`;
 
 
+  /**
 
+   * Current beacon request
 
+   *
 
+   * #### Notes
 
+   * We keep track of the current request so that we can ignore our own beacon
 
+   * requests. This is to work around a bug in Safari, where Safari sometimes
 
+   * triggers local storage events for changes made by the current tab. See
 
+   * https://github.com/jupyterlab/jupyterlab/issues/6921#issuecomment-540817283
 
+   * for more details.
 
+   */
 
+  let currentBeaconRequest: string | null = null;
 
+
 
   /**
 
    * A potential preferred default window name.
 
    */
 
@@ -123,7 +135,11 @@ namespace Private {
 
       }
 
 
       // If the beacon was fired, respond with a ping.
 
-      if (key === BEACON && candidate !== null) {
 
+      if (
 
+        key === BEACON &&
 
+        newValue !== currentBeaconRequest &&
 
+        candidate !== null
 
+      ) {
 
         ping(resolved ? name : candidate);
 
         return;
 
       }
 
@@ -163,6 +179,7 @@ namespace Private {
 
    */
 
   function reject(): void {
 
     resolved = true;
 
+    currentBeaconRequest = null;
 
     delegate.reject(`Window name candidate "${candidate}" already exists`);
 
   }
 
 
@@ -197,12 +214,14 @@ namespace Private {
 
       }
 
 
       resolved = true;
 
+      currentBeaconRequest = null;
 
       delegate.resolve((name = candidate));
 
       ping(name);
 
     }, TIMEOUT);
 
 
     // Fire the beacon to collect other windows' names.
 
-    localStorage.setItem(BEACON, `${Math.random()}-${new Date().getTime()}`);
 
+    currentBeaconRequest = `${Math.random()}-${new Date().getTime()}`;
 
+    localStorage.setItem(BEACON, currentBeaconRequest);
 
 
     return delegate.promise;
 
   }