Merge branch 'acceptance-test-suite' into test_definitions

This commit is contained in:
Max Peintner
2024-11-18 17:29:29 +01:00
committed by GitHub
35 changed files with 811 additions and 740 deletions

View File

@@ -4,10 +4,6 @@ on: pull_request
jobs:
quality:
env:
ZITADEL_IMAGE: ghcr.io/zitadel/zitadel:v2.63.4
POSTGRES_IMAGE: postgres:17.0-alpine3.19
name: Ensure Quality
runs-on: ubuntu-latest

View File

@@ -1,7 +1,7 @@
services:
zitadel:
user: "${ZITADEL_DEV_UID}"
image: "${ZITADEL_IMAGE:-ghcr.io/zitadel/zitadel:latest}"
image: ghcr.io/zitadel/zitadel:v2.65.0
command: 'start-from-init --masterkey "MasterkeyNeedsToHave32Characters" --tlsMode disabled --config /zitadel.yaml --steps /zitadel.yaml'
ports:
- "8080:8080"
@@ -13,8 +13,8 @@ services:
condition: "service_healthy"
db:
restart: 'always'
image: "${POSTGRES_IMAGE:-postgres:latest}"
restart: "always"
image: postgres:17.0-alpine3.19
environment:
- POSTGRES_USER=zitadel
- PGUSER=zitadel
@@ -23,21 +23,16 @@ services:
command: postgres -c shared_preload_libraries=pg_stat_statements -c pg_stat_statements.track=all -c shared_buffers=1GB -c work_mem=16MB -c effective_io_concurrency=100 -c wal_level=minimal -c archive_mode=off -c max_wal_senders=0
healthcheck:
test: ["CMD-SHELL", "pg_isready"]
interval: '10s'
timeout: '30s'
interval: "10s"
timeout: "30s"
retries: 5
start_period: '20s'
start_period: "20s"
ports:
- 5432:5432
wait_for_zitadel:
image: curlimages/curl:8.00.1
command:
[
"/bin/sh",
"-c",
"i=0; while ! curl http://zitadel:8080/debug/ready && [ $$i -lt 30 ]; do sleep 1; i=$$((i+1)); done; [ $$i -eq 120 ] && exit 1 || exit 0",
]
command: /bin/sh -c "until curl -s -o /dev/null -i -f http://zitadel:8080/debug/ready; do echo 'waiting' && sleep 1; done; echo 'ready' && sleep 5;" || false
depends_on:
- zitadel
@@ -49,9 +44,11 @@ services:
PAT_FILE: /pat/zitadel-admin-sa.pat
ZITADEL_API_INTERNAL_URL: http://zitadel:8080
WRITE_ENVIRONMENT_FILE: /apps/login/.env.local
WRITE_TEST_ENVIRONMENT_FILE: /acceptance/tests/.env.local
volumes:
- "./pat:/pat"
- "../apps/login:/apps/login"
- "../acceptance/tests:/acceptance/tests"
depends_on:
wait_for_zitadel:
condition: "service_completed_successfully"

View File

@@ -26,9 +26,30 @@ fi
WRITE_ENVIRONMENT_FILE=${WRITE_ENVIRONMENT_FILE:-$(dirname "$0")/../apps/login/.env.local}
echo "Writing environment file to ${WRITE_ENVIRONMENT_FILE} when done."
WRITE_TEST_ENVIRONMENT_FILE=${WRITE_TEST_ENVIRONMENT_FILE:-$(dirname "$0")/../acceptance/tests/.env.local}
echo "Writing environment file to ${WRITE_TEST_ENVIRONMENT_FILE} when done."
echo "ZITADEL_API_URL=${ZITADEL_API_URL}
ZITADEL_SERVICE_USER_ID=${ZITADEL_SERVICE_USER_ID}
ZITADEL_SERVICE_USER_TOKEN=${PAT}" > ${WRITE_ENVIRONMENT_FILE}
ZITADEL_SERVICE_USER_TOKEN=${PAT}
DEBUG=true"| tee "${WRITE_ENVIRONMENT_FILE}" "${WRITE_TEST_ENVIRONMENT_FILE}" > /dev/null
echo "Wrote environment file ${WRITE_ENVIRONMENT_FILE}"
cat ${WRITE_ENVIRONMENT_FILE}
echo "Wrote environment file ${WRITE_TEST_ENVIRONMENT_FILE}"
cat ${WRITE_TEST_ENVIRONMENT_FILE}
DEFAULTORG_RESPONSE_RESULTS=0
# waiting for default organization
until [ ${DEFAULTORG_RESPONSE_RESULTS} -eq 1 ]
do
DEFAULTORG_RESPONSE=$(curl -s --request POST \
--url "${ZITADEL_API_INTERNAL_URL}/v2/organizations/_search" \
--header "Authorization: Bearer ${PAT}" \
--header "Host: ${ZITADEL_API_DOMAIN}" \
--header "Content-Type: application/json" \
-d "{\"queries\": [{\"defaultQuery\":{}}]}" )
echo "Received default organization response: ${DEFAULTORG_RESPONSE}"
DEFAULTORG_RESPONSE_RESULTS=$(echo $DEFAULTORG_RESPONSE | jq -r '.result | length')
echo "Received default organization response result: ${DEFAULTORG_RESPONSE_RESULTS}"
done

View File

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

View File

@@ -1,29 +1,28 @@
import {expect, Page} from "@playwright/test";
import {loginname} from "./loginname";
import {password} from "./password";
import { expect, Page } from "@playwright/test";
import { loginname } from "./loginname";
import { password } from "./password";
export async function startLogin(page: Page) {
await page.goto("/loginname");
await page.goto("/loginname");
}
export async function loginWithPassword(page: Page, username: string, pw: string) {
await startLogin(page);
await loginname(page, username);
await password(page, pw);
await startLogin(page);
await loginname(page, username);
await password(page, pw);
}
export async function loginWithPasskey(page: Page, authenticatorId: string, username: string) {
await startLogin(page);
await loginname(page, username);
// await passkey(page, authenticatorId);
await startLogin(page);
await loginname(page, username);
// await passkey(page, authenticatorId);
}
export async function loginScreenExpect(page: Page, fullName: string) {
await expect(page.getByRole('heading')).toContainText(fullName);
await expect(page).toHaveURL(/signedin.*/);
await expect(page.getByRole("heading")).toContainText(fullName);
}
export async function loginWithOTP(page: Page, username: string, password: string) {
await loginWithPassword(page, username, password);
await loginWithPassword(page, username, password);
}

View File

@@ -1,12 +1,12 @@
import {expect, Page} from "@playwright/test";
import { expect, Page } from "@playwright/test";
const usernameUserInput = "username-text-input"
const usernameUserInput = "username-text-input";
export async function loginnameScreen(page: Page, username: string) {
await page.getByTestId(usernameUserInput).pressSequentially(username);
await page.getByTestId(usernameUserInput).pressSequentially(username);
}
export async function loginnameScreenExpect(page: Page, username: string) {
await expect(page.getByTestId(usernameUserInput)).toHaveValue(username);
await expect(page.getByTestId('error').locator('div')).toContainText("Could not find user")
await expect(page.getByTestId(usernameUserInput)).toHaveValue(username);
await expect(page.getByTestId("error").locator("div")).toContainText("Could not find user");
}

View File

@@ -1,7 +1,7 @@
import {Page} from "@playwright/test";
import {loginnameScreen} from "./loginname-screen";
import { Page } from "@playwright/test";
import { loginnameScreen } from "./loginname-screen";
export async function loginname(page: Page, username: string) {
await loginnameScreen(page, username)
await page.getByTestId("submit-button").click()
await loginnameScreen(page, username);
await page.getByTestId("submit-button").click();
}

View File

