fix(clerk-js): Ensure we do not access addEventListener and dispatchEvent in non-browser environments

.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.

packages/clerk-js/src/utils/injectedWeb3Providers.ts

@@ -35,15 +35,23 @@ class InjectedWeb3Providers {
     coinbase: 'Coinbase Wallet',
     metamask: 'MetaMask',
   } as const;
+  static #instance: InjectedWeb3Providers | null = null;
 
-  constructor() {
+  private constructor() {
     if (typeof window === 'undefined') {
       return;
     }
     window.addEventListener('eip6963:announceProvider', this.#onAnnouncement as EventListener);
     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();

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);
 }