update

Author: kien-ngo

.changeset/little-beds-dress.md

@@ -0,0 +1,5 @@
+---
+"thirdweb": patch
+---
+
+Add onTimeout callback to useAutoConnect

packages/thirdweb/src/react/core/hooks/connection/types.ts

@@ -113,4 +113,9 @@ export type AutoConnectProps = {
    * Optional chain to autoconnect to
    */
   chain?: Chain;
+
+  /**
+   * Callback to be called when the connection is timeout-ed
+   */
+  onTimeout?: () => void;
 };

packages/thirdweb/src/react/core/hooks/wallets/useAutoConnect.test.tsx

@@ -0,0 +1,65 @@
+import { renderHook, waitFor } from "@testing-library/react";
+import type { ReactNode } from "react";
+import { describe, expect, it } from "vitest";
+import { MockStorage } from "~test/mocks/storage.js";
+import { TEST_CLIENT } from "~test/test-clients.js";
+import { TEST_ACCOUNT_A } from "~test/test-wallets.js";
+import { createWalletAdapter } from "../../../../adapters/wallet-adapter.js";
+import { ethereum } from "../../../../chains/chain-definitions/ethereum.js";
+import { ThirdwebProvider } from "../../../../react/web/providers/thirdweb-provider.js";
+import { createConnectionManager } from "../../../../wallets/manager/index.js";
+import type { WalletId } from "../../../../wallets/wallet-types.js";
+import { ConnectionManagerCtx } from "../../providers/connection-manager.js";
+import { useAutoConnectCore } from "./useAutoConnect.js";
+
+describe("useAutoConnectCore", () => {
+  const mockStorage = new MockStorage();
+  const manager = createConnectionManager(mockStorage);
+
+  // Create a wrapper component with the mocked context
+  const wrapper = ({ children }: { children: ReactNode }) => {
+    return (
+      <ThirdwebProvider>
+        <ConnectionManagerCtx.Provider value={manager}>
+          {children}
+        </ConnectionManagerCtx.Provider>
+      </ThirdwebProvider>
+    );
+  };
+
+  const wallet = createWalletAdapter({
+    adaptedAccount: TEST_ACCOUNT_A,
+    client: TEST_CLIENT,
+    chain: ethereum,
+    onDisconnect: () => {},
+    switchChain: () => {},
+  });
+
+  it("should return a useQuery result", async () => {
+    const { result } = renderHook(
+      () =>
+        useAutoConnectCore(
+          mockStorage,
+          {
+            wallets: [wallet],
+            client: TEST_CLIENT,
+          },
+          (id: WalletId) =>
+            createWalletAdapter({
+              adaptedAccount: TEST_ACCOUNT_A,
+              client: TEST_CLIENT,
+              chain: ethereum,
+              onDisconnect: () => {
+                console.log(id);
+              },
+              switchChain: () => {},
+            }),
+        ),
+      { wrapper },
+    );
+    expect("data" in result.current).toBeTruthy();
+    await waitFor(() => {
+      expect(typeof result.current.data).toBe("boolean");
+    });
+  });
+});

packages/thirdweb/src/react/core/hooks/wallets/useAutoConnect.ts

@@ -24,6 +24,7 @@ export function useAutoConnectCore(
   props: AutoConnectProps & { wallets: Wallet[] },
   createWalletFn: (id: WalletId) => Wallet,
   getInstalledWallets?: () => Wallet[],
+  onTimeout?: () => void,
 ) {
   const manager = useConnectionManagerCtx("useAutoConnect");
   const setConnectionStatus = useSetActiveWalletConnectionStatus();
@@ -103,6 +104,11 @@ export function useAutoConnectCore(
         await timeoutPromise(handleWalletConnection(activeWallet), {
           ms: timeout,
           message: `AutoConnect timeout: ${timeout}ms limit exceeded.`,
+        }).catch((err) => {
+          console.warn(err.message);
+          if (onTimeout) {
+            onTimeout();
+          }
         });
 
         // connected wallet could be activeWallet or smart wallet

packages/thirdweb/src/wallets/in-app/web/lib/get-url-token.test.tsx

@@ -0,0 +1,92 @@
+import { afterEach, beforeEach, describe, expect, it } from "vitest";
+import { getUrlToken } from "./get-url-token.js";
+
+describe("getUrlToken", () => {
+  let originalLocation: Location;
+
+  beforeEach(() => {
+    originalLocation = window.location;
+
+    Object.defineProperty(window, "location", {
+      value: {
+        ...originalLocation,
+        search: "",
+      },
+      writable: true,
+    });
+  });
+
+  afterEach(() => {
+    // Restore the original location object after each test
+    Object.defineProperty(window, "location", {
+      value: originalLocation,
+      writable: true,
+    });
+  });
+
+  it("should return an empty object if not in web context", () => {
+    const originalWindow = window;
+    // biome-ignore lint/suspicious/noExplicitAny: Test
+    (global as any).window = undefined;
+
+    const result = getUrlToken();
+    // biome-ignore lint/suspicious/noExplicitAny: Test
+    (global as any).window = originalWindow;
+
+    expect(result).toEqual({});
+  });
+
+  it("should return an empty object if no parameters are present", () => {
+    const result = getUrlToken();
+    expect(result).toEqual({});
+  });
+
+  it("should parse walletId and authResult correctly", () => {
+    window.location.search =
+      "?walletId=123&authResult=%7B%22token%22%3A%22abc%22%7D";
+
+    const result = getUrlToken();
+
+    expect(result).toEqual({
+      walletId: "123",
+      authResult: { token: "abc" },
+      authProvider: null,
+      authCookie: null,
+    });
+  });
+
+  it("should handle authCookie and update URL correctly", () => {
+    window.location.search = "?walletId=123&authCookie=myCookie";
+
+    const result = getUrlToken();
+
+    expect(result).toEqual({
+      walletId: "123",
+      authResult: undefined,
+      authProvider: null,
+      authCookie: "myCookie",
+    });
+
+    // Check if URL has been updated correctly
+    expect(window.location.search).toBe("?walletId=123&authCookie=myCookie");
+  });
+
+  it("should handle all parameters correctly", () => {
+    window.location.search =
+      "?walletId=123&authResult=%7B%22token%22%3A%22xyz%22%7D&authProvider=provider1&authCookie=myCookie";
+
+    const result = getUrlToken();
+
+    expect(result).toEqual({
+      walletId: "123",
+      authResult: { token: "xyz" },
+      authProvider: "provider1",
+      authCookie: "myCookie",
+    });
+
+    // Check if URL has been updated correctly
+    expect(window.location.search).toBe(
+      "?walletId=123&authResult=%7B%22token%22%3A%22xyz%22%7D&authProvider=provider1&authCookie=myCookie",
+    );
+  });
+});

packages/thirdweb/test/vitest.config.ts

@@ -31,7 +31,7 @@ export default defineConfig({
       ],
       include: ["src/**"],
     },
-    environmentMatchGlobs: [["src/react/**/*.test.tsx", "happy-dom"]],
+    environmentMatchGlobs: [["src/**/*.test.tsx", "happy-dom"]],
     environment: "node",
     include: ["src/**/*.test.{ts,tsx}"],
     setupFiles: [join(__dirname, "./reactSetup.ts")],