Skip to content

Commit fb1b9ef

Browse files
panteliselefpanteliselef
committed
chore(repo): Create user-profile tests
1 parent 815e0e8 commit fb1b9ef

File tree

2 files changed

+165
-97
lines changed

2 files changed

+165
-97
lines changed

‎integration/tests/navigation.test.ts

-97
Original file line numberDiff line numberDiff line change
@@ -47,20 +47,6 @@ export default function RootLayout({ children }: { children: React.ReactNode })
4747
</html>
4848
</Provider>
4949
);
50-
}`,
51-
)
52-
.addFile(
53-
'src/app/hash/user/page.tsx',
54-
() => `
55-
import { UserProfile, UserButton } from '@clerk/nextjs';
56-
57-
export default function Page() {
58-
return (
59-
<div>
60-
<UserButton />
61-
<UserProfile routing="hash" />
62-
</div>
63-
);
6450
}`,
6551
)
6652
.addFile(
@@ -91,64 +77,6 @@ export default function Page() {
9177
await app.teardown();
9278
});
9379

94-
test('user profile with path routing', async ({ page, context }) => {
95-
const u = createTestUtils({ app, page, context });
96-
await u.po.signIn.goTo();
97-
await u.po.signIn.waitForMounted();
98-
await u.po.signIn.signInWithEmailAndInstantPassword({ email: fakeUser.email, password: fakeUser.password });
99-
await u.po.expect.toBeSignedIn();
100-
101-
await u.po.userProfile.goTo();
102-
await u.po.userProfile.waitForMounted();
103-
104-
await u.po.userProfile.clickSetUsername();
105-
106-
u.page.getByText(/Update username/i);
107-
108-
await u.po.userProfile.typeUsername('some_username');
109-
110-
await u.page.getByText(/Cancel/i).click();
111-
112-
await u.page.waitForSelector('.cl-profileSectionContent__username .cl-headerTitle', { state: 'detached' });
113-
114-
await u.po.userProfile.clickAddEmailAddress();
115-
116-
u.page.getByText(/an email containing/i);
117-
118-
await u.po.userProfile.typeEmailAddress('some@email.com');
119-
120-
await u.page.getByText(/Cancel/i).click();
121-
});
122-
123-
test('user profile with hash routing', async ({ page, context }) => {
124-
const u = createTestUtils({ app, page, context });
125-
await u.po.signIn.goTo();
126-
await u.po.signIn.waitForMounted();
127-
await u.po.signIn.signInWithEmailAndInstantPassword({ email: fakeUser.email, password: fakeUser.password });
128-
await u.po.expect.toBeSignedIn();
129-
130-
await u.page.goToRelative('/hash/user');
131-
await u.po.userProfile.waitForMounted();
132-
133-
await u.po.userProfile.clickSetUsername();
134-
135-
u.page.getByText(/Update username/i);
136-
137-
await u.po.userProfile.typeUsername('some_username');
138-
139-
await u.page.getByText(/Cancel/i).click();
140-
141-
await u.page.waitForSelector('.cl-profileSectionContent__username .cl-headerTitle', { state: 'detached' });
142-
143-
await u.po.userProfile.clickAddEmailAddress();
144-
145-
u.page.getByText(/an email containing/i);
146-
147-
await u.po.userProfile.typeEmailAddress('some@email.com');
148-
149-
await u.page.getByText(/Cancel/i).click();
150-
});
151-
15280
test('sign in with path routing', async ({ page, context }) => {
15381
const u = createTestUtils({ app, page, context });
15482
await u.po.signIn.goTo();
@@ -179,31 +107,6 @@ export default function Page() {
179107
await u.po.expect.toBeSignedIn();
180108
});
181109

182-
test('user profile from user button navigates correctly', async ({ page, context }) => {
183-
const u = createTestUtils({ app, page, context });
184-
await u.po.signIn.goTo();
185-
await u.po.signIn.waitForMounted();
186-
await u.po.signIn.signInWithEmailAndInstantPassword({ email: fakeUser.email, password: fakeUser.password });
187-
await u.po.expect.toBeSignedIn();
188-
189-
await u.page.goToRelative('/');
190-
await u.page.waitForClerkComponentMounted();
191-
192-
await u.page.getByRole('button', { name: 'Open user button' }).click();
193-
194-
await u.page.getByText(/Manage account/).click();
195-
196-
await u.page.waitForSelector('.cl-modalContent > .cl-userProfile-root', { state: 'attached' });
197-
198-
await u.po.userProfile.clickSetUsername();
199-
await u.page.getByText(/Cancel/i).click();
200-
201-
await u.page.waitForSelector('.cl-profileSectionContent__username .cl-headerTitle', { state: 'detached' });
202-
203-
await u.po.userProfile.clickAddEmailAddress();
204-
await u.page.getByText(/Cancel/i).click();
205-
});
206-
207110
test('sign in with path routing navigates to previous page', async ({ page, context }) => {
208111
const u = createTestUtils({ app, page, context });
209112
await u.po.signIn.goTo();

‎integration/tests/user-profile.test.ts

+165
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,165 @@
1+
import { test } from '@playwright/test';
2+
3+
import type { Application } from '../models/application';
4+
import { appConfigs } from '../presets';
5+
import type { FakeUser } from '../testUtils';
6+
import { createTestUtils } from '../testUtils';
7+
8+
test.describe('user profile @generic', () => {
9+
test.describe.configure({ mode: 'serial' });
10+
let app: Application;
11+
let fakeUser: FakeUser;
12+
13+
test.beforeAll(async () => {
14+
app = await appConfigs.next.appRouter
15+
.clone()
16+
.addFile(
17+
'src/app/provider.tsx',
18+
() => `'use client'
19+
import { ClerkProvider } from "@clerk/nextjs";
20+
21+
export function Provider({ children }: { children: any }) {
22+
return (
23+
<ClerkProvider>
24+
{children}
25+
</ClerkProvider>
26+
)
27+
}`,
28+
)
29+
.addFile(
30+
'src/app/layout.tsx',
31+
() => `import './globals.css';
32+
import { Inter } from 'next/font/google';
33+
import { Provider } from './provider';
34+
35+
const inter = Inter({ subsets: ['latin'] });
36+
37+
export const metadata = {
38+
title: 'Create Next App',
39+
description: 'Generated by create next app',
40+
};
41+
42+
export default function RootLayout({ children }: { children: React.ReactNode }) {
43+
return (
44+
<Provider>
45+
<html lang='en'>
46+
<body className={inter.className}>{children}</body>
47+
</html>
48+
</Provider>
49+
);
50+
}`,
51+
)
52+
.addFile(
53+
'src/app/hash/user/page.tsx',
54+
() => `
55+
import { UserProfile, UserButton } from '@clerk/nextjs';
56+
57+
export default function Page() {
58+
return (
59+
<div>
60+
<UserButton />
61+
<UserProfile routing="hash" />
62+
</div>
63+
);
64+
}`,
65+
)
66+
.commit();
67+
await app.setup();
68+
await app.withEnv(appConfigs.envs.withEmailCodes);
69+
await app.build();
70+
71+
const m = createTestUtils({ app });
72+
fakeUser = m.services.users.createFakeUser();
73+
await m.services.users.createBapiUser(fakeUser);
74+
75+
await app.serve();
76+
});
77+
78+
test.afterAll(async () => {
79+
await fakeUser.deleteIfExists();
80+
await app.teardown();
81+
});
82+
83+
test('user profile with path routing', async ({ page, context }) => {
84+
const u = createTestUtils({ app, page, context });
85+
await u.po.signIn.goTo();
86+
await u.po.signIn.waitForMounted();
87+
await u.po.signIn.signInWithEmailAndInstantPassword({ email: fakeUser.email, password: fakeUser.password });
88+
await u.po.expect.toBeSignedIn();
89+
90+
await u.po.userProfile.goTo();
91+
await u.po.userProfile.waitForMounted();
92+
93+
await u.po.userProfile.clickSetUsername();
94+
95+
u.page.getByText(/Update username/i);
96+
97+
await u.po.userProfile.typeUsername('some_username');
98+
99+
await u.page.getByText(/Cancel/i).click();
100+
101+
await u.page.waitForSelector('.cl-profileSectionContent__username .cl-headerTitle', { state: 'detached' });
102+
103+
await u.po.userProfile.clickAddEmailAddress();
104+
105+
u.page.getByText(/an email containing/i);
106+
107+
await u.po.userProfile.typeEmailAddress('some@email.com');
108+
109+
await u.page.getByText(/Cancel/i).click();
110+
});
111+
112+
test('user profile with hash routing', async ({ page, context }) => {
113+
const u = createTestUtils({ app, page, context });
114+
await u.po.signIn.goTo();
115+
await u.po.signIn.waitForMounted();
116+
await u.po.signIn.signInWithEmailAndInstantPassword({ email: fakeUser.email, password: fakeUser.password });
117+
await u.po.expect.toBeSignedIn();
118+
119+
await u.page.goToRelative('/hash/user');
120+
await u.po.userProfile.waitForMounted();
121+
122+
await u.po.userProfile.clickSetUsername();
123+
124+
u.page.getByText(/Update username/i);
125+
126+
await u.po.userProfile.typeUsername('some_username');
127+
128+
await u.page.getByText(/Cancel/i).click();
129+
130+
await u.page.waitForSelector('.cl-profileSectionContent__username .cl-headerTitle', { state: 'detached' });
131+
132+
await u.po.userProfile.clickAddEmailAddress();
133+
134+
u.page.getByText(/an email containing/i);
135+
136+
await u.po.userProfile.typeEmailAddress('some@email.com');
137+
138+
await u.page.getByText(/Cancel/i).click();
139+
});
140+
141+
test('user profile from user button opens actions correctly', async ({ page, context }) => {
142+
const u = createTestUtils({ app, page, context });
143+
await u.po.signIn.goTo();
144+
await u.po.signIn.waitForMounted();
145+
await u.po.signIn.signInWithEmailAndInstantPassword({ email: fakeUser.email, password: fakeUser.password });
146+
await u.po.expect.toBeSignedIn();
147+
148+
await u.page.goToRelative('/');
149+
await u.page.waitForClerkComponentMounted();
150+
151+
await u.page.getByRole('button', { name: 'Open user button' }).click();
152+
153+
await u.page.getByText(/Manage account/).click();
154+
155+
await u.page.waitForSelector('.cl-modalContent > .cl-userProfile-root', { state: 'attached' });
156+
157+
await u.po.userProfile.clickSetUsername();
158+
await u.page.getByText(/Cancel/i).click();
159+
160+
await u.page.waitForSelector('.cl-profileSectionContent__username .cl-headerTitle', { state: 'detached' });
161+
162+
await u.po.userProfile.clickAddEmailAddress();
163+
await u.page.getByText(/Cancel/i).click();
164+
});
165+
});

0 commit comments

Comments
 (0)