diff --git a/.changeset/modern-foxes-run.md b/.changeset/modern-foxes-run.md new file mode 100644 index 00000000000..f9ee64840dd --- /dev/null +++ b/.changeset/modern-foxes-run.md @@ -0,0 +1,5 @@ +--- +"@clerk/clerk-js": patch +--- + +Ensure we don't access `window.addEventListener()` and `window.dispatchEvent` in non-browser environments. diff --git a/packages/clerk-js/src/utils/injectedWeb3Providers.ts b/packages/clerk-js/src/utils/injectedWeb3Providers.ts index 0874952af88..006d07b3207 100644 --- a/packages/clerk-js/src/utils/injectedWeb3Providers.ts +++ b/packages/clerk-js/src/utils/injectedWeb3Providers.ts @@ -35,8 +35,9 @@ class InjectedWeb3Providers { coinbase: 'Coinbase Wallet', metamask: 'MetaMask', } as const; + static #instance: InjectedWeb3Providers | null = null; - constructor() { + private constructor() { if (typeof window === 'undefined') { return; } @@ -44,6 +45,13 @@ class InjectedWeb3Providers { window.dispatchEvent(new Event('eip6963:requestProvider')); } + public static getInstance(): InjectedWeb3Providers { + if (!InjectedWeb3Providers.#instance) { + InjectedWeb3Providers.#instance = new InjectedWeb3Providers(); + } + return InjectedWeb3Providers.#instance; + } + get = (provider: InjectedWeb3Provider) => { return this.#providers.find(p => p.info.name === this.#providerIdMap[provider])?.provider; }; @@ -56,4 +64,4 @@ class InjectedWeb3Providers { }; } -export const injectedWeb3Providers = new InjectedWeb3Providers(); +export const getInjectedWeb3Providers = () => InjectedWeb3Providers.getInstance(); diff --git a/packages/clerk-js/src/utils/web3.ts b/packages/clerk-js/src/utils/web3.ts index 31a6699bfcf..e1d0587cefc 100644 --- a/packages/clerk-js/src/utils/web3.ts +++ b/packages/clerk-js/src/utils/web3.ts @@ -1,7 +1,7 @@ import type { Web3Provider } from '@clerk/types'; import { toHex } from './hex'; -import { injectedWeb3Providers } from './injectedWeb3Providers'; +import { getInjectedWeb3Providers } from './injectedWeb3Providers'; type GetWeb3IdentifierParams = { provider: Web3Provider; @@ -80,5 +80,7 @@ async function getEthereumProvider(provider: Web3Provider) { const sdk = new CoinbaseWalletSDK({}); return sdk.makeWeb3Provider({ options: 'all' }); } + + const injectedWeb3Providers = getInjectedWeb3Providers(); return injectedWeb3Providers.get(provider); }