@@ -3,29 +3,29 @@ import * as http from "node:http";
let messages = new Map<string, any>();
export function startSink() {
const hostname = "127.0.0.1"
const port = 3030
const hostname = "127.0.0.1";
const port = 3030;
const server = http.createServer((req, res) => {
console.log("Sink received message: ")
let body = '';
req.on('data', (chunk) => {
body += chunk;
});
req.on('end', () => {
console.log(body);
const data = JSON.parse(body)
messages.set(data.contextInfo.recipientEmailAddress, data.args.code)
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.write('OK');
res.end();
});
const server = http.createServer((req, res) => {
console.log("Sink received message: ");
let body = "";
req.on("data", (chunk) => {
body += chunk;
});
server.listen(port, hostname, () => {
console.log(`Sink running at http://${hostname}:${port}/`);
req.on("end", () => {
console.log(body);
const data = JSON.parse(body);
messages.set(data.contextInfo.recipientEmailAddress, data.args.code);
res.statusCode = 200;
res.setHeader("Content-Type", "text/plain");
res.write("OK");
res.end();
});
return server
}
});
server.listen(port, hostname, () => {
console.log(`Sink running at http://${hostname}:${port}/`);
});
return server;
}

View File

@@ -1,110 +1,109 @@
import {expect, Page} from "@playwright/test";
import {CDPSession} from "playwright-core";
import { expect, Page } from "@playwright/test";
import { CDPSession } from "playwright-core";
interface session {
client: CDPSession
authenticatorId: string
client: CDPSession;
authenticatorId: string;
}
async function client(page: Page): Promise<session> {
const cdpSession = await page.context().newCDPSession(page);
await cdpSession.send('WebAuthn.enable', {enableUI: false});
const result = await cdpSession.send('WebAuthn.addVirtualAuthenticator', {
options: {
protocol: 'ctap2',
transport: 'internal',
hasResidentKey: true,
hasUserVerification: true,
isUserVerified: true,
automaticPresenceSimulation: true,
},
});
return {client: cdpSession, authenticatorId: result.authenticatorId};
const cdpSession = await page.context().newCDPSession(page);
await cdpSession.send("WebAuthn.enable", { enableUI: false });
const result = await cdpSession.send("WebAuthn.addVirtualAuthenticator", {
options: {
protocol: "ctap2",
transport: "internal",
hasResidentKey: true,
hasUserVerification: true,
isUserVerified: true,
automaticPresenceSimulation: true,
},
});
return { client: cdpSession, authenticatorId: result.authenticatorId };
}
export async function passkeyRegister(page: Page): Promise<string> {
const session = await client(page)
const session = await client(page);
await passkeyNotExisting(session.client, session.authenticatorId);
await simulateSuccessfulPasskeyRegister(
session.client,
session.authenticatorId,
() =>
page.getByTestId("submit-button").click()
);
await passkeyRegistered(session.client, session.authenticatorId);
await passkeyNotExisting(session.client, session.authenticatorId);
await simulateSuccessfulPasskeyRegister(session.client, session.authenticatorId, () =>
page.getByTestId("submit-button").click(),
);
await passkeyRegistered(session.client, session.authenticatorId);
return session.authenticatorId
return session.authenticatorId;
}
export async function passkey(page: Page, authenticatorId: string) {
const cdpSession = await page.context().newCDPSession(page);
await cdpSession.send('WebAuthn.enable', {enableUI: false});
const cdpSession = await page.context().newCDPSession(page);
await cdpSession.send("WebAuthn.enable", { enableUI: false });
const signCount = await passkeyExisting(cdpSession, authenticatorId);
const signCount = await passkeyExisting(cdpSession, authenticatorId);
await simulateSuccessfulPasskeyInput(
cdpSession,
authenticatorId,
() =>
page.getByTestId("submit-button").click()
);
await simulateSuccessfulPasskeyInput(cdpSession, authenticatorId, () => page.getByTestId("submit-button").click());
await passkeyUsed(cdpSession, authenticatorId, signCount);
await passkeyUsed(cdpSession, authenticatorId, signCount);
}
async function passkeyNotExisting(client: CDPSession, authenticatorId: string) {
const result = await client.send('WebAuthn.getCredentials', {authenticatorId});
expect(result.credentials).toHaveLength(0);
const result = await client.send("WebAuthn.getCredentials", { authenticatorId });
expect(result.credentials).toHaveLength(0);
}
async function passkeyRegistered(client: CDPSession, authenticatorId: string) {
const result = await client.send('WebAuthn.getCredentials', {authenticatorId});
expect(result.credentials).toHaveLength(1);
await passkeyUsed(client, authenticatorId, 0);
const result = await client.send("WebAuthn.getCredentials", { authenticatorId });
expect(result.credentials).toHaveLength(1);
await passkeyUsed(client, authenticatorId, 0);
}
async function passkeyExisting(client: CDPSession, authenticatorId: string): Promise<number> {
const result = await client.send('WebAuthn.getCredentials', {authenticatorId});
expect(result.credentials).toHaveLength(1);
return result.credentials[0].signCount
const result = await client.send("WebAuthn.getCredentials", { authenticatorId });
expect(result.credentials).toHaveLength(1);
return result.credentials[0].signCount;
}
async function passkeyUsed(client: CDPSession, authenticatorId: string, signCount: number) {
const result = await client.send('WebAuthn.getCredentials', {authenticatorId});
expect(result.credentials).toHaveLength(1);
expect(result.credentials[0].signCount).toBeGreaterThan(signCount);
const result = await client.send("WebAuthn.getCredentials", { authenticatorId });
expect(result.credentials).toHaveLength(1);
expect(result.credentials[0].signCount).toBeGreaterThan(signCount);
}
async function simulateSuccessfulPasskeyRegister(client: CDPSession, authenticatorId: string, operationTrigger: () => Promise<void>) {
// initialize event listeners to wait for a successful passkey input event
const operationCompleted = new Promise<void>(resolve => {
client.on('WebAuthn.credentialAdded', () => {
console.log('Credential Added!');
resolve()
});
async function simulateSuccessfulPasskeyRegister(
client: CDPSession,
authenticatorId: string,
operationTrigger: () => Promise<void>,
) {
// initialize event listeners to wait for a successful passkey input event
const operationCompleted = new Promise<void>((resolve) => {
client.on("WebAuthn.credentialAdded", () => {
console.log("Credential Added!");
resolve();
});
});
// perform a user action that triggers passkey prompt
await operationTrigger();
// perform a user action that triggers passkey prompt
await operationTrigger();
// wait to receive the event that the passkey was successfully registered or verified
await operationCompleted;
// wait to receive the event that the passkey was successfully registered or verified
await operationCompleted;
}
async function simulateSuccessfulPasskeyInput(client: CDPSession, authenticatorId: string, operationTrigger: () => Promise<void>) {
// initialize event listeners to wait for a successful passkey input event
const operationCompleted = new Promise<void>(resolve => {
client.on('WebAuthn.credentialAsserted', () => {
console.log('Credential Asserted!');
resolve()
});
async function simulateSuccessfulPasskeyInput(
client: CDPSession,
authenticatorId: string,
operationTrigger: () => Promise<void>,
) {
// initialize event listeners to wait for a successful passkey input event
const operationCompleted = new Promise<void>((resolve) => {
client.on("WebAuthn.credentialAsserted", () => {
console.log("Credential Asserted!");
resolve();
});
});
// perform a user action that triggers passkey prompt
await operationTrigger();
// perform a user action that triggers passkey prompt
await operationTrigger();
// wait to receive the event that the passkey was successfully registered or verified
await operationCompleted;
// wait to receive the event that the passkey was successfully registered or verified
await operationCompleted;
}
s

View File

@@ -1,47 +1,57 @@
import {expect, Page} from "@playwright/test";
import { expect, Page } from "@playwright/test";
const passwordField = 'password-text-input'
const passwordConfirmField = 'password-confirm-text-input'
const lengthCheck = "length-check"
const symbolCheck = "symbol-check"
const numberCheck = "number-check"
const uppercaseCheck = "uppercase-check"
const lowercaseCheck = "lowercase-check"
const equalCheck = "equal-check"
const passwordField = "password-text-input";
const passwordConfirmField = "password-confirm-text-input";
const lengthCheck = "length-check";
const symbolCheck = "symbol-check";
const numberCheck = "number-check";
const uppercaseCheck = "uppercase-check";
const lowercaseCheck = "lowercase-check";
const equalCheck = "equal-check";
const matchText = "Matches"
const noMatchText = "Doesn\'t match"
const matchText = "Matches";
const noMatchText = "Doesn't match";
export async function changePasswordScreen(page: Page, password1: string, password2: string) {
await page.getByTestId(passwordField).pressSequentially(password1);
await page.getByTestId(passwordConfirmField).pressSequentially(password2);
await page.getByTestId(passwordField).pressSequentially(password1);
await page.getByTestId(passwordConfirmField).pressSequentially(password2);
}
export async function passwordScreen(page: Page, password: string) {
await page.getByTestId(passwordField).pressSequentially(password);
await page.getByTestId(passwordField).pressSequentially(password);
}
export async function passwordScreenExpect(page: Page, password: string) {
await expect(page.getByTestId(passwordField)).toHaveValue(password);
await expect(page.getByTestId('error').locator('div')).toContainText("Could not verify password");
await expect(page.getByTestId(passwordField)).toHaveValue(password);
await expect(page.getByTestId("error").locator("div")).toContainText("Could not verify password");
}
export async function changePasswordScreenExpect(page: Page, password1: string, password2: string, length: boolean, symbol: boolean, number: boolean, uppercase: boolean, lowercase: boolean, equals: boolean) {
await expect(page.getByTestId(passwordField)).toHaveValue(password1);
await expect(page.getByTestId(passwordConfirmField)).toHaveValue(password2);
export async function changePasswordScreenExpect(
page: Page,
password1: string,
password2: string,
length: boolean,
symbol: boolean,
number: boolean,
uppercase: boolean,
lowercase: boolean,
equals: boolean,
) {
await expect(page.getByTestId(passwordField)).toHaveValue(password1);
await expect(page.getByTestId(passwordConfirmField)).toHaveValue(password2);
await checkContent(page, lengthCheck, length);
await checkContent(page, symbolCheck, symbol);
await checkContent(page, numberCheck, number);
await checkContent(page, uppercaseCheck, uppercase);
await checkContent(page, lowercaseCheck, lowercase);
await checkContent(page, equalCheck, equals);
await checkContent(page, lengthCheck, length);
await checkContent(page, symbolCheck, symbol);
await checkContent(page, numberCheck, number);
await checkContent(page, uppercaseCheck, uppercase);
await checkContent(page, lowercaseCheck, lowercase);
await checkContent(page, equalCheck, equals);
}
async function checkContent(page: Page, testid: string, match: boolean) {
if (match) {
await expect(page.getByTestId(testid)).toContainText(matchText);
} else {
await expect(page.getByTestId(testid)).toContainText(noMatchText);
}
}
if (match) {
await expect(page.getByTestId(testid)).toContainText(matchText);
} else {
await expect(page.getByTestId(testid)).toContainText(noMatchText);
}
}

View File

@@ -1,20 +1,19 @@
import {Page} from "@playwright/test";
import {changePasswordScreen, passwordScreen} from "./password-screen";
const passwordSubmitButton = "submit-button"
import { Page } from "@playwright/test";
import { changePasswordScreen, passwordScreen } from "./password-screen";
const passwordSubmitButton = "submit-button";
export async function startChangePassword(page: Page, loginname: string) {
await page.goto('password/change?' + new URLSearchParams({loginName: loginname}));
await page.goto("/password/change?" + new URLSearchParams({ loginName: loginname }));
}
export async function changePassword(page: Page, loginname: string, password: string) {
await startChangePassword(page, loginname);
await changePasswordScreen(page, password, password)
await page.getByTestId(passwordSubmitButton).click();
await startChangePassword(page, loginname);
await changePasswordScreen(page, password, password);
await page.getByTestId(passwordSubmitButton).click();
}
export async function password(page: Page, password: string) {
await passwordScreen(page, password)
await page.getByTestId(passwordSubmitButton).click()
await passwordScreen(page, password);
await page.getByTestId(passwordSubmitButton).click();
}

View File

@@ -1,27 +1,27 @@
import {Page} from "@playwright/test";
import { Page } from "@playwright/test";
const passwordField = 'password-text-input'
const passwordConfirmField = 'password-confirm-text-input'
const passwordField = "password-text-input";
const passwordConfirmField = "password-confirm-text-input";
export async function registerUserScreenPassword(page: Page, firstname: string, lastname: string, email: string) {
await registerUserScreen(page, firstname, lastname, email)
await page.getByTestId('Password-radio').click();
await registerUserScreen(page, firstname, lastname, email);
await page.getByTestId("Password-radio").click();
}
export async function registerUserScreenPasskey(page: Page, firstname: string, lastname: string, email: string) {
await registerUserScreen(page, firstname, lastname, email)
await page.getByTestId('Passkeys-radio').click();
await registerUserScreen(page, firstname, lastname, email);
await page.getByTestId("Passkeys-radio").click();
}
export async function registerPasswordScreen(page: Page, password1: string, password2: string) {
await page.getByTestId(passwordField).pressSequentially(password1);
await page.getByTestId(passwordConfirmField).pressSequentially(password2);
await page.getByTestId(passwordField).pressSequentially(password1);
await page.getByTestId(passwordConfirmField).pressSequentially(password2);
}
export async function registerUserScreen(page: Page, firstname: string, lastname: string, email: string) {
await page.getByTestId('firstname-text-input').pressSequentially(firstname);
await page.getByTestId('lastname-text-input').pressSequentially(lastname);
await page.getByTestId('email-text-input').pressSequentially(email);
await page.getByTestId('privacy-policy-checkbox').check();
await page.getByTestId('tos-checkbox').check();
}
await page.getByTestId("firstname-text-input").pressSequentially(firstname);
await page.getByTestId("lastname-text-input").pressSequentially(lastname);
await page.getByTestId("email-text-input").pressSequentially(email);
await page.getByTestId("privacy-policy-checkbox").check();
await page.getByTestId("tos-checkbox").check();
}

View File

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

View File

@@ -1,18 +1,25 @@
import {Page} from "@playwright/test";
import {passkeyRegister} from './passkey';
import {registerPasswordScreen, registerUserScreenPasskey, registerUserScreenPassword} from './register-screen';
import { Page } from "@playwright/test";
import { passkeyRegister } from "./passkey";
import { registerPasswordScreen, registerUserScreenPasskey, registerUserScreenPassword } from "./register-screen";
export async function registerWithPassword(page: Page, firstname: string, lastname: string, email: string, password1: string, password2: string) {
await page.goto('/register');
await registerUserScreenPassword(page, firstname, lastname, email)
await page.getByTestId('submit-button').click();
await registerPasswordScreen(page, password1, password2)
await page.getByTestId('submit-button').click();
export async function registerWithPassword(
page: Page,
firstname: string,
lastname: string,
email: string,
password1: string,
password2: string,
) {
await page.goto("/register");
await registerUserScreenPassword(page, firstname, lastname, email);
await page.getByTestId("submit-button").click();
await registerPasswordScreen(page, password1, password2);
await page.getByTestId("submit-button").click();
}
export async function registerWithPasskey(page: Page, firstname: string, lastname: string, email: string): Promise<string> {
await page.goto('/register');
await registerUserScreenPasskey(page, firstname, lastname, email)
await page.getByTestId('submit-button').click();
return await passkeyRegister(page)
await page.goto("/register");
await registerUserScreenPasskey(page, firstname, lastname, email);
await page.getByTestId("submit-button").click();
return await passkeyRegister(page);
}

View File

@@ -1,205 +1,216 @@
import fetch from "node-fetch";
import {Page} from "@playwright/test";
import {registerWithPasskey} from "./register";
import {loginWithPassword} from "./login";
import {changePassword} from "./password";
import {getUserByUsername, removeUser} from './zitadel';
import { Page } from "@playwright/test";
import axios from "axios";
import { registerWithPasskey } from "./register";
import { getUserByUsername, removeUser } from "./zitadel";
export interface userProps {
email: string;
firstName: string;
lastName: string;
organization: string;
password: string;
email: string;
firstName: string;
lastName: string;
organization: string;
password: string;
}
class User {
private readonly props: userProps;
private user: string;
private readonly props: userProps;
private user: string;
constructor(userProps: userProps) {
this.props = userProps;
constructor(userProps: userProps) {
this.props = userProps;
}
async ensure(page: Page) {
await this.remove();
const body = {
username: this.props.email,
organization: {
orgId: this.props.organization,
},
profile: {
givenName: this.props.firstName,
familyName: this.props.lastName,
},
email: {
email: this.props.email,
isVerified: true,
},
password: {
password: this.props.password!,
},
};
try {
const response = await axios.post(`${process.env.ZITADEL_API_URL}/v2/users/human`, body, {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${process.env.ZITADEL_SERVICE_USER_TOKEN}`,
},
});
if (response.status >= 400 && response.status !== 409) {
const error = `HTTP Error: ${response.status} - ${response.statusText}`;
console.error(error);
throw new Error(error);
}
} catch (error) {
console.error("Error making request:", error);
throw error;
}
async ensure(page: Page) {
await this.remove()
// wait for projection of user
await page.waitForTimeout(3000);
}
const body = {
username: this.props.email,
organization: {
orgId: this.props.organization
},
profile: {
givenName: this.props.firstName,
familyName: this.props.lastName,
},
email: {
email: this.props.email,
isVerified: true,
},
password: {
password: this.props.password!,
}
}
const response = await fetch(process.env.ZITADEL_API_URL! + "/v2/users/human", {
method: 'POST',
body: JSON.stringify(body),
headers: {
'Content-Type': 'application/json',
'Authorization': "Bearer " + process.env.ZITADEL_SERVICE_USER_TOKEN!
}
});
if (response.statusCode >= 400 && response.statusCode != 409) {
const error = 'HTTP Error: ' + response.statusCode + ' - ' + response.statusMessage;
console.error(error);
throw new Error(error);
}
return
async remove() {
const resp: any = await getUserByUsername(this.getUsername());
if (!resp || !resp.result || !resp.result[0]) {
return;
}
await removeUser(resp.result[0].userId);
}
async remove() {
await removeUser(this.getUserId())
return
}
public setUserId(userId: string) {
this.user = userId;
}
public setUserId(userId: string) {
this.user = userId
}
public getUserId() {
return this.user;
}
public getUserId() {
return this.user;
}
public getUsername() {
return this.props.email;
}
public getUsername() {
return this.props.email;
}
public getPassword() {
return this.props.password;
}
public getPassword() {
return this.props.password;
}
public getFirstname() {
return this.props.firstName;
}
public getFirstname() {
return this.props.firstName
}
public getLastname() {
return this.props.lastName;
}
public getLastname() {
return this.props.lastName
}
public getFullName() {
return this.props.firstName + " " + this.props.lastName
}
public async doPasswordChange(page: Page, password: string) {
await loginWithPassword(page, this.getUsername(), this.getPassword())
await changePassword(page, this.getUsername(), password)
this.props.password = password
}
public getFullName() {
return `${this.props.firstName} ${this.props.lastName}`;
}
}
export class PasswordUser extends User {
}
export class PasswordUser extends User {}
export enum OtpType {
sms = "sms",
email = "email",
sms = "sms",
email = "email",
}
export interface otpUserProps {
email: string;
firstName: string;
lastName: string;
organization: string;
password: string,
type: OtpType,
email: string;
firstName: string;
lastName: string;
organization: string;
password: string;
type: OtpType;
}
export class PasswordUserWithOTP extends User {
private type: OtpType
private code: string
private type: OtpType;
private code: string;
constructor(props: otpUserProps) {
super({
email: props.email,
firstName: props.firstName,
lastName: props.lastName,
organization: props.organization,
password: props.password,
})
this.type = props.type
constructor(props: otpUserProps) {
super({
email: props.email,
firstName: props.firstName,
lastName: props.lastName,
organization: props.organization,
password: props.password,
});
this.type = props.type;
}
async ensure(page: Page) {
await super.ensure(page);
let url = "otp_";
switch (this.type) {
case OtpType.sms:
url = url + "sms";
break;
case OtpType.email:
url = url + "email";
break;
}
async ensure(page: Page) {
await super.ensure(page)
try {
const response = await axios.post(
`${process.env.ZITADEL_API_URL}/v2/users/${this.getUserId()}/${url}`,
{},
{
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${process.env.ZITADEL_SERVICE_USER_TOKEN}`,
},
},
);
let url = "otp_"
switch (this.type) {
case OtpType.sms:
url = url + "sms"
case OtpType.email:
url = url + "email"
}
if (response.status >= 400 && response.status !== 409) {
const error = `HTTP Error: ${response.status} - ${response.statusText}`;
console.error(error);
throw new Error(error);
}
const response = await fetch(process.env.ZITADEL_API_URL! + "/v2/users/" + this.getUserId() + "/" + url, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': "Bearer " + process.env.ZITADEL_SERVICE_USER_TOKEN!
}
});
if (response.statusCode >= 400 && response.statusCode != 409) {
const error = 'HTTP Error: ' + response.statusCode + ' - ' + response.statusMessage;
console.error(error);
throw new Error(error);
}
// TODO: get code from SMS or Email provider
this.code = ""
return
// TODO: get code from SMS or Email provider
this.code = "";
} catch (error) {
console.error("Error making request:", error);
throw error;
}
public getCode() {
return this.code
}
// wait for projection of user
await page.waitForTimeout(2000);
}
public getCode() {
return this.code;
}
}
export interface passkeyUserProps {
email: string;
firstName: string;
lastName: string;
organization: string;
email: string;
firstName: string;
lastName: string;
organization: string;
}
export class PasskeyUser extends User {
private authenticatorId: string
private authenticatorId: string;
constructor(props: passkeyUserProps) {
super({
email: props.email,
firstName: props.firstName,
lastName: props.lastName,
organization: props.organization,
password: ""
})
}
constructor(props: passkeyUserProps) {
super({
email: props.email,
firstName: props.firstName,
lastName: props.lastName,
organization: props.organization,
password: "",
});
}
public async ensure(page: Page) {
await this.remove()
const authId = await registerWithPasskey(page, this.getFirstname(), this.getLastname(), this.getUsername())
this.authenticatorId = authId
}
public async ensure(page: Page) {
await this.remove();
const authId = await registerWithPasskey(page, this.getFirstname(), this.getLastname(), this.getUsername());
this.authenticatorId = authId;
public async remove() {
const resp = await getUserByUsername(this.getUsername())
if (!resp || !resp.result || !resp.result[0]) {
return
}
this.setUserId(resp.result[0].userId)
await super.remove()
}
// wait for projection of user
await page.waitForTimeout(2000);
}
public getAuthenticatorId(): string {
return this.authenticatorId
}
public async remove() {
await super.remove();
}
public getAuthenticatorId(): string {
return this.authenticatorId;
}
}

View File

@@ -1,28 +1,28 @@
import {test as base} from "@playwright/test";
import path from 'path';
import dotenv from 'dotenv';
import {PasskeyUser} from "./user";
import {loginScreenExpect, loginWithPasskey} from "./login";
import { test as base } from "@playwright/test";
import dotenv from "dotenv";
import path from "path";
import { loginScreenExpect, loginWithPasskey } from "./login";
import { PasskeyUser } from "./user";
// Read from ".env" file.
dotenv.config({path: path.resolve(__dirname, '.env.local')});
dotenv.config({ path: path.resolve(__dirname, ".env.local") });
const test = base.extend<{ user: PasskeyUser }>({
user: async ({page}, use) => {
const user = new PasskeyUser({
email: "passkey@example.com",
firstName: "first",
lastName: "last",
organization: "",
});
await user.ensure(page);
await use(user);
},
user: async ({ page }, use) => {
const user = new PasskeyUser({
email: "passkey@example.com",
firstName: "first",
lastName: "last",
organization: "",
});
await user.ensure(page);
await use(user);
},
});
test("username and passkey login", async ({user, page}) => {
await loginWithPasskey(page, user.getAuthenticatorId(), user.getUsername())
await loginScreenExpect(page, user.getFullName());
test("username and passkey login", async ({ user, page }) => {
await loginWithPasskey(page, user.getAuthenticatorId(), user.getUsername());
await loginScreenExpect(page, user.getFullName());
});
test("username and passkey login, if passkey enabled", async ({user, page}) => {

View File

@@ -1,41 +1,47 @@
import {test as base} from "@playwright/test";
import {PasswordUser} from './user';
import path from 'path';
import dotenv from 'dotenv';
import {loginScreenExpect, loginWithPassword} from "./login";
import {changePassword, startChangePassword} from "./password";
import {changePasswordScreen, changePasswordScreenExpect} from "./password-screen";
import { test as base } from "@playwright/test";
import dotenv from "dotenv";
import path from "path";
import { loginScreenExpect, loginWithPassword } from "./login";
import { changePassword, startChangePassword } from "./password";
import { changePasswordScreen, changePasswordScreenExpect } from "./password-screen";
import { PasswordUser } from "./user";
// Read from ".env" file.
dotenv.config({path: path.resolve(__dirname, '.env.local')});
dotenv.config({ path: path.resolve(__dirname, ".env.local") });
const test = base.extend<{ user: PasswordUser }>({
user: async ({page}, use) => {
const user = new PasswordUser({
email: "password-changed@example.com",
firstName: "first",
lastName: "last",
password: "Password1!",
organization: "",
});
await user.ensure(page);
await use(user);
},
user: async ({ page }, use) => {
const user = new PasswordUser({
email: "password-changed@example.com",
firstName: "first",
lastName: "last",
password: "Password1!",
organization: "",
});
await user.ensure(page);
await use(user);
},
});
test("username and password changed login", async ({user, page}) => {
const changedPw = "ChangedPw1!"
await loginWithPassword(page, user.getUsername(), user.getPassword())
await changePassword(page, user.getUsername(), changedPw)
await loginWithPassword(page, user.getUsername(), changedPw)
await loginScreenExpect(page, user.getFullName());
test("username and password changed login", async ({ user, page }) => {
const changedPw = "ChangedPw1!";
await loginWithPassword(page, user.getUsername(), user.getPassword());
// wait for projection of token
await page.waitForTimeout(2000);
await changePassword(page, user.getUsername(), changedPw);
await loginScreenExpect(page, user.getFullName());
await loginWithPassword(page, user.getUsername(), changedPw);
await loginScreenExpect(page, user.getFullName());
});
test("password not with desired complexity", async ({user, page}) => {
const changedPw1 = "change"
const changedPw2 = "chang"
await loginWithPassword(page, user.getUsername(), user.getPassword())
await startChangePassword(page, user.getUsername());
await changePasswordScreen(page, changedPw1, changedPw2)
await changePasswordScreenExpect(page, changedPw1, changedPw2, false, false, false, false, true, false)
test("password not with desired complexity", async ({ user, page }) => {
const changedPw1 = "change";
const changedPw2 = "chang";
await loginWithPassword(page, user.getUsername(), user.getPassword());
await startChangePassword(page, user.getUsername());
await changePasswordScreen(page, changedPw1, changedPw2);
await changePasswordScreenExpect(page, changedPw1, changedPw2, false, false, false, false, true, false);
});

View File

@@ -1,39 +1,36 @@
import {test as base} from "@playwright/test";
import {OtpType, PasswordUserWithOTP} from './user';
import path from 'path';
import dotenv from 'dotenv';
import {loginScreenExpect, loginWithPassword} from "./login";
import {startSink} from "./otp";
import { test as base } from "@playwright/test";
import dotenv from "dotenv";
import path from "path";
import { OtpType, PasswordUserWithOTP } from "./user";
// Read from ".env" file.
dotenv.config({path: path.resolve(__dirname, '.env.local')});
dotenv.config({ path: path.resolve(__dirname, ".env.local") });
const test = base.extend<{ user: PasswordUserWithOTP }>({
user: async ({page}, use) => {
const user = new PasswordUserWithOTP({
email: "otp_sms@example.com",
firstName: "first",
lastName: "last",
password: "Password1!",
organization: "",
type: OtpType.sms,
});
user: async ({ page }, use) => {
const user = new PasswordUserWithOTP({
email: "otp_sms@example.com",
firstName: "first",
lastName: "last",
password: "Password1!",
organization: "",
type: OtpType.sms,
});
await user.ensure(page);
await use(user);
},
await user.ensure(page);
await use(user);
},
});
test("username, password and otp login", async ({user, page}) => {
const server = startSink()
await loginWithPassword(page, user.getUsername(), user.getPassword())
/*
test("username, password and otp login", async ({ user, page }) => {
//const server = startSink()
await loginWithPassword(page, user.getUsername(), user.getPassword());
await loginScreenExpect(page, user.getFullName());
server.close()
await loginScreenExpect(page, user.getFullName());
//server.close()
});
test("username, password and sms otp login", async ({user, page}) => {
// Given sms otp is enabled on the organizaiton of the user
// Given the user has only sms otp configured as second factor
@@ -45,7 +42,6 @@ test("username, password and sms otp login", async ({user, page}) => {
// User is redirected to the app (default redirect url)
});
test("username, password and sms otp login, resend code", async ({user, page}) => {
// Given sms otp is enabled on the organizaiton of the user
// Given the user has only sms otp configured as second factor
@@ -58,7 +54,6 @@ test("username, password and sms otp login, resend code", async ({user, page}) =
// User is redirected to the app (default redirect url)
});
test("username, password and sms otp login, wrong code", async ({user, page}) => {
// Given sms otp is enabled on the organizaiton of the user
// Given the user has only sms otp configured as second factor
@@ -69,3 +64,4 @@ test("username, password and sms otp login, wrong code", async ({user, page}) =>
// User enters a wrond code
// Error message - "Invalid code" is shown
});
*/

View File

@@ -1,47 +1,47 @@
import {test as base} from "@playwright/test";
import {PasswordUser} from './user';
import path from 'path';
import dotenv from 'dotenv';
import {loginScreenExpect, loginWithPassword, startLogin} from "./login";
import {loginnameScreenExpect} from "./loginname-screen";
import {passwordScreenExpect} from "./password-screen";
import {loginname} from "./loginname";
import {password} from "./password";
import { test as base } from "@playwright/test";
import dotenv from "dotenv";
import path from "path";
import { loginScreenExpect, loginWithPassword, startLogin } from "./login";
import { loginname } from "./loginname";
import { loginnameScreenExpect } from "./loginname-screen";
import { password } from "./password";
import { passwordScreenExpect } from "./password-screen";
import { PasswordUser } from "./user";
// Read from ".env" file.
dotenv.config({path: path.resolve(__dirname, '.env.local')});
dotenv.config({ path: path.resolve(__dirname, ".env.local") });
const test = base.extend<{ user: PasswordUser }>({
user: async ({page}, use) => {
const user = new PasswordUser({
email: "password@example.com",
firstName: "first",
lastName: "last",
password: "Password1!",
organization: "",
});
await user.ensure(page);
await use(user);
},
user: async ({ page }, use) => {
const user = new PasswordUser({
email: "password@example.com",
firstName: "first",
lastName: "last",
password: "Password1!",
organization: "",
});
await user.ensure(page);
await use(user);
},
});
test("username and password login", async ({user, page}) => {
await loginWithPassword(page, user.getUsername(), user.getPassword())
await loginScreenExpect(page, user.getFullName());
test("username and password login", async ({ user, page }) => {
await loginWithPassword(page, user.getUsername(), user.getPassword());
await loginScreenExpect(page, user.getFullName());
});
test("username and password login, unknown username", async ({page}) => {
const username = "unknown"
await startLogin(page);
await loginname(page, username)
await loginnameScreenExpect(page, username)
test("username and password login, unknown username", async ({ page }) => {
const username = "unknown";
await startLogin(page);
await loginname(page, username);
await loginnameScreenExpect(page, username);
});
test("username and password login, wrong password", async ({user, page}) => {
await startLogin(page);
await loginname(page, user.getUsername())
await password(page, "wrong")
await passwordScreenExpect(page, "wrong")
test("username and password login, wrong password", async ({ user, page }) => {
await startLogin(page);
await loginname(page, user.getUsername());
await password(page, "wrong");
await passwordScreenExpect(page, "wrong");
});
test("username and password login, wrong username, ignore unknown usernames", async ({user, page}) => {

View File

@@ -1,50 +1,60 @@
import fetch from "node-fetch";
import axios from "axios";
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)
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!
}
try {
const response = await axios.delete(`${process.env.ZITADEL_API_URL}/v2/users/${id}`, {
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);
if (response.status >= 400 && response.status !== 404) {
const error = `HTTP Error: ${response.status} - ${response.statusText}`;
console.error(error);
throw new Error(error);
}
return
} catch (error) {
console.error("Error making request:", error);
throw error;
}
}
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!
}
const listUsersBody = {
queries: [
{
userNameQuery: {
userName: username,
},
},
],
};
try {
const response = await axios.post(`${process.env.ZITADEL_API_URL}/v2/users`, listUsersBody, {
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);
if (response.status >= 400) {
const error = `HTTP Error: ${response.status} - ${response.statusText}`;
console.error(error);
throw new Error(error);
}
const respJson = await registerResponse.json()
return respJson
}
return response.data;
} catch (error) {
console.error("Error making request:", error);
throw error;
}
}

View File

@@ -1,5 +1,11 @@
FirstInstance:
PatPath: /pat/zitadel-admin-sa.pat
PrivacyPolicy:
TOSLink: "https://zitadel.com/docs/legal/terms-of-service"
PrivacyLink: "https://zitadel.com/docs/legal/policies/privacy-policy"
HelpLink: "https://zitadel.com/docs"
SupportEmail: "support@zitadel.com"
DocsLink: "https://zitadel.com/docs"
Org:
Human:
UserName: zitadel-admin

View File

@@ -2,6 +2,14 @@ import { stub } from "../support/mock";
describe("login", () => {
beforeEach(() => {
stub("zitadel.org.v2.OrganizationService", "ListOrganizations", {
data: {
details: {
totalResult: 1,
},
result: [{ id: "256088834543534543" }],
},
});
stub("zitadel.session.v2.SessionService", "CreateSession", {
data: {
details: {

View File

@@ -3,11 +3,12 @@ import { SignInWithIdp } from "@/components/sign-in-with-idp";
import { UsernameForm } from "@/components/username-form";
import {
getBrandingSettings,
getLegalAndSupportSettings,
getDefaultOrg,
getLoginSettings,
settingsService,
} from "@/lib/zitadel";
import { makeReqCtx } from "@zitadel/client/v2";
import { Organization } from "@zitadel/proto/zitadel/org/v2/org_pb";
import { getLocale, getTranslations } from "next-intl/server";
function getIdentityProviders(orgId?: string) {
@@ -31,16 +32,29 @@ export default async function Page({
const organization = searchParams?.organization;
const submit: boolean = searchParams?.submit === "true";
const loginSettings = await getLoginSettings(organization);
const legal = await getLegalAndSupportSettings();
const identityProviders = await getIdentityProviders(organization);
let defaultOrganization;
if (!organization) {
const org: Organization | null = await getDefaultOrg();
if (org) {
defaultOrganization = org.id;
}
}
const host = process.env.VERCEL_URL
? `https://${process.env.VERCEL_URL}`
: "http://localhost:3000";
const branding = await getBrandingSettings(organization);
const loginSettings = await getLoginSettings(
organization ?? defaultOrganization,
);
const identityProviders = await getIdentityProviders(
organization ?? defaultOrganization,
);
const branding = await getBrandingSettings(
organization ?? defaultOrganization,
);
return (
<DynamicTheme branding={branding}>
@@ -51,16 +65,16 @@ export default async function Page({
<UsernameForm
loginName={loginName}
authRequestId={authRequestId}
organization={organization}
organization={organization} // stick to "organization" as we still want to do user discovery based on the searchParams not the default organization, later the organization is determined by the found user
submit={submit}
allowRegister={!!loginSettings?.allowRegister}
>
{legal && identityProviders && process.env.ZITADEL_API_URL && (
{identityProviders && process.env.ZITADEL_API_URL && (
<SignInWithIdp
host={host}
identityProviders={identityProviders}
authRequestId={authRequestId}
organization={organization}
organization={organization ?? defaultOrganization} // use the organization from the searchParams here otherwise fallback to the default organization
></SignInWithIdp>
)}
</UsernameForm>

View File

@@ -3,7 +3,12 @@ import { DynamicTheme } from "@/components/dynamic-theme";
import { PasswordForm } from "@/components/password-form";
import { UserAvatar } from "@/components/user-avatar";
import { loadMostRecentSession } from "@/lib/session";
import { getBrandingSettings, getLoginSettings } from "@/lib/zitadel";
import {
getBrandingSettings,
getDefaultOrg,
getLoginSettings,
} from "@/lib/zitadel";
import { Organization } from "@zitadel/proto/zitadel/org/v2/org_pb";
import { PasskeysType } from "@zitadel/proto/zitadel/settings/v2/login_settings_pb";
import { getLocale, getTranslations } from "next-intl/server";
@@ -16,7 +21,16 @@ export default async function Page({
const t = await getTranslations({ locale, namespace: "password" });
const tError = await getTranslations({ locale, namespace: "error" });
const { loginName, organization, authRequestId, alt } = searchParams;
let { loginName, organization, authRequestId, alt } = searchParams;
let defaultOrganization;
if (!organization) {
const org: Organization | null = await getDefaultOrg();
if (org) {
defaultOrganization = org.id;
}
}
// also allow no session to be found (ignoreUnkownUsername)
let sessionFactors;
@@ -30,8 +44,12 @@ export default async function Page({
console.warn(error);
}
const branding = await getBrandingSettings(organization);
const loginSettings = await getLoginSettings(organization);
const branding = await getBrandingSettings(
organization ?? defaultOrganization,
);
const loginSettings = await getLoginSettings(
organization ?? defaultOrganization,
);
return (
<DynamicTheme branding={branding}>
@@ -62,7 +80,7 @@ export default async function Page({
<PasswordForm
loginName={loginName}
authRequestId={authRequestId}
organization={organization}
organization={organization} // stick to "organization" as we still want to do user discovery based on the searchParams not the default organization, later the organization is determined by the found user
loginSettings={loginSettings}
promptPasswordless={
loginSettings?.passkeysType === PasskeysType.ALLOWED

View File

@@ -22,13 +22,8 @@ export default async function Page({
searchParams;
if (!organization) {
const org: Organization | null = await getDefaultOrg().catch((error) => {
console.warn(error);
return null;
});
if (!org) {
console.warn("No default organization found");
} else {
const org: Organization | null = await getDefaultOrg();
if (org) {
organization = org.id;
}
}

View File

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

View File

@@ -12,6 +12,7 @@ import { create } from "@zitadel/client";
import { ChecksSchema } from "@zitadel/proto/zitadel/session/v2/session_service_pb";
import { PasswordComplexitySettings } from "@zitadel/proto/zitadel/settings/v2/password_settings_pb";
import { useTranslations } from "next-intl";
import { redirect } from "next/navigation";
import { useState } from "react";
import { FieldValues, useForm } from "react-hook-form";
import { Alert } from "./alert";
@@ -103,6 +104,11 @@ export function ChangePasswordForm({
passwordResponse.error
) {
setError(passwordResponse.error);
return;
}
if (passwordResponse && passwordResponse.nextStep) {
return redirect(passwordResponse.nextStep);
}
return;

View File

@@ -1,71 +0,0 @@
"use client";
import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/solid";
import { clsx } from "clsx";
import {
createContext,
Dispatch,
ReactNode,
SetStateAction,
useContext,
useState,
} from "react";
const MobileNavContext = createContext<
[boolean, Dispatch<SetStateAction<boolean>>] | undefined
>(undefined);
export function MobileNavContextProvider({
children,
}: {
children: ReactNode;
}) {
const [isOpen, setIsOpen] = useState(false);
return (
<MobileNavContext.Provider value={[isOpen, setIsOpen]}>
{children}
</MobileNavContext.Provider>
);
}
export function useMobileNavToggle() {
const context = useContext(MobileNavContext);
if (context === undefined) {
throw new Error(
"useMobileNavToggle must be used within a MobileNavContextProvider",
);
}
return context;
}
export function MobileNavToggle({ children }: { children: ReactNode }) {
const [isOpen, setIsOpen] = useMobileNavToggle();
return (
<>
<button
type="button"
className="group absolute right-0 top-0 flex h-14 items-center space-x-2 px-4 lg:hidden"
onClick={() => setIsOpen(!isOpen)}
>
<div className="font-medium text-text-light-secondary-500 dark:text-text-dark-secondary-500 group-hover:text-text-light-500 dark:group-hover:text-text-dark-500">
Menu
</div>
{isOpen ? (
<XMarkIcon className="block w-6" />
) : (
<Bars3Icon className="block w-6" />
)}
</button>
<div
className={clsx("overflow-y-auto lg:static lg:block", {
"fixed inset-x-0 bottom-0 top-14 bg-gray-900": isOpen,
hidden: !isOpen,
})}
>
{children}
</div>
</>
);
}

View File

@@ -71,9 +71,12 @@ export function PasswordForm({
if (response && "error" in response && response.error) {
setError(response.error);
return;
}
return response;
if (response && response.nextStep) {
return router.push(response.nextStep);
}
}
async function resetPasswordAndContinue() {

View File

@@ -11,6 +11,7 @@ import { create } from "@zitadel/client";
import { ChecksSchema } from "@zitadel/proto/zitadel/session/v2/session_service_pb";
import { PasswordComplexitySettings } from "@zitadel/proto/zitadel/settings/v2/password_settings_pb";
import { useTranslations } from "next-intl";
import { redirect } from "next/navigation";
import { useState } from "react";
import { FieldValues, useForm } from "react-hook-form";
import { Alert } from "./alert";
@@ -123,7 +124,14 @@ export function SetPasswordForm({
passwordResponse.error
) {
setError(passwordResponse.error);
return;
}
if (passwordResponse && passwordResponse.nextStep) {
return redirect(passwordResponse.nextStep);
}
return;
}
const { errors } = formState;

View File

@@ -124,23 +124,11 @@ export async function sendPassword(command: UpdateSessionCommand) {
}
}
const submitted = {
sessionId: session.id,
factors: session.factors,
challenges: session.challenges,
authMethods,
userState: user.state,
};
if (
!submitted ||
!submitted.authMethods ||
!submitted.factors?.user?.loginName
) {
if (!authMethods || !session.factors?.user?.loginName) {
return { error: "Could not verify password!" };
}
const availableSecondFactors = submitted?.authMethods?.filter(
const availableSecondFactors = authMethods?.filter(
(m: AuthenticationMethodType) =>
m !== AuthenticationMethodType.PASSWORD &&
m !== AuthenticationMethodType.PASSKEY,
@@ -148,15 +136,18 @@ export async function sendPassword(command: UpdateSessionCommand) {
if (availableSecondFactors?.length == 1) {
const params = new URLSearchParams({
loginName: submitted.factors?.user.loginName,
loginName: session.factors?.user.loginName,
});
if (command.authRequestId) {
params.append("authRequestId", command.authRequestId);
}
if (command.organization) {
params.append("organization", command.organization);
if (command.organization || session.factors?.user?.organizationId) {
params.append(
"organization",
command.organization ?? session.factors?.user?.organizationId,
);
}
const factor = availableSecondFactors[0];
@@ -172,35 +163,41 @@ export async function sendPassword(command: UpdateSessionCommand) {
}
} else if (availableSecondFactors?.length >= 1) {
const params = new URLSearchParams({
loginName: submitted.factors.user.loginName,
loginName: session.factors.user.loginName,
});
if (command.authRequestId) {
params.append("authRequestId", command.authRequestId);
}
if (command.organization) {
params.append("organization", command.organization);
if (command.organization || session.factors?.user?.organizationId) {
params.append(
"organization",
command.organization ?? session.factors?.user?.organizationId,
);
}
return redirect(`/mfa?` + params);
} else if (submitted.userState === UserState.INITIAL) {
} else if (user.state === UserState.INITIAL) {
const params = new URLSearchParams({
loginName: submitted.factors.user.loginName,
loginName: session.factors.user.loginName,
});
if (command.authRequestId) {
params.append("authRequestId", command.authRequestId);
}
if (command.organization) {
params.append("organization", command.organization);
if (command.organization || session.factors?.user?.organizationId) {
params.append(
"organization",
command.organization ?? session.factors?.user?.organizationId,
);
}
return redirect(`/password/change?` + params);
} else if (command.forceMfa && !availableSecondFactors.length) {
const params = new URLSearchParams({
loginName: submitted.factors.user.loginName,
loginName: session.factors.user.loginName,
force: "true", // this defines if the mfa is forced in the settings
checkAfter: "true", // this defines if the check is directly made after the setup
});
@@ -209,8 +206,11 @@ export async function sendPassword(command: UpdateSessionCommand) {
params.append("authRequestId", command.authRequestId);
}
if (command.organization) {
params.append("organization", command.organization);
if (command.organization || session.factors?.user?.organizationId) {
params.append(
"organization",
command.organization ?? session.factors?.user?.organizationId,
);
}
// TODO: provide a way to setup passkeys on mfa page?
@@ -239,33 +239,39 @@ export async function sendPassword(command: UpdateSessionCommand) {
// return router.push(`/passkey/set?` + params);
// }
else if (command.authRequestId && submitted.sessionId) {
else if (command.authRequestId && session.id) {
const params = new URLSearchParams({
sessionId: submitted.sessionId,
sessionId: session.id,
authRequest: command.authRequestId,
});
if (command.organization) {
params.append("organization", command.organization);
if (command.organization || session.factors?.user?.organizationId) {
params.append(
"organization",
command.organization ?? session.factors?.user?.organizationId,
);
}
return redirect(`/login?` + params);
return { nextStep: `/login?${params}` };
}
// without OIDC flow
const params = new URLSearchParams(
command.authRequestId
? {
loginName: submitted.factors.user.loginName,
loginName: session.factors.user.loginName,
authRequestId: command.authRequestId,
}
: {
loginName: submitted.factors.user.loginName,
loginName: session.factors.user.loginName,
},
);
if (command.organization) {
params.append("organization", command.organization);
if (command.organization || session.factors?.user?.organizationId) {
params.append(
"organization",
command.organization ?? session.factors?.user?.organizationId,
);
}
return redirect(`/signedin?` + params);

View File

@@ -7,7 +7,6 @@ import {
import { deleteSession, listAuthenticationMethodTypes } from "@/lib/zitadel";
import { RequestChallenges } from "@zitadel/proto/zitadel/session/v2/challenge_pb";
import { Checks } from "@zitadel/proto/zitadel/session/v2/session_service_pb";
import { headers } from "next/headers";
import {
getMostRecentSessionCookie,
getSessionCookieById,
@@ -68,7 +67,7 @@ export async function updateSession(options: UpdateSessionCommand) {
});
// TODO remove ports from host header for URL with port
const host = "localhost"
const host = "localhost";
if (
host &&

View File

@@ -7,7 +7,7 @@
"build": "turbo run build",
"test": "turbo run test",
"start": "turbo run start",
"start:built": "turbo run start:built",
"start:built": "turbo run start:built",
"test:unit": "turbo run test:unit -- --passWithNoTests",
"test:integration": "turbo run test:integration",
"test:acceptance": "pnpm exec playwright test",
@@ -34,6 +34,8 @@
"@types/node": "^22.9.0",
"@vitejs/plugin-react": "^4.3.3",
"@zitadel/prettier-config": "workspace:*",
"axios": "^1.7.7",
"dotenv": "^16.4.5",
"eslint": "8.57.1",
"eslint-config-zitadel": "workspace:*",
"prettier": "^3.2.5",

View File

@@ -1,4 +1,4 @@
import {defineConfig, devices} from "@playwright/test";
import { defineConfig, devices } from "@playwright/test";
/**
* Read environment variables from file.
@@ -12,33 +12,33 @@ import {defineConfig, devices} from "@playwright/test";
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
testDir: "./acceptance/tests",
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: "html",
/* 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://localhost:3000",
testDir: "./acceptance/tests",
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: "html",
/* 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://localhost:3000",
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: "on-first-retry",
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: "on-first-retry",
},
/* Configure projects for major browsers */
projects: [
{
name: "chromium",
use: { ...devices["Desktop Chrome"] },
},
/* Configure projects for major browsers */
projects: [
{
name: "chromium",
use: {...devices["Desktop Chrome"]},
},
/*
/*
{
name: "firefox",
use: { ...devices["Desktop Firefox"] },
@@ -50,32 +50,32 @@ export default defineConfig({
},
*/
/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },
/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },
/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
// },
],
/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
// },
],
/* Run local dev server before starting the tests */
webServer: {
command: "pnpm start:built",
url: "http://127.0.0.1:3000",
reuseExistingServer: !process.env.CI,
timeout: 5 * 60_000,
},
/* Run local dev server before starting the tests */
webServer: {
command: "pnpm start:built",
url: "http://127.0.0.1:3000",
reuseExistingServer: !process.env.CI,
timeout: 5 * 60_000,
},
});

56
pnpm-lock.yaml generated
View File

@@ -26,6 +26,12 @@ importers:
'@zitadel/prettier-config':
specifier: workspace:*
version: link:packages/zitadel-prettier-config
axios:
specifier: ^1.7.7
version: 1.7.7
dotenv:
specifier: ^16.4.5
version: 16.4.5
eslint:
specifier: 8.57.1
version: 8.57.1
@@ -2071,6 +2077,10 @@ packages:
resolution: {integrity: sha512-7GO6HghkA5fYG9TYnNxi14/7K9f5occMlp3zXAuSxn7CKCxt9xbNWG7yF8hTCSUchlfWSe3uLmlPfigevRItzQ==}
engines: {node: '>=12'}
dotenv@16.4.5:
resolution: {integrity: sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==}
engines: {node: '>=12'}
dprint-node@1.0.8:
resolution: {integrity: sha512-iVKnUtYfGrYcW1ZAlfR/F59cUVL8QIhWoBJoSjkkdua/dkWIgjZfiLMeTjiB06X0ZLkQ0M2C1VbUj/CxkIf1zg==}
@@ -4623,7 +4633,7 @@ snapshots:
'@babel/traverse': 7.25.9
'@babel/types': 7.26.0
convert-source-map: 2.0.0
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
gensync: 1.0.0-beta.2
json5: 2.2.3
semver: 6.3.1
@@ -4710,7 +4720,7 @@ snapshots:
'@babel/parser': 7.26.2
'@babel/template': 7.25.9
'@babel/types': 7.26.0
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
globals: 11.12.0
transitivePeerDependencies:
- supports-color
@@ -5100,7 +5110,7 @@ snapshots:
'@eslint/eslintrc@2.1.4':
dependencies:
ajv: 6.12.6
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
espree: 9.6.1
globals: 13.24.0
ignore: 5.3.2
@@ -5199,7 +5209,7 @@ snapshots:
'@humanwhocodes/config-array@0.13.0':
dependencies:
'@humanwhocodes/object-schema': 2.0.3
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
minimatch: 3.1.2
transitivePeerDependencies:
- supports-color
@@ -5746,7 +5756,7 @@ snapshots:
agent-base@7.1.1:
dependencies:
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
transitivePeerDependencies:
- supports-color
@@ -5921,6 +5931,14 @@ snapshots:
axe-core@4.10.0: {}
axios@1.7.7:
dependencies:
follow-redirects: 1.15.6
form-data: 4.0.0
proxy-from-env: 1.1.0
transitivePeerDependencies:
- debug
axios@1.7.7(debug@4.3.7):
dependencies:
follow-redirects: 1.15.6(debug@4.3.7)
@@ -6267,6 +6285,10 @@ snapshots:
dependencies:
ms: 2.1.2
debug@4.3.7:
dependencies:
ms: 2.1.3
debug@4.3.7(supports-color@5.5.0):
dependencies:
ms: 2.1.3
@@ -6368,6 +6390,8 @@ snapshots:
dotenv@16.0.3: {}
dotenv@16.4.5: {}
dprint-node@1.0.8:
dependencies:
detect-libc: 1.0.3
@@ -6619,7 +6643,7 @@ snapshots:
debug: 4.3.7(supports-color@5.5.0)
enhanced-resolve: 5.17.1
eslint: 8.57.1
eslint-module-utils: 2.8.2(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1))(eslint@8.57.1)
eslint-module-utils: 2.8.2(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1)
fast-glob: 3.3.2
get-tsconfig: 4.8.0
is-bun-module: 1.1.0
@@ -6632,7 +6656,7 @@ snapshots:
- eslint-import-resolver-webpack
- supports-color
eslint-module-utils@2.8.2(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1))(eslint@8.57.1):
eslint-module-utils@2.8.2(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1):
dependencies:
debug: 3.2.7(supports-color@8.1.1)
optionalDependencies:
@@ -6653,7 +6677,7 @@ snapshots:
doctrine: 2.1.0
eslint: 8.57.1
eslint-import-resolver-node: 0.3.9
eslint-module-utils: 2.8.2(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1))(eslint@8.57.1)
eslint-module-utils: 2.8.2(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@8.57.1)
hasown: 2.0.2
is-core-module: 2.15.1
is-glob: 4.0.3
@@ -6741,7 +6765,7 @@ snapshots:
ajv: 6.12.6
chalk: 4.1.2
cross-spawn: 7.0.3
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
doctrine: 3.0.0
escape-string-regexp: 4.0.0
eslint-scope: 7.2.2
@@ -6931,6 +6955,8 @@ snapshots:
flatted@3.3.1: {}
follow-redirects@1.15.6: {}
follow-redirects@1.15.6(debug@4.3.7):
optionalDependencies:
debug: 4.3.7(supports-color@5.5.0)
@@ -7165,7 +7191,7 @@ snapshots:
http-proxy-agent@7.0.2:
dependencies:
agent-base: 7.1.1
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
transitivePeerDependencies:
- supports-color
@@ -7185,7 +7211,7 @@ snapshots:
https-proxy-agent@7.0.5:
dependencies:
agent-base: 7.1.1
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
transitivePeerDependencies:
- supports-color
@@ -8709,7 +8735,7 @@ snapshots:
cac: 6.7.14
chokidar: 4.0.1
consola: 3.2.3
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
esbuild: 0.24.0
joycon: 3.1.1
picocolors: 1.1.1
@@ -8867,7 +8893,7 @@ snapshots:
vite-node@2.1.4(@types/node@22.9.0)(sass@1.80.7):
dependencies:
cac: 6.7.14
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
pathe: 1.1.2
vite: 5.4.11(@types/node@22.9.0)(sass@1.80.7)
transitivePeerDependencies:
@@ -8883,7 +8909,7 @@ snapshots:
vite-tsconfig-paths@5.1.2(typescript@5.6.3)(vite@5.4.11(@types/node@22.9.0)(sass@1.80.7)):
dependencies:
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
globrex: 0.1.2
tsconfck: 3.1.4(typescript@5.6.3)
optionalDependencies:
@@ -8912,7 +8938,7 @@ snapshots:
'@vitest/spy': 2.1.4
'@vitest/utils': 2.1.4
chai: 5.1.2
debug: 4.3.7(supports-color@5.5.0)
debug: 4.3.7
expect-type: 1.1.0
magic-string: 0.30.12
pathe: 1.1.2