TheArchive/zitadel
1
0
Fork 0
mirror of https://github.com/zitadel/zitadel.git synced 2025-12-12 05:44:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: passkey register

Browse Source
This commit is contained in:
Stefan Benz
2024-10-31 16:53:23 +01:00
parent 9c041cc46f
commit be4a20b29b
17 changed files with 178 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
acceptance/tests/admin.spec.ts
View File

@@ -1,7 +1,7 @@
import {test} from "@playwright/test";
import {loginWithPassword} from "./login";
import {checkLogin, loginWithPassword} from "./login";
test("admin login", async ({page}) => {
await loginWithPassword(page, "zitadel-admin@zitadel.localhost", "Password1.")
await page.getByRole("heading", {name: "Welcome ZITADEL Admin!"}).click();
await checkLogin(page, "ZITADEL Admin");
});

19
acceptance/tests/login.ts
View File

@@ -1,4 +1,7 @@
import {Page} from "@playwright/test";
import {expect, Page} from "@playwright/test";
import {loginnameScreen} from "./loginname";
import {passwordScreen} from "./password";
import {passkeyScreen} from "./passkey";
export async function loginWithPassword(page: Page, username: string, password: string) {
await page.goto("/loginname");
@@ -8,17 +11,13 @@ export async function loginWithPassword(page: Page, username: string, password:
await page.getByTestId("submit-button").click()
}
export async function loginnameScreen(page: Page, username: string) {
await page.getByTestId("username-text-input").pressSequentially(username);
}
export async function passwordScreen(page: Page, password: string) {
await page.getByTestId("password-text-input").pressSequentially(password);
}
export async function loginWithPasskey(page: Page, username: string) {
await page.goto("/loginname");
await loginnameScreen(page, username)
await page.getByTestId("submit-button").click()
await page.getByTestId("submit-button").click()
await passkeyScreen(page)
}
export async function checkLogin(page: Page, fullName: string) {
await expect(page.getByRole('heading')).toContainText(fullName);
}

5
acceptance/tests/loginname.ts Normal file
View File

@@ -0,0 +1,5 @@
import {Page} from "@playwright/test";
export async function loginnameScreen(page: Page, username: string) {
await page.getByTestId("username-text-input").pressSequentially(username);
}

62
acceptance/tests/passkey.ts Normal file
View File

@@ -0,0 +1,62 @@
import {Page} from "@playwright/test";
const BASE64_ENCODED_PK =
"MIIEvAIBADANBgkqhkiG9w0BAQEFAASCBKYwggSiAgEAAoIBAQDbBOu5Lhs4vpowbCnmCyLUpIE7JM9sm9QXzye2G+jr+Kr" +
"MsinWohEce47BFPJlTaDzHSvOW2eeunBO89ZcvvVc8RLz4qyQ8rO98xS1jtgqi1NcBPETDrtzthODu/gd0sjB2Tk3TLuBGV" +
"oPXt54a+Oo4JbBJ6h3s0+5eAfGplCbSNq6hN3Jh9YOTw5ZA6GCEy5l8zBaOgjXytd2v2OdSVoEDNiNQRkjJd2rmS2oi9AyQ" +
"FR3B7BrPSiDlCcITZFOWgLF5C31Wp/PSHwQhlnh7/6YhnE2y9tzsUvzx0wJXrBADW13+oMxrneDK3WGbxTNYgIi1PvSqXlq" +
"GjHtCK+R2QkXAgMBAAECggEAVc6bu7VAnP6v0gDOeX4razv4FX/adCao9ZsHZ+WPX8PQxtmWYqykH5CY4TSfsuizAgyPuQ0" +
"+j4Vjssr9VODLqFoanspT6YXsvaKanncUYbasNgUJnfnLnw3an2XpU2XdmXTNYckCPRX9nsAAURWT3/n9ljc/XYY22ecYxM" +
"8sDWnHu2uKZ1B7M3X60bQYL5T/lVXkKdD6xgSNLeP4AkRx0H4egaop68hoW8FIwmDPVWYVAvo8etzWCtibRXz5FcNld9MgD" +
"/Ai7ycKy4Q1KhX5GBFI79MVVaHkSQfxPHpr7/XcmpQOEAr+BMPon4s4vnKqAGdGB3j/E3d/+4F2swykoQKBgQD8hCsp6FIQ" +
"5umJlk9/j/nGsMl85LgLaNVYpWlPRKPc54YNumtvj5vx1BG+zMbT7qIE3nmUPTCHP7qb5ERZG4CdMCS6S64/qzZEqijLCqe" +
"pwj6j4fV5SyPWEcpxf6ehNdmcfgzVB3Wolfwh1ydhx/96L1jHJcTKchdJJzlfTvq8wwKBgQDeCnKws1t5GapfE1rmC/h4ol" +
"L2qZTth9oQmbrXYohVnoqNFslDa43ePZwL9Jmd9kYb0axOTNMmyrP0NTj41uCfgDS0cJnNTc63ojKjegxHIyYDKRZNVUR/d" +
"xAYB/vPfBYZUS7M89pO6LLsHhzS3qpu3/hppo/Uc/AM/r8PSflNHQKBgDnWgBh6OQncChPUlOLv9FMZPR1ZOfqLCYrjYEqi" +
"uzGm6iKM13zXFO4AGAxu1P/IAd5BovFcTpg79Z8tWqZaUUwvscnl+cRlj+mMXAmdqCeO8VASOmqM1ml667axeZDIR867ZG8" +
"K5V029Wg+4qtX5uFypNAAi6GfHkxIKrD04yOHAoGACdh4wXESi0oiDdkz3KOHPwIjn6BhZC7z8mx+pnJODU3cYukxv3WTct" +
"lUhAsyjJiQ/0bK1yX87ulqFVgO0Knmh+wNajrb9wiONAJTMICG7tiWJOm7fW5cfTJwWkBwYADmkfTRmHDvqzQSSvoC2S7aa" +
"9QulbC3C/qgGFNrcWgcT9kCgYAZTa1P9bFCDU7hJc2mHwJwAW7/FQKEJg8SL33KINpLwcR8fqaYOdAHWWz636osVEqosRrH" +
"zJOGpf9x2RSWzQJ+dq8+6fACgfFZOVpN644+sAHfNPAI/gnNKU5OfUv+eav8fBnzlf1A3y3GIkyMyzFN3DE7e0n/lyqxE4H" +
"BYGpI8g==";
export async function passkeyScreen(page: Page) {
const client = await page.context().newCDPSession(page);
await client.send('WebAuthn.enable', {enableUI: true});
const result = await client.send('WebAuthn.addVirtualAuthenticator', {
options: {
protocol: 'ctap2',
transport: 'internal',
hasResidentKey: true,
hasUserVerification: true,
isUserVerified: true,
automaticPresenceSimulation: true,
},
});
const authenticatorId = result.authenticatorId;
// initialize event listeners to wait for a successful passkey input event
const operationCompleted = new Promise<void>(resolve => {
client.on('WebAuthn.credentialAdded', () => resolve());
client.on('WebAuthn.credentialAsserted', () => resolve());
});
const url = new URL(process.env.ZITADEL_API_URL!)
await client.send('WebAuthn.addCredential', {
credential: {
credentialId: "",
rpId: url.hostname,
privateKey: BASE64_ENCODED_PK,
isResidentCredential: false,
signCount: 0,
},
authenticatorId: authenticatorId
});
// triggers passkey check
await page.getByTestId("submit-button").click()
// wait for successfully verified
await operationCompleted;
}

11
acceptance/tests/password.ts
View File

@@ -9,4 +9,13 @@ export async function changePassword(page: Page, loginname: string, password: st
async function changePasswordScreen(page: Page, password1: string, password2: string) {
await page.getByTestId('password-text-input').pressSequentially(password1);
await page.getByTestId('password-confirm-text-input').pressSequentially(password2);
}
}
export async function passwordScreen(page: Page, password: string) {
await page.getByTestId("password-text-input").pressSequentially(password);
}
export async function registerPasswordScreen(page: Page, password1: string, password2: string) {
await page.getByTestId('password-text-input').pressSequentially(password1);
await page.getByTestId('password-confirm-text-input').pressSequentially(password2);
}

28
acceptance/tests/register.spec.ts
View File

@@ -1,10 +1,30 @@
import {test} from "@playwright/test";
import {registerWithPassword} from './register';
import {loginWithPassword} from "./login";
import {registerWithPasskey, registerWithPassword} from './register';
import {checkLogin} from "./login";
import {removeUserByUsername} from './zitadel';
import path from 'path';
import dotenv from 'dotenv';
// Read from ".env" file.
dotenv.config({path: path.resolve(__dirname, '.env.local')});
test("register with password", async ({page}) => {
const username = "register@example.com"
const password = "Password1!"
await registerWithPassword(page, "firstname", "lastname", username, password, password)
await loginWithPassword(page, username, password)
const firstname = "firstname"
const lastname = "lastname"
await removeUserByUsername(username)
await registerWithPassword(page, firstname, lastname, username, password, password)
await checkLogin(page, firstname + " " + lastname);
});
test("register with passkey", async ({page}) => {
const username = "register@example.com"
const firstname = "firstname"
const lastname = "lastname"
await removeUserByUsername(username)
await registerWithPasskey(page, firstname, lastname, username)
await checkLogin(page, firstname + " " + lastname);
});

13
acceptance/tests/register.ts
View File

@@ -1,4 +1,6 @@
import {Page} from "@playwright/test";
import {passkeyScreen} from './passkey';
import {registerPasswordScreen} from './password';
export async function registerWithPassword(page: Page, firstname: string, lastname: string, email: string, password1: string, password2: string) {
await page.goto('/register');
@@ -10,24 +12,19 @@ export async function registerWithPassword(page: Page, firstname: string, lastna
async function registerUserScreenPassword(page: Page, firstname: string, lastname: string, email: string) {
await registerUserScreen(page, firstname, lastname, email)
await page.getByLabel('Password').click();
}
async function registerPasswordScreen(page: Page, password1: string, password2: string) {
await page.getByTestId('password-text-input').fill(password1);
await page.getByTestId('password-confirm-text-input').fill(password2);
await page.getByTestId('Password-radio').click();
}
export async function registerWithPasskey(page: Page, firstname: string, lastname: string, email: string) {
await page.goto('/register');
await registerUserScreenPasskey(page, firstname, lastname, email)
await page.getByTestId('submit-button').click();
await page.getByTestId('submit-button').click();
await passkeyScreen(page)
}
async function registerUserScreenPasskey(page: Page, firstname: string, lastname: string, email: string) {
await registerUserScreen(page, firstname, lastname, email)
await page.getByLabel('Passkey').click();
await page.getByTestId('Passkeys-radio').click();
}
async function registerUserScreen(page: Page, firstname: string, lastname: string, email: string) {

39
acceptance/tests/user.ts
View File

@@ -3,6 +3,7 @@ import {Page} from "@playwright/test";
import {registerWithPasskey} from "./register";
import {loginWithPasskey, loginWithPassword} from "./login";
import {changePassword} from "./password";
import {removeUser, getUserByUsername} from './zitadel';
export interface userProps {
email: string;
@@ -58,17 +59,7 @@ class User {
}
async remove() {
const response = await fetch(process.env.ZITADEL_API_URL! + "/v2/users/" + this.userId(), {
method: 'DELETE',
headers: {
'Authorization': "Bearer " + process.env.ZITADEL_SERVICE_USER_TOKEN!
}
});
if (response.statusCode >= 400 && response.statusCode != 404) {
const error = 'HTTP Error: ' + response.statusCode + ' - ' + response.statusMessage;
console.error(error);
throw new Error(error);
}
await removeUser(this.userId())
return
}
@@ -217,29 +208,3 @@ export class PasskeyUser extends User {
await super.remove()
}
}
async function getUserByUsername(username: string) {
const listUsersBody = {
queries: [{
userNameQuery: {
userName: username,
}
}]
}
const jsonBody = JSON.stringify(listUsersBody)
const registerResponse = await fetch(process.env.ZITADEL_API_URL! + "/v2/users", {
method: 'POST',
body: jsonBody,
headers: {
'Content-Type': 'application/json',
'Authorization': "Bearer " + process.env.ZITADEL_SERVICE_USER_TOKEN!
}
});
if (registerResponse.statusCode >= 400) {
const error = 'HTTP Error: ' + registerResponse.statusCode + ' - ' + registerResponse.statusMessage;
console.error(error);
throw new Error(error);
}
const respJson = await registerResponse.json()
return respJson
}

87
acceptance/tests/username-passkey.spec.ts
View File

@@ -2,94 +2,11 @@ import {test as base} from "@playwright/test";
import path from 'path';
import dotenv from 'dotenv';
import {PasskeyUser} from "./user";
import {checkLogin} from "./login";
// Read from ".env" file.
dotenv.config({path: path.resolve(__dirname, '.env.local')});
/*
const BASE64_ENCODED_PK =
"MIIEvAIBADANBgkqhkiG9w0BAQEFAASCBKYwggSiAgEAAoIBAQDbBOu5Lhs4vpowbCnmCyLUpIE7JM9sm9QXzye2G+jr+Kr" +
"MsinWohEce47BFPJlTaDzHSvOW2eeunBO89ZcvvVc8RLz4qyQ8rO98xS1jtgqi1NcBPETDrtzthODu/gd0sjB2Tk3TLuBGV" +
"oPXt54a+Oo4JbBJ6h3s0+5eAfGplCbSNq6hN3Jh9YOTw5ZA6GCEy5l8zBaOgjXytd2v2OdSVoEDNiNQRkjJd2rmS2oi9AyQ" +
"FR3B7BrPSiDlCcITZFOWgLF5C31Wp/PSHwQhlnh7/6YhnE2y9tzsUvzx0wJXrBADW13+oMxrneDK3WGbxTNYgIi1PvSqXlq" +
"GjHtCK+R2QkXAgMBAAECggEAVc6bu7VAnP6v0gDOeX4razv4FX/adCao9ZsHZ+WPX8PQxtmWYqykH5CY4TSfsuizAgyPuQ0" +
"+j4Vjssr9VODLqFoanspT6YXsvaKanncUYbasNgUJnfnLnw3an2XpU2XdmXTNYckCPRX9nsAAURWT3/n9ljc/XYY22ecYxM" +
"8sDWnHu2uKZ1B7M3X60bQYL5T/lVXkKdD6xgSNLeP4AkRx0H4egaop68hoW8FIwmDPVWYVAvo8etzWCtibRXz5FcNld9MgD" +
"/Ai7ycKy4Q1KhX5GBFI79MVVaHkSQfxPHpr7/XcmpQOEAr+BMPon4s4vnKqAGdGB3j/E3d/+4F2swykoQKBgQD8hCsp6FIQ" +
"5umJlk9/j/nGsMl85LgLaNVYpWlPRKPc54YNumtvj5vx1BG+zMbT7qIE3nmUPTCHP7qb5ERZG4CdMCS6S64/qzZEqijLCqe" +
"pwj6j4fV5SyPWEcpxf6ehNdmcfgzVB3Wolfwh1ydhx/96L1jHJcTKchdJJzlfTvq8wwKBgQDeCnKws1t5GapfE1rmC/h4ol" +
"L2qZTth9oQmbrXYohVnoqNFslDa43ePZwL9Jmd9kYb0axOTNMmyrP0NTj41uCfgDS0cJnNTc63ojKjegxHIyYDKRZNVUR/d" +
"xAYB/vPfBYZUS7M89pO6LLsHhzS3qpu3/hppo/Uc/AM/r8PSflNHQKBgDnWgBh6OQncChPUlOLv9FMZPR1ZOfqLCYrjYEqi" +
"uzGm6iKM13zXFO4AGAxu1P/IAd5BovFcTpg79Z8tWqZaUUwvscnl+cRlj+mMXAmdqCeO8VASOmqM1ml667axeZDIR867ZG8" +
"K5V029Wg+4qtX5uFypNAAi6GfHkxIKrD04yOHAoGACdh4wXESi0oiDdkz3KOHPwIjn6BhZC7z8mx+pnJODU3cYukxv3WTct" +
"lUhAsyjJiQ/0bK1yX87ulqFVgO0Knmh+wNajrb9wiONAJTMICG7tiWJOm7fW5cfTJwWkBwYADmkfTRmHDvqzQSSvoC2S7aa" +
"9QulbC3C/qgGFNrcWgcT9kCgYAZTa1P9bFCDU7hJc2mHwJwAW7/FQKEJg8SL33KINpLwcR8fqaYOdAHWWz636osVEqosRrH" +
"zJOGpf9x2RSWzQJ+dq8+6fACgfFZOVpN644+sAHfNPAI/gnNKU5OfUv+eav8fBnzlf1A3y3GIkyMyzFN3DE7e0n/lyqxE4H" +
"BYGpI8g==";
const test = base.extend<{ user: PasskeyUser }>({
user: async ({page}, use) => {
// Initialize a CDP session for the current page
const client = await page.context().newCDPSession(page);
// Enable WebAuthn environment in this session
await client.send('WebAuthn.enable', {enableUI: true});
// Attach a virtual authenticator with specific options
const result = await client.send('WebAuthn.addVirtualAuthenticator', {
options: {
protocol: 'ctap2',
transport: 'usb',
hasResidentKey: true,
hasUserVerification: true,
isUserVerified: true,
},
});
const authenticatorId = result.authenticatorId;
const url = new URL(process.env.ZITADEL_API_URL!)
await client.send('WebAuthn.addCredential', {
credential: {
credentialId: "",
rpId: url.hostname,
privateKey: BASE64_ENCODED_PK,
isResidentCredential: false,
signCount: 0,
},
authenticatorId: authenticatorId
});
await client.send('WebAuthn.setUserVerified', {
authenticatorId: authenticatorId,
isUserVerified: true,
});
await client.send('WebAuthn.setAutomaticPresenceSimulation', {
authenticatorId: authenticatorId,
enabled: true,
});
const user = new PasskeyUser({
email: "password@example.com",
firstName: "first",
lastName: "last",
organization: "",
});
await user.ensure();
const respJson = await user.ensurePasskeyRegister();
const credential = await navigator.credentials.create({
publicKey: respJson.publicKeyCredentialCreationOptions
});
await user.ensurePasskeyVerify(respJson.passkeyId, respJson.publicKeyCredentialCreationOptions)
use(user);
await client.send('WebAuthn.setAutomaticPresenceSimulation', {
authenticatorId,
enabled: false,
});
},
});*/
const test = base.extend<{ user: PasskeyUser }>({
user: async ({page}, use) => {
const user = new PasskeyUser({
@@ -105,5 +22,5 @@ const test = base.extend<{ user: PasskeyUser }>({
test("username and passkey login", async ({user, page}) => {
await user.login(page)
await page.getByRole("heading", {name: "Welcome " + user.fullName() + "!"}).click();
await checkLogin(page, user.fullName());
});

2
acceptance/tests/username-password-changed.spec.ts
View File

@@ -2,6 +2,7 @@ import {test as base} from "@playwright/test";
import {PasswordUser} from './user';
import path from 'path';
import dotenv from 'dotenv';
import {checkLogin} from "./login";
// Read from ".env" file.
dotenv.config({path: path.resolve(__dirname, '.env.local')});
@@ -23,4 +24,5 @@ const test = base.extend<{ user: PasswordUser }>({
test("username and password changed login", async ({user, page}) => {
await user.changePassword(page, "ChangedPw1!")
await user.login(page)
await checkLogin(page, user.fullName());
});

3
acceptance/tests/username-password.spec.ts
View File

@@ -2,6 +2,7 @@ import {test as base} from "@playwright/test";
import {PasswordUser} from './user';
import path from 'path';
import dotenv from 'dotenv';
import {checkLogin} from "./login";
// Read from ".env" file.
dotenv.config({path: path.resolve(__dirname, '.env.local')});
@@ -22,7 +23,7 @@ const test = base.extend<{ user: PasswordUser }>({
test("username and password login", async ({user, page}) => {
await user.login(page)
await page.getByRole("heading", {name: "Welcome " + user.fullName() + "!"}).click();
await checkLogin(page, user.fullName());
});

50
acceptance/tests/zitadel.ts Normal file
View File

@@ -0,0 +1,50 @@
import fetch from "node-fetch";
export async function removeUserByUsername(username: string) {
const resp = await getUserByUsername(username)
if (!resp || !resp.result || !resp.result[0]) {
return
}
await removeUser(resp.result[0].userId)
}
export async function removeUser(id: string) {
const response = await fetch(process.env.ZITADEL_API_URL! + "/v2/users/" + id, {
method: 'DELETE',
headers: {
'Authorization': "Bearer " + process.env.ZITADEL_SERVICE_USER_TOKEN!
}
});
if (response.statusCode >= 400 && response.statusCode != 404) {
const error = 'HTTP Error: ' + response.statusCode + ' - ' + response.statusMessage;
console.error(error);
throw new Error(error);
}
return
}
export async function getUserByUsername(username: string) {
const listUsersBody = {
queries: [{
userNameQuery: {
userName: username,
}
}]
}
const jsonBody = JSON.stringify(listUsersBody)
const registerResponse = await fetch(process.env.ZITADEL_API_URL! + "/v2/users", {
method: 'POST',
body: jsonBody,
headers: {
'Content-Type': 'application/json',
'Authorization': "Bearer " + process.env.ZITADEL_SERVICE_USER_TOKEN!
}
});
if (registerResponse.statusCode >= 400) {
const error = 'HTTP Error: ' + registerResponse.statusCode + ' - ' + registerResponse.statusMessage;
console.error(error);
throw new Error(error);
}
const respJson = await registerResponse.json()
return respJson
}

1
apps/login/src/components/authentication-method-radio.tsx
View File

@@ -30,6 +30,7 @@ export function AuthenticationMethodRadio({
<RadioGroup.Option
key={method.name}
value={method}
data-testid={method.name+"-radio"}
className={({ active, checked }) =>
`${
active

2
apps/login/src/components/set-register-password-form.tsx
View File

@@ -178,7 +178,7 @@ export function SetRegisterPasswordForm({
{error && <Alert>{error}</Alert>}
<div className="mt-8 flex w-full flex-row items-center justify-between">
<BackButton />
<BackButton data-testid="back-button" />
<Button
type="submit"
variant={ButtonVariants.Primary}

2
apps/login/src/lib/server/password.ts
View File

@@ -71,8 +71,6 @@ export async function sendPassword(command: UpdateSessionCommand) {
organizationId: command.organization,
});
console.log(users);
if (users.details?.totalResult == BigInt(1) && users.result[0].userId) {
user = users.result[0];

1
apps/login/src/lib/server/register.ts
View File

@@ -43,7 +43,6 @@ export async function registerUser(command: RegisterUserCommand) {
password: {password: command.password}
});
}
console.log(checks)
return createSessionAndUpdateCookie(
checks,
undefined,

2
playwright.config.ts
View File

@@ -26,7 +26,7 @@ export default defineConfig({
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: "http://127.0.0.1:3000",
baseURL: "http://localhost:3000",
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: "on-first-retry",