Skip to content

Commit dc5fbe8

Browse files
gregfromstlgregfromstl
committed
test: Add loading state test for SignatureScreen
1 parent cf21e6a commit dc5fbe8

File tree

1 file changed

+118
-100
lines changed

1 file changed

+118
-100
lines changed

‎packages/thirdweb/src/react/web/ui/ConnectWallet/screens/SignatureScreen.test.tsx‎

Lines changed: 118 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -8,124 +8,142 @@ import type { ConnectLocale } from "../locale/types.js";
88
import { SignatureScreen } from "./SignatureScreen.js";
99

1010
const mockAuth = vi.hoisted(() => ({
11-
doLogin: vi.fn().mockResolvedValue(undefined),
12-
doLogout: vi.fn().mockResolvedValue(undefined),
13-
getLoginPayload: vi.fn().mockResolvedValue(undefined),
14-
isLoggedIn: vi.fn().mockResolvedValue(true),
11+
doLogin: vi.fn().mockResolvedValue(undefined),
12+
doLogout: vi.fn().mockResolvedValue(undefined),
13+
getLoginPayload: vi.fn().mockResolvedValue(undefined),
14+
isLoggedIn: vi.fn().mockResolvedValue(true),
1515
}));
1616

1717
const wallet = createWallet("io.metamask");
1818

1919
vi.mock("../../../../core/hooks/auth/useSiweAuth", () => ({
20-
useSiweAuth: () => mockAuth,
20+
useSiweAuth: () => mockAuth,
2121
}));
2222

2323
vi.mock("../../../../core/hooks/wallets/useActiveWallet", () => ({
24-
useActiveWallet: () => wallet,
24+
useActiveWallet: () => wallet,
2525
}));
2626

2727
vi.mock("../../../../core/hooks/wallets/useActiveAccount", () => ({
28-
useActiveAccount: () => vi.fn().mockReturnValue(TEST_ACCOUNT_A),
28+
useActiveAccount: () => vi.fn().mockReturnValue(TEST_ACCOUNT_A),
2929
}));
3030

3131
vi.mock("../../../../core/hooks/wallets/useAdminWallet", () => ({
32-
useAdminWallet: () => vi.fn().mockReturnValue(null),
32+
useAdminWallet: () => vi.fn().mockReturnValue(null),
3333
}));
3434

3535
const mockConnectLocale = {
36-
signatureScreen: {
37-
title: "Sign In",
38-
instructionScreen: {
39-
title: "Sign Message",
40-
instruction: "Please sign the message",
41-
signInButton: "Sign In",
42-
disconnectWallet: "Disconnect",
43-
},
44-
signingScreen: {
45-
title: "Signing",
46-
inProgress: "Signing in progress...",
47-
failedToSignIn: "Failed to sign in",
48-
prompt: "Please check your wallet",
49-
tryAgain: "Try Again",
50-
},
51-
},
52-
agreement: {
53-
prefix: "By connecting, you agree to our",
54-
termsOfService: "Terms of Service",
55-
and: "and",
56-
privacyPolicy: "Privacy Policy",
57-
},
36+
signatureScreen: {
37+
title: "Sign In",
38+
instructionScreen: {
39+
title: "Sign Message",
40+
instruction: "Please sign the message",
41+
signInButton: "Sign In",
42+
disconnectWallet: "Disconnect",
43+
},
44+
signingScreen: {
45+
title: "Signing",
46+
inProgress: "Signing in progress...",
47+
failedToSignIn: "Failed to sign in",
48+
prompt: "Please check your wallet",
49+
tryAgain: "Try Again",
50+
},
51+
},
52+
agreement: {
53+
prefix: "By connecting, you agree to our",
54+
termsOfService: "Terms of Service",
55+
and: "and",
56+
privacyPolicy: "Privacy Policy",
57+
},
5858
} as unknown as ConnectLocale;
5959

