Skip to content

Commit 01258ed

Browse files
octoperoctoper
authored
test(e2e): Add tests for legal consent (clerk#4411)
1 parent 41f2ede commit 01258ed

6 files changed

Lines changed: 150 additions & 54 deletions

File tree

‎.changeset/proud-fishes-care.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
---
2+
---

‎integration/presets/envs.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,12 @@ const withRestrictedMode = withEmailCodes
9494
.setEnvVariable('private', 'CLERK_SECRET_KEY', instanceKeys.get('with-restricted-mode').sk)
9595
.setEnvVariable('public', 'CLERK_PUBLISHABLE_KEY', instanceKeys.get('with-restricted-mode').pk);
9696

97+
const withLegalConsent = base
98+
.clone()
99+
.setId('withLegalConsent')
100+
.setEnvVariable('private', 'CLERK_SECRET_KEY', instanceKeys.get('with-legal-consent').sk)
101+
.setEnvVariable('public', 'CLERK_PUBLISHABLE_KEY', instanceKeys.get('with-legal-consent').pk);
102+
97103
export const envs = {
98104
base,
99105
withEmailCodes,
@@ -107,4 +113,5 @@ export const envs = {
107113
withAPCore2ClerkV4,
108114
withDynamicKeys,
109115
withRestrictedMode,
116+
withLegalConsent,
110117
} as const;

‎integration/testUtils/commonPageObject.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,9 @@ export const common = ({ page }: TestArgs) => {
4141
getPasswordInput: () => {
4242
return page.locator('input[name=password]');
4343
},
44+
getLegalAccepted: () => {
45+
return page.locator('input[name=__experimental_legalAccepted]');
46+
},
4447
getFirstNameInput: () => {
4548
return page.locator('input[name=firstName]');
4649
},

‎integration/testUtils/signUpPageObject.ts‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ type SignUpFormInputs = {
88
lastName?: string;
99
username?: string;
1010
phoneNumber?: string;
11+
legalAccepted?: boolean;
1112
};
1213

1314
export const createSignUpComponentPageObject = (testArgs: TestArgs) => {
@@ -20,9 +21,8 @@ export const createSignUpComponentPageObject = (testArgs: TestArgs) => {
2021

2122
if (typeof opts?.headlessSelector !== 'undefined') {
2223
return self.waitForMounted(opts.headlessSelector);
23-
} else {
24-
return self.waitForMounted();
2524
}
25+
return self.waitForMounted();
2626
},
2727
waitForMounted: (selector = '.cl-signUp-root') => {
2828
return page.waitForSelector(selector, { state: 'attached' });
@@ -54,6 +54,11 @@ export const createSignUpComponentPageObject = (testArgs: TestArgs) => {
5454
if (opts.password) {
5555
await self.getPasswordInput().fill(opts.password);
5656
}
57+
58+
if (opts.legalAccepted) {
59+
await self.getLegalAccepted().check();
60+
}
61+
5762
await self.continue();
5863
},
5964
signUpWithEmailAndPassword: async (opts: Pick<SignUpFormInputs, 'email' | 'password'>) => {

‎integration/tests/legal-consent.test.ts‎

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
import { expect, test } from '@playwright/test';
2+
3+
import { appConfigs } from '../presets';
4+
import { createTestUtils, testAgainstRunningApps } from '../testUtils';
5+
6+
testAgainstRunningApps({ withEnv: [appConfigs.envs.withLegalConsent] })(
7+
'sign up flow with legal consent @generic @nextjs',
8+
({ app }) => {
9+
test.describe.configure({ mode: 'serial' });
10+
11+
test.afterAll(async () => {
12+
await app.teardown();
13+
});
14+
15+
test('sign up with email and password and legal consent', async ({ page, context }) => {
16+
const u = createTestUtils({ app, page, context });
17+
const fakeUser = u.services.users.createFakeUser({
18+
fictionalEmail: true,
19+
withPhoneNumber: true,
20+
withUsername: true,
21+
});
22+
23+
// Go to sign up page
24+
await u.po.signUp.goTo();
25+
26+
// Fill in sign up form
27+
await u.po.signUp.signUp({
28+
email: fakeUser.email,
29+
password: fakeUser.password,
30+
legalAccepted: true,
31+
});
32+
33+
// Verify email
34+
await u.po.signUp.enterTestOtpCode();
35+
36+
// Check if user is signed in
37+
await u.po.expect.toBeSignedIn();
38+
39+
await fakeUser.deleteIfExists();
40+
});
41+
42+
test('cant sign up when legal consent checkbox is not checked', async ({ page, context }) => {
43+
const u = createTestUtils({ app, page, context });
44+
const fakeUser = u.services.users.createFakeUser({
45+
fictionalEmail: true,
46+
withPhoneNumber: true,
47+
withUsername: true,
48+
});
49+
50+
// Go to sign up page
51+
await u.po.signUp.goTo();
52+
53+
// Fill in sign up form
54+
await u.po.signUp.signUp({
55+
email: fakeUser.email,
56+
password: fakeUser.password,
57+
});
58+
59+
// We don't need to fill in the OTP code, because the user is not signed up
60+
await expect(page.getByRole('textbox', { name: /digit 1/i })).toBeHidden();
61+
62+
// Check if user is signed out
63+
await u.po.expect.toBeSignedOut();
64+
65+
await fakeUser.deleteIfExists();
66+
});
67+
},
68+
);

‎package-lock.json‎

Lines changed: 63 additions & 52 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)