diff --git a/superset-frontend/package-lock.json b/superset-frontend/package-lock.json index 5d573ac77..ee61ed7ca 100644 --- a/superset-frontend/package-lock.json +++ b/superset-frontend/package-lock.json @@ -62,7 +62,6 @@ "babel-plugin-typescript-to-proptypes": "^2.0.0", "bootstrap": "^3.4.1", "brace": "^0.11.1", - "broadcast-channel": "^4.10.0", "chrono-node": "^2.7.5", "classnames": "^2.2.5", "core-js": "^3.37.1", @@ -20724,6 +20723,7 @@ "version": "1.6.51", "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.51.tgz", "integrity": "sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg==", + "dev": true, "engines": { "node": ">=0.6" } @@ -21026,21 +21026,6 @@ "brfs": "bin/cmd.js" } }, - "node_modules/broadcast-channel": { - "version": "4.10.0", - "resolved": "https://registry.npmjs.org/broadcast-channel/-/broadcast-channel-4.10.0.tgz", - "integrity": "sha512-hOUh312XyHk6JTVyX9cyXaH1UYs+2gHVtnW16oQAu9FL7ALcXGXc/YoJWqlkV8vUn14URQPMmRi4A9q4UrwVEQ==", - "dependencies": { - "@babel/runtime": "^7.16.0", - "detect-node": "^2.1.0", - "microseconds": "0.2.0", - "nano-time": "1.0.0", - "oblivious-set": "1.0.0", - "p-queue": "6.6.2", - "rimraf": "3.0.2", - "unload": "2.3.1" - } - }, "node_modules/browser-assert": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/browser-assert/-/browser-assert-1.2.1.tgz", @@ -25352,7 +25337,8 @@ "node_modules/detect-node": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz", - "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==" + "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==", + "dev": true }, "node_modules/detect-node-es": { "version": "1.1.0", @@ -27799,7 +27785,8 @@ "node_modules/eventemitter3": { "version": "4.0.7", "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz", - "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==" + "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==", + "dev": true }, "node_modules/events": { "version": "3.3.0", @@ -47730,11 +47717,6 @@ "node": ">=0.10.0" } }, - "node_modules/microseconds": { - "version": "0.2.0", - "resolved": "https://registry.npmjs.org/microseconds/-/microseconds-0.2.0.tgz", - "integrity": "sha512-n7DHHMjR1avBbSpsTBj6fmMGh2AGrifVV4e+WYc3Q9lO+xnSZ3NyhcBND3vzzatt05LFhoKFRxrIyklmLlUtyA==" - }, "node_modules/mime": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz", @@ -48254,14 +48236,6 @@ "dev": true, "optional": true }, - "node_modules/nano-time": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/nano-time/-/nano-time-1.0.0.tgz", - "integrity": "sha1-sFVPaa2J4i0JB/ehKwmTpdlhN+8=", - "dependencies": { - "big-integer": "^1.6.16" - } - }, "node_modules/nanoid": { "version": "5.0.7", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.0.7.tgz", @@ -50084,11 +50058,6 @@ "integrity": "sha512-eJJDYkhJFFbBBAxeh8xW+weHlkI28n2ZdQV/J/DNfWfSKlGEf2xcfAbZTv3riEXHAhL9SVOTs2pRmXiSTf78xg==", "dev": true }, - "node_modules/oblivious-set": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/oblivious-set/-/oblivious-set-1.0.0.tgz", - "integrity": "sha512-z+pI07qxo4c2CulUHCDf9lcqDlMSo72N/4rLUpRXf6fu+q8vjt8y0xS+Tlf8NTJDdTXHbdeO1n3MlbctwEoXZw==" - }, "node_modules/obuf": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz", @@ -50286,6 +50255,7 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz", "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=", + "dev": true, "engines": { "node": ">=4" } @@ -50366,6 +50336,7 @@ "version": "6.6.2", "resolved": "https://registry.npmjs.org/p-queue/-/p-queue-6.6.2.tgz", "integrity": "sha512-RwFpb72c/BhQLEXIZ5K2e+AhgNVmIejGlTgiB9MzZ0e93GRvqZ7uSi0dvRF7/XIXDeNkra2fNHBxTyPDGySpjQ==", + "dev": true, "dependencies": { "eventemitter3": "^4.0.4", "p-timeout": "^3.2.0" @@ -50404,6 +50375,7 @@ "version": "3.2.0", "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-3.2.0.tgz", "integrity": "sha512-rhIwUycgwwKcP9yTOOFK/AKsAopjjCakVqLHePO3CC6Mir1Z99xT+R63jZxAT5lFZLa2inS5h+ZS2GvR99/FBg==", + "dev": true, "dependencies": { "p-finally": "^1.0.0" }, @@ -60326,15 +60298,6 @@ "node": ">= 10.0.0" } }, - "node_modules/unload": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/unload/-/unload-2.3.1.tgz", - "integrity": "sha512-MUZEiDqvAN9AIDRbbBnVYVvfcR6DrjCqeU2YQMmliFZl9uaBUjTkhuDQkBiyAy8ad5bx1TXVbqZ3gg7namsWjA==", - "dependencies": { - "@babel/runtime": "^7.6.2", - "detect-node": "2.1.0" - } - }, "node_modules/unpipe": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz", @@ -84800,7 +84763,8 @@ "big-integer": { "version": "1.6.51", "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.51.tgz", - "integrity": "sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg==" + "integrity": "sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg==", + "dev": true }, "big.js": { "version": "5.2.2", @@ -85045,21 +85009,6 @@ "through2": "^2.0.0" } }, - "broadcast-channel": { - "version": "4.10.0", - "resolved": "https://registry.npmjs.org/broadcast-channel/-/broadcast-channel-4.10.0.tgz", - "integrity": "sha512-hOUh312XyHk6JTVyX9cyXaH1UYs+2gHVtnW16oQAu9FL7ALcXGXc/YoJWqlkV8vUn14URQPMmRi4A9q4UrwVEQ==", - "requires": { - "@babel/runtime": "^7.16.0", - "detect-node": "^2.1.0", - "microseconds": "0.2.0", - "nano-time": "1.0.0", - "oblivious-set": "1.0.0", - "p-queue": "6.6.2", - "rimraf": "3.0.2", - "unload": "2.3.1" - } - }, "browser-assert": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/browser-assert/-/browser-assert-1.2.1.tgz", @@ -88336,7 +88285,8 @@ "detect-node": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz", - "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==" + "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==", + "dev": true }, "detect-node-es": { "version": "1.1.0", @@ -90206,7 +90156,8 @@ "eventemitter3": { "version": "4.0.7", "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz", - "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==" + "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==", + "dev": true }, "events": { "version": "3.3.0", @@ -104156,11 +104107,6 @@ } } }, - "microseconds": { - "version": "0.2.0", - "resolved": "https://registry.npmjs.org/microseconds/-/microseconds-0.2.0.tgz", - "integrity": "sha512-n7DHHMjR1avBbSpsTBj6fmMGh2AGrifVV4e+WYc3Q9lO+xnSZ3NyhcBND3vzzatt05LFhoKFRxrIyklmLlUtyA==" - }, "mime": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz", @@ -104562,14 +104508,6 @@ "dev": true, "optional": true }, - "nano-time": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/nano-time/-/nano-time-1.0.0.tgz", - "integrity": "sha1-sFVPaa2J4i0JB/ehKwmTpdlhN+8=", - "requires": { - "big-integer": "^1.6.16" - } - }, "nanoid": { "version": "5.0.7", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.0.7.tgz", @@ -105891,11 +105829,6 @@ "integrity": "sha512-eJJDYkhJFFbBBAxeh8xW+weHlkI28n2ZdQV/J/DNfWfSKlGEf2xcfAbZTv3riEXHAhL9SVOTs2pRmXiSTf78xg==", "dev": true }, - "oblivious-set": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/oblivious-set/-/oblivious-set-1.0.0.tgz", - "integrity": "sha512-z+pI07qxo4c2CulUHCDf9lcqDlMSo72N/4rLUpRXf6fu+q8vjt8y0xS+Tlf8NTJDdTXHbdeO1n3MlbctwEoXZw==" - }, "obuf": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz", @@ -106051,7 +105984,8 @@ "p-finally": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz", - "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=" + "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=", + "dev": true }, "p-iteration": { "version": "1.1.8", @@ -106102,6 +106036,7 @@ "version": "6.6.2", "resolved": "https://registry.npmjs.org/p-queue/-/p-queue-6.6.2.tgz", "integrity": "sha512-RwFpb72c/BhQLEXIZ5K2e+AhgNVmIejGlTgiB9MzZ0e93GRvqZ7uSi0dvRF7/XIXDeNkra2fNHBxTyPDGySpjQ==", + "dev": true, "requires": { "eventemitter3": "^4.0.4", "p-timeout": "^3.2.0" @@ -106127,6 +106062,7 @@ "version": "3.2.0", "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-3.2.0.tgz", "integrity": "sha512-rhIwUycgwwKcP9yTOOFK/AKsAopjjCakVqLHePO3CC6Mir1Z99xT+R63jZxAT5lFZLa2inS5h+ZS2GvR99/FBg==", + "dev": true, "requires": { "p-finally": "^1.0.0" } @@ -113384,15 +113320,6 @@ "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz", "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==" }, - "unload": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/unload/-/unload-2.3.1.tgz", - "integrity": "sha512-MUZEiDqvAN9AIDRbbBnVYVvfcR6DrjCqeU2YQMmliFZl9uaBUjTkhuDQkBiyAy8ad5bx1TXVbqZ3gg7namsWjA==", - "requires": { - "@babel/runtime": "^7.6.2", - "detect-node": "2.1.0" - } - }, "unpipe": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz", diff --git a/superset-frontend/package.json b/superset-frontend/package.json index fb8b30fcf..aec0ea6b8 100644 --- a/superset-frontend/package.json +++ b/superset-frontend/package.json @@ -127,7 +127,6 @@ "babel-plugin-typescript-to-proptypes": "^2.0.0", "bootstrap": "^3.4.1", "brace": "^0.11.1", - "broadcast-channel": "^4.10.0", "chrono-node": "^2.7.5", "classnames": "^2.2.5", "core-js": "^3.37.1", diff --git a/superset-frontend/src/hooks/strictBroadcastChannel.ts b/superset-frontend/src/hooks/strictBroadcastChannel.ts new file mode 100644 index 000000000..bffc6ca00 --- /dev/null +++ b/superset-frontend/src/hooks/strictBroadcastChannel.ts @@ -0,0 +1,63 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +// Credit to Eric Wong at https://stackoverflow.com/a/78491331 +interface StrictBroadcastChannelEventMap { + message: MessageEvent; + messageerror: MessageEvent; +} + +export interface StrictBroadcastChannel extends EventTarget { + readonly name: string; + onmessage: ((this: BroadcastChannel, ev: MessageEvent) => any) | null; + onmessageerror: ((this: BroadcastChannel, ev: MessageEvent) => any) | null; + close(): void; + postMessage(message: T): void; + addEventListener>( + type: K, + listener: ( + this: BroadcastChannel, + ev: StrictBroadcastChannelEventMap[K], + ) => any, + options?: boolean | AddEventListenerOptions, + ): void; + addEventListener( + type: string, + listener: EventListenerOrEventListenerObject, + options?: boolean | AddEventListenerOptions, + ): void; + removeEventListener>( + type: K, + listener: ( + this: BroadcastChannel, + ev: StrictBroadcastChannelEventMap[K], + ) => any, + options?: boolean | EventListenerOptions, + ): void; + removeEventListener( + type: string, + listener: EventListenerOrEventListenerObject, + options?: boolean | EventListenerOptions, + ): void; +} + +export interface TabIdChannelMessage { + type: 'REQUESTING_TAB_ID' | 'TAB_ID_DENIED'; + tabId: string; +} diff --git a/superset-frontend/src/hooks/useTabId.ts b/superset-frontend/src/hooks/useTabId.ts index 656b5a1d2..818d6d2e7 100644 --- a/superset-frontend/src/hooks/useTabId.ts +++ b/superset-frontend/src/hooks/useTabId.ts @@ -18,17 +18,15 @@ */ import { useEffect, useState } from 'react'; import { nanoid } from 'nanoid'; -import { BroadcastChannel } from 'broadcast-channel'; +import { + StrictBroadcastChannel, + TabIdChannelMessage, +} from './strictBroadcastChannel'; -interface TabIdChannelMessage { - type: 'REQUESTING_TAB_ID' | 'TAB_ID_DENIED'; - tabId: string; -} +const TAB_ID_CHANNEL_NAME = 'tab_id_channel'; -// TODO: We are using broadcast-channel to support Safari. -// The native BroadcastChannel API will be supported in Safari version 15.4. -// After that, we should remove this dependency and use the native API. -const channel = new BroadcastChannel('tab_id_channel'); +const channel: StrictBroadcastChannel = + new BroadcastChannel(TAB_ID_CHANNEL_NAME); export function useTabId() { const [tabId, setTabId] = useState(); @@ -83,14 +81,14 @@ export function useTabId() { } channel.onmessage = messageEvent => { - if (messageEvent.tabId === tabId) { - if (messageEvent.type === 'REQUESTING_TAB_ID') { + if (messageEvent.data.tabId === tabId) { + if (messageEvent.data.type === 'REQUESTING_TAB_ID') { const message: TabIdChannelMessage = { type: 'TAB_ID_DENIED', - tabId: messageEvent.tabId, + tabId: messageEvent.data.tabId, }; channel.postMessage(message); - } else if (messageEvent.type === 'TAB_ID_DENIED') { + } else if (messageEvent.data.type === 'TAB_ID_DENIED') { updateTabId(); } }