6060
describe("SignatureScreen", () => {
61-
beforeEach(() => {
62-
vi.clearAllMocks();
63-
mockAuth.doLogin.mockResolvedValue(undefined);
64-
});
65-
66-
it("renders initial state correctly", () => {
67-
const { getByTestId } = render(
68-
<SignatureScreen
69-
onDone={() => {}}
70-
modalSize="wide"
71-
connectLocale={mockConnectLocale}
72-
client={TEST_CLIENT}
73-
auth={mockAuth}
74-
/>,
75-
{ setConnectedWallet: true },
76-
);
77-
78-
expect(getByTestId("sign-in-button")).toBeInTheDocument();
79-
expect(getByTestId("disconnect-button")).toBeInTheDocument();
80-
});
81-
82-
it("handles signing flow", async () => {
83-
const onDoneMock = vi.fn();
84-
const { getByRole, getByText } = render(
85-
<SignatureScreen
86-
onDone={onDoneMock}
87-
modalSize="wide"
88-
connectLocale={mockConnectLocale}
89-
client={TEST_CLIENT}
90-
auth={mockAuth}
91-
/>,
92-
{ setConnectedWallet: true },
93-
);
94-
95-
const signInButton = getByRole("button", { name: "Sign In" });
96-
await userEvent.click(signInButton);
97-
98-
// Should show signing in progress
99-
await waitFor(() => {
100-
expect(getByText("Signing in progress...")).toBeInTheDocument();
101-
});
102-
});
103-
104-
it("handles error state", async () => {
105-
mockAuth.doLogin.mockRejectedValueOnce(new Error("Signing failed"));
106-
const { getByRole, getByText } = render(
107-
<SignatureScreen
108-
onDone={() => {}}
109-
modalSize="wide"
110-
connectLocale={mockConnectLocale}
111-
client={TEST_CLIENT}
112-
auth={mockAuth}
113-
/>,
114-
{ setConnectedWallet: true },
115-
);
116-
117-
const signInButton = getByRole("button", { name: "Sign In" });
118-
await userEvent.click(signInButton);
119-
120-
// Should show error state
121-
await waitFor(
122-
() => {
123-
expect(getByText("Signing failed")).toBeInTheDocument();
124-
expect(getByRole("button", { name: "Try Again" })).toBeInTheDocument();
125-
},
126-
{
127-
timeout: 2000,
128-
},
129-
);
130-
});
61+
beforeEach(() => {
62+
vi.clearAllMocks();
63+
mockAuth.doLogin.mockResolvedValue(undefined);
64+
});
65+
66+
it("renders initial state correctly", () => {
67+
const { getByTestId } = render(
68+
<SignatureScreen
69+
onDone={() => {}}
70+
modalSize="wide"
71+
connectLocale={mockConnectLocale}
72+
client={TEST_CLIENT}
73+
auth={mockAuth}
74+
/>,
75+
{ setConnectedWallet: true },
76+
);
77+
78+
expect(getByTestId("sign-in-button")).toBeInTheDocument();
79+
expect(getByTestId("disconnect-button")).toBeInTheDocument();
80+
});
81+
82+
it("handles signing flow", async () => {
83+
const onDoneMock = vi.fn();
84+
const { getByRole, getByText } = render(
85+
<SignatureScreen
86+
onDone={onDoneMock}
87+
modalSize="wide"
88+
connectLocale={mockConnectLocale}
89+
client={TEST_CLIENT}
90+
auth={mockAuth}
91+
/>,
92+
{ setConnectedWallet: true },
93+
);
94+
95+
const signInButton = getByRole("button", { name: "Sign In" });
96+
await userEvent.click(signInButton);
97+
98+
// Should show signing in progress
99+
await waitFor(() => {
100+
expect(getByText("Signing in progress...")).toBeInTheDocument();
101+
});
102+
});
103+
104+
it("shows loading state", async () => {
105+
const { getByTestId } = render(
106+
<SignatureScreen
107+
onDone={() => {}}
108+
modalSize="wide"
109+
connectLocale={mockConnectLocale}
110+
client={TEST_CLIENT}
111+
auth={mockAuth}
112+
/>,
113+
{ setConnectedWallet: true },
114+
);
115+
116+
// Should show loading state
117+
await waitFor(() => {
118+
expect(getByTestId("loading-screen")).toBeInTheDocument();
119+
});
120+
});
121+
122+
it("handles error state", async () => {
123+
mockAuth.doLogin.mockRejectedValueOnce(new Error("Signing failed"));
124+
const { getByRole, getByText } = render(
125+
<SignatureScreen
126+
onDone={() => {}}
127+
modalSize="wide"
128+
connectLocale={mockConnectLocale}
129+
client={TEST_CLIENT}
130+
auth={mockAuth}
131+
/>,
132+
{ setConnectedWallet: true },
133+
);
134+
135+
const signInButton = getByRole("button", { name: "Sign In" });
136+
await userEvent.click(signInButton);
137+
138+
// Should show error state
139+
await waitFor(
140+
() => {
141+
expect(getByText("Signing failed")).toBeInTheDocument();
142+
expect(getByRole("button", { name: "Try Again" })).toBeInTheDocument();
143+
},
144+
{
145+
timeout: 2000,
146+
},
147+
);
148+
});
131149
});

0 commit comments

Comments
 (0)