Compare commits

..

21 Commits

Author SHA1 Message Date
MechaCat02
b459b99fe9 test(e2e): role-shadowing specs in apps + scripts suites
Lifts loginAsUserToken + pageWithUserToken out of members.spec.ts into
fixtures/role-page.ts (third file that needs them). Adds shadowing
coverage: viewer member sees no New-app / Add-domain / Settings / Save
/ +Add-route, editor sees Save but no Delete header, and CodeMirror
renders contenteditable=false for viewers.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:40:09 +02:00
MechaCat02
f694a6d504 test(e2e): orphan sweep at globalSetup
Wipes e2e-* apps and e2e* admin users before the suite starts so a
prior crashed run doesn't accumulate state across runs (45 rows
observed on 2026-05-28). Per-row try/catch keeps it best-effort; a
sweep failure never blocks the suite.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:37:57 +02:00
MechaCat02
70b66451d6 fix(dashboard): rejection-sample password-gen to remove modulo bias
Switches to Uint8 rejection sampling against the largest multiple of
the charset length that fits in a byte. Eliminates the ~16 ppm
overweight the previous `% N` over Uint32 would otherwise leave on the
first 38 chars. Adds a vitest distribution check.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:37:18 +02:00
MechaCat02
c4fa53052d feat(dashboard): confirm modal for user deactivate
Deactivation signs the user out and expires every API key they hold —
warrants a styled confirm. Reactivation stays one-click since it's
non-destructive.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:36:17 +02:00
MechaCat02
2f6840fe3e feat(dashboard): confirm modal for script delete
Replaces window.confirm + alert() with the in-dashboard ConfirmModal
(danger variant, name-retype). Body summarises what gets removed
(routes + execution logs) and embeds the API error inline rather than
firing a native alert.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:35:14 +02:00
MechaCat02
75c815d02a feat(dashboard): shadow script-detail surfaces by role
Captures my_role off the existing parent-app fetch (no extra HTTP call)
and uses canWriteApp / canAdminApp to hide: header Delete, Edit Save +
Format, Routing +Add route + per-row remove, and the Settings tab.
CodeEditor renders read-only for viewers. An effect bounces a stale
Settings tab back to Edit for non-admins.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:33:48 +02:00
MechaCat02
d9c3d4d661 feat(dashboard): shadow apps + app-detail surfaces by role
Apps list: hide "New app" for members. App detail: hide New script for
viewers, Add domain + per-row Delete for non-admins, and the Members +
Settings tabs entirely for non-admins (with an effect that bounces a
stale activeTab back to Scripts).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:31:56 +02:00
MechaCat02
bef4d34c43 feat(dashboard): CodeEditor readOnly prop
Threads readOnly through to EditorState.readOnly + EditorView.editable so
script-detail can render a viewer-only editor without intercepting
keystrokes upstream.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:29:55 +02:00
MechaCat02
99a3ed1b6b feat(dashboard): capabilities helper for role-aware UI shadowing
Pure-function module that mirrors crates/manager-core/src/authz.rs and
lets dashboard pages decide which create / edit / delete affordances to
render. Widens the vitest include so the truth-table test runs.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:28:45 +02:00
MechaCat02
4644ea4919 feat(manager-core): admin is implicit app_admin; delete-script needs AppAdmin
Aligns the canonical capability rules with how the dashboard now shadows
its UI. Instance admins become implicit app_admin on every app (only
InstanceManageSettings stays owner-only), and the script-delete handler
moves from AppWriteScript to AppAdmin so editors can save but not delete.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 19:27:32 +02:00
MechaCat02
ec3c768262 test(dashboard): add full-stack integration specs
Two scenarios that span the dashboard UI and the data/control plane
end-to-end:

- App + domain claim + script + route all created via the dashboard,
  then the script is invoked through the public URL with the
  matching Host header. Verifies the dashboard actions actually
  reach the orchestrator's route trie.
- API key minted via the dashboard, then used as a bearer token
  against /api/v1/admin/* (the CLI surface). Confirms the scope is
  enforced (script:read passes /scripts, 403s /admins) and that
  revoking via the dashboard immediately invalidates the token.

Also: the B7 copy-token test selected the mint-form Name input via
getByLabel('Name'), which became ambiguous once the integration
test created an app and the Binding dropdown was no longer empty.
Switched both B7 mint flows to placeholder-based selectors.

Suite: 57/57 passing in ~18s.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:56:24 +02:00
MechaCat02
3e72ddde78 test(dashboard): stabilize the e2e suite under parallel runs
Three issues found while running the full B1–B8 suite together:

- The B1 logout test was driving the shared admin storageState
  token, invalidating it for every subsequent test. Switched it to
  a fresh login so its session is disposable.
- Bumped navigationTimeout to 30s and capped local workers at 4 to
  cope with the Vite dev server's first-compile cost under
  parallel load. Local also gets one retry to absorb intermittent
  warmup flakiness.
- Cleared a few lint warnings (unused appId / _adminPage vars) and
  belt-and-braces gitignore for playwright artifacts written to
  the repo root when the CLI is invoked from there by accident.

Suite now: 55/55 passing in ~21s.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:44:07 +02:00
MechaCat02
cd20ffb580 test(dashboard): add e2e cross-cutting security spec (B8)
Five tests covering platform-wide guarantees: expired-token
redirect, HttpOnly session cookie, bootstrap password not leaked
into the DOM after login, missing-app slug fails gracefully, and
an XSS-sink probe across the main authed routes.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:43:51 +02:00
MechaCat02
cddd479fd2 test(dashboard): add e2e profile + API keys spec (B7)
Six tests covering /admin/profile: mint instance-wide key with the
reveal/ack flow, the app-binding mutual-exclusion guard (instance
scopes auto-disabled), revoke via the ConfirmModal, the
?denied=users banner, plus adversarial cases (empty-name button
disabled, copy-token writes the full token to the clipboard).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:31:58 +02:00
MechaCat02
8bbcdd86aa test(dashboard): add e2e instance users spec (B6)
Eight tests covering the Users admin page: invite happy path (form
→ reveal modal → ack-gated dismiss → row in table), live username
validation, search filter, deactivate/reactivate, delete with phrase
modal, member-role redirect to /profile?denied=users, plus
adversarial inputs (too-short username, script-tag email).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:28:04 +02:00
MechaCat02
2d56e42699 test(dashboard): add e2e app members spec (B5)
Four tests covering the Members tab: invite + remove (action-menu +
phrase modal), role change, the non-app-admin viewer who never sees
the Members tab at all (cross-context via a second admin login),
and an adversarial that the role dropdown only exposes the
documented set of values.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:23:01 +02:00
MechaCat02
f9d9ed8cb4 test(dashboard): add e2e routing spec (B4)
Seven tests covering the Routing tab inside the script editor: add
+ list + remove (handling the window.confirm dialog), match-preview
round trip, path-kind mismatch warning, unclaimed-host warning,
duplicate-route 409, plus reserved-prefix rejection and a path-XSS
adversarial that checks no script tag escapes into the route list.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:18:01 +02:00
MechaCat02
c17f8a5bd9 test(dashboard): add e2e script CRUD + editor spec (B3)
Seven tests covering script creation via the Scripts tab, the source
editor (CodeMirror typing + save + reload), Format-button error
surfaces for both Rhai and the test-invoke JSON body, the test-invoke
happy path, settings input validation, and an infinite-loop adversarial
that asserts the sandbox timeout reports cleanly and the editor stays
interactive.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:14:09 +02:00
MechaCat02
7198fb4d0e test(dashboard): add e2e apps lifecycle spec (B2)
Seven tests covering app CRUD via the dashboard: create with
slug auto-derive, settings rename, delete with phrase-confirmation
modal, historical-slug takeover via the create form, plus adversarial
inputs (slug normalization, XSS in name/description, oversized name).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:10:47 +02:00
MechaCat02
029a4a199f test(dashboard): add e2e auth & navigation spec (B1)
Eight tests covering the login form, layout-level redirects, logout,
and the obvious adversarial inputs (XSS in username, empty submit,
password field type, leaked tokens). All targeted at /admin/login and
the bounce-back behaviors implemented in +layout.svelte.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:06:13 +02:00
MechaCat02
74f7b3b631 test(dashboard): add Playwright e2e scaffolding with smoke spec
Milestone A of the frontend test plan. Sets up the test rig — config,
globalSetup that probes the backend and seeds an admin session into
storageState, lightweight fixtures, and a 3-test smoke spec — without
yet covering any user journeys (those land in Milestone B).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 07:03:44 +02:00
37 changed files with 2896 additions and 205 deletions

11
.gitignore vendored
View File

@@ -30,6 +30,17 @@ config.local.toml
/dashboard/build
/dashboard/.env
# Dashboard — Playwright E2E
/dashboard/tests/e2e/.auth
/dashboard/tests/e2e/.results
/dashboard/playwright-report
/dashboard/test-results
/dashboard/.playwright
# When playwright is invoked from the repo root by accident, these
# also land here.
/playwright-report
/test-results
# Caddy
/caddy/data
/caddy/config

View File

@@ -270,10 +270,13 @@ async fn delete_script<R: ScriptRepository, L: ExecutionLogRepository>(
Path(id): Path<ScriptId>,
) -> Result<StatusCode, ApiError> {
let script = state.repo.get(id).await?.ok_or(ApiError::NotFound(id))?;
// Delete is gated tighter than Save: editors can edit scripts but
// only app_admin / instance admin / owner can remove them. See
// blueprint §11.6.
require(
state.authz.as_ref(),
&principal,
Capability::AppWriteScript(script.app_id),
Capability::AppAdmin(script.app_id),
)
.await?;
state.repo.delete(id).await?;

View File

@@ -143,8 +143,8 @@ pub struct AppLookupResponse {
pub redirect_to: Option<String>,
/// The caller's role on this app, used by the dashboard to decide
/// whether to render admin-only surfaces (Members tab, settings).
/// `Owner` maps to `app_admin`, `Admin` to `editor` (both implicit
/// per blueprint §11.6); `Member` carries its explicit
/// `Owner` and `Admin` both map to `app_admin` (implicit per
/// blueprint §11.6); `Member` carries its explicit
/// `app_members.role`.
pub my_role: Option<AppRole>,
}
@@ -226,16 +226,15 @@ async fn get_app(
/// Compute the caller's effective `AppRole` on a specific app. Mirrors
/// the implicit-grant logic in `authz::role_grants` but returns the
/// role itself (for UI gating) rather than a yes/no decision. `Owner`
/// is implicit `AppAdmin` everywhere; `Admin` is implicit `Editor`
/// everywhere; `Member` consults `app_members`.
/// and `Admin` are both implicit `AppAdmin` everywhere; `Member`
/// consults `app_members`.
async fn compute_my_role(
authz: &dyn AuthzRepo,
principal: &Principal,
app_id: AppId,
) -> Result<Option<AppRole>, AppsApiError> {
match principal.instance_role {
InstanceRole::Owner => Ok(Some(AppRole::AppAdmin)),
InstanceRole::Admin => Ok(Some(AppRole::Editor)),
InstanceRole::Owner | InstanceRole::Admin => Ok(Some(AppRole::AppAdmin)),
InstanceRole::Member => Ok(authz.membership(principal.user_id, app_id).await?),
}
}

View File

@@ -199,21 +199,14 @@ async fn role_grants(
}
}
/// Admin is implicit `editor` on every app (per blueprint §11.6). They
/// can create apps and manage users, but NOT touch instance-wide
/// settings or take app-admin-only actions on apps they're not
/// explicitly app_admin of. Everything not in this set falls through
/// to deny (`InstanceManageSettings`, `AppManageDomains`, `AppAdmin`).
/// Admin is implicit `app_admin` on every app (per blueprint §11.6).
/// They can create apps, manage users, and take any app-scoped action
/// on any app without an explicit `app_members` row — single-human
/// installs would otherwise need to add themselves to every new app.
/// Only `InstanceManageSettings` (sandbox ceiling, etc.) stays
/// owner-only.
const fn admin_grants(cap: Capability) -> bool {
matches!(
cap,
Capability::InstanceCreateApp
| Capability::InstanceManageUsers
| Capability::AppRead(_)
| Capability::AppWriteScript(_)
| Capability::AppWriteRoute(_)
| Capability::AppLogRead(_)
)
!matches!(cap, Capability::InstanceManageSettings)
}
/// Member has zero instance authority. App authority requires an
@@ -357,10 +350,23 @@ mod tests {
}
#[tokio::test]
async fn admin_cannot_manage_instance_settings_or_app_admin_actions() {
async fn admin_cannot_manage_instance_settings() {
let repo = InMemoryAuthzRepo::default();
let p = principal(InstanceRole::Admin);
assert_eq!(
can(&repo, &p, Capability::InstanceManageSettings)
.await
.unwrap(),
Decision::Deny,
);
}
#[tokio::test]
async fn admin_is_implicit_app_admin_on_every_app() {
let repo = InMemoryAuthzRepo::default();
let p = principal(InstanceRole::Admin);
let app = AppId::new();
// Instance-scoped allowances.
assert_eq!(
can(&repo, &p, Capability::InstanceCreateApp).await.unwrap(),
Decision::Allow,
@@ -371,36 +377,22 @@ mod tests {
.unwrap(),
Decision::Allow,
);
assert_eq!(
can(&repo, &p, Capability::InstanceManageSettings)
.await
.unwrap(),
Decision::Deny,
);
// Editor-like grants succeed
assert_eq!(
can(&repo, &p, Capability::AppWriteScript(app))
.await
.unwrap(),
Decision::Allow,
);
assert_eq!(
can(&repo, &p, Capability::AppWriteRoute(app))
.await
.unwrap(),
Decision::Allow,
);
// App-admin grants do not
assert_eq!(
can(&repo, &p, Capability::AppManageDomains(app))
.await
.unwrap(),
Decision::Deny,
);
assert_eq!(
can(&repo, &p, Capability::AppAdmin(app)).await.unwrap(),
Decision::Deny,
);
// Editor-like + app-admin grants both succeed without any
// app_members row.
for cap in [
Capability::AppRead(app),
Capability::AppWriteScript(app),
Capability::AppWriteRoute(app),
Capability::AppLogRead(app),
Capability::AppManageDomains(app),
Capability::AppAdmin(app),
] {
assert_eq!(
can(&repo, &p, cap).await.unwrap(),
Decision::Allow,
"admin denied app-scoped capability {cap:?}"
);
}
}
#[tokio::test]
@@ -474,6 +466,29 @@ mod tests {
);
}
/// Editors hold `AppWriteScript` (Save) but **not** `AppAdmin`
/// (Delete). The script-delete handler gates on the latter so the
/// API can't be tricked into letting an editor remove the script
/// they were only allowed to edit.
#[tokio::test]
async fn editor_can_write_scripts_but_not_delete_them() {
let repo = InMemoryAuthzRepo::default();
let p = principal(InstanceRole::Member);
let app = AppId::new();
repo.grant(p.user_id, app, AppRole::Editor).await;
assert!(can(&repo, &p, Capability::AppWriteScript(app))
.await
.unwrap()
.is_allow());
// Delete is gated on AppAdmin in the handler — editors must be
// denied here for that gate to bite.
assert_eq!(
can(&repo, &p, Capability::AppAdmin(app)).await.unwrap(),
Decision::Deny,
);
}
#[tokio::test]
async fn member_with_app_admin_role_can_do_app_admin_actions() {
let repo = InMemoryAuthzRepo::default();

View File

@@ -293,7 +293,7 @@ async fn owner_access_matrix(pool: PgPool) {
#[ignore = "needs DATABASE_URL pointing at a running Postgres"]
#[sqlx::test(migrations = "../manager-core/migrations")]
async fn admin_can_manage_users_but_not_app_admin_settings(pool: PgPool) {
async fn admin_is_implicit_app_admin_on_every_app(pool: PgPool) {
let s = boot(pool.clone()).await;
seed_user(&s.pool, "alice", "alice-pw", InstanceRole::Admin).await;
let token = login_token(&s.server, "alice", "alice-pw").await;
@@ -305,24 +305,32 @@ async fn admin_can_manage_users_but_not_app_admin_settings(pool: PgPool) {
.await
.assert_status_ok();
// Allowed: read default app (admin is implicit editor everywhere).
// Allowed: read default app admin is implicit app_admin
// everywhere (per blueprint §11.6).
s.server
.get("/api/v1/admin/apps/default")
.add_header("authorization", format!("Bearer {token}"))
.await
.assert_status_ok();
// Allowed: write scripts (implicit editor).
// Allowed: write scripts.
let script = create_script_via_api(&s.server, &token, s.default_app, "admin-write").await;
assert!(script["id"].is_string());
// Denied: delete the default app (AppAdmin only).
let denied = s
.server
// Allowed: list app members (AppAdmin gate). Pre-3.5.x this
// 403'd; now it's the same allow as the owner sees.
s.server
.get("/api/v1/admin/apps/default/members")
.add_header("authorization", format!("Bearer {token}"))
.await
.assert_status_ok();
// Allowed: delete the default app (AppAdmin).
s.server
.delete("/api/v1/admin/apps/default")
.add_header("authorization", format!("Bearer {token}"))
.await;
assert_eq!(denied.status_code(), axum::http::StatusCode::FORBIDDEN);
.await
.assert_status(axum::http::StatusCode::NO_CONTENT);
}
#[ignore = "needs DATABASE_URL pointing at a running Postgres"]
@@ -735,7 +743,7 @@ async fn my_role_field_matches_caller_role(pool: PgPool) {
"owner reports app_admin"
);
// Admin → implicit editor everywhere.
// Admin → implicit app_admin everywhere (post-§11.6 update).
seed_user(&s.pool, "alice", "alice-pw", InstanceRole::Admin).await;
let admin_token = login_token(&s.server, "alice", "alice-pw").await;
let r = s
@@ -746,8 +754,8 @@ async fn my_role_field_matches_caller_role(pool: PgPool) {
r.assert_status_ok();
assert_eq!(
r.json::<Value>()["my_role"].as_str(),
Some("editor"),
"admin reports editor"
Some("app_admin"),
"admin reports app_admin"
);
// Member with explicit `viewer` membership → viewer.

View File

@@ -2,3 +2,9 @@
build
node_modules
package-lock.json
# Playwright generated artifacts
playwright-report
test-results
tests/e2e/.auth
tests/e2e/.results

View File

@@ -20,6 +20,7 @@
},
"devDependencies": {
"@eslint/js": "^9.18.0",
"@playwright/test": "^1.60.0",
"@sveltejs/adapter-static": "^3.0.8",
"@sveltejs/kit": "^2.17.0",
"@sveltejs/vite-plugin-svelte": "^5.0.3",
@@ -885,6 +886,22 @@
"integrity": "sha512-l0h88YhZFyKdXIFNfSWpyjStDjGHwZ/U7iobcK1cQQD8sejsONdQtTVU+1wVN1PBw40PiiHB1vA5S7VTfQiP9g==",
"license": "MIT"
},
"node_modules/@playwright/test": {
"version": "1.60.0",
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.60.0.tgz",
"integrity": "sha512-O71yZIbAh/PxDMNGns37GHBIfrVkEVyn+AXyIa5dOTfb4/xNvRWV+Vv/NMbNCtODB/pO7vLlF2OTmMVLhmr7Ag==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
"playwright": "1.60.0"
},
"bin": {
"playwright": "cli.js"
},
"engines": {
"node": ">=18"
}
},
"node_modules/@polka/url": {
"version": "1.0.0-next.29",
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.29.tgz",
@@ -3010,6 +3027,53 @@
"url": "https://github.com/sponsors/jonschlinkert"
}
},
"node_modules/playwright": {
"version": "1.60.0",
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.60.0.tgz",
"integrity": "sha512-hheHdokM8cdqCb0lcE3s+zT4t4W+vvjpGxsZlDnikarzx8tSzMebh3UiFtgqwFwnTnjYQcsyMF8ei2mCO/tpeA==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
"playwright-core": "1.60.0"
},
"bin": {
"playwright": "cli.js"
},
"engines": {
"node": ">=18"
},
"optionalDependencies": {
"fsevents": "2.3.2"
}
},
"node_modules/playwright-core": {
"version": "1.60.0",
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.60.0.tgz",
"integrity": "sha512-9bW6zvX/m0lEbgTKJ6YppOKx8H3VOPBMOCFh2irXFOT4BbHgrx5hPjwJYLT40Lu+4qtD36qKc/Hn56StUW57IA==",
"dev": true,
"license": "Apache-2.0",
"bin": {
"playwright-core": "cli.js"
},
"engines": {
"node": ">=18"
}
},
"node_modules/playwright/node_modules/fsevents": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
"dev": true,
"hasInstallScript": true,
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
}
},
"node_modules/postcss": {
"version": "8.5.15",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.15.tgz",

View File

@@ -1,49 +1,53 @@
{
"name": "picloud-dashboard",
"version": "0.6.0",
"private": true,
"type": "module",
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"format": "prettier --write .",
"lint": "prettier --check . && eslint .",
"test": "vitest run"
},
"devDependencies": {
"@eslint/js": "^9.18.0",
"@sveltejs/adapter-static": "^3.0.8",
"@sveltejs/kit": "^2.17.0",
"@sveltejs/vite-plugin-svelte": "^5.0.3",
"@types/node": "^22.10.5",
"eslint": "^9.18.0",
"eslint-config-prettier": "^10.0.1",
"eslint-plugin-svelte": "^3.0.0",
"globals": "^15.14.0",
"prettier": "^3.4.2",
"prettier-plugin-svelte": "^3.3.3",
"svelte": "^5.19.0",
"svelte-check": "^4.1.4",
"typescript": "^5.7.3",
"typescript-eslint": "^8.20.0",
"vite": "^6.0.7",
"vitest": "^3.0.5"
},
"overrides": {
"cookie": "^0.7.2"
},
"dependencies": {
"@codemirror/autocomplete": "^6.20.2",
"@codemirror/commands": "^6.10.3",
"@codemirror/lang-json": "^6.0.2",
"@codemirror/language": "^6.12.3",
"@codemirror/search": "^6.7.0",
"@codemirror/state": "^6.6.0",
"@codemirror/view": "^6.43.0",
"@lezer/highlight": "^1.2.3",
"codemirror": "^6.0.2"
}
"name": "picloud-dashboard",
"version": "0.6.0",
"private": true,
"type": "module",
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"format": "prettier --write .",
"lint": "prettier --check . && eslint .",
"test": "vitest run",
"test:e2e": "playwright test",
"test:e2e:ui": "playwright test --ui",
"test:e2e:install": "playwright install --with-deps chromium"
},
"devDependencies": {
"@eslint/js": "^9.18.0",
"@playwright/test": "^1.60.0",
"@sveltejs/adapter-static": "^3.0.8",
"@sveltejs/kit": "^2.17.0",
"@sveltejs/vite-plugin-svelte": "^5.0.3",
"@types/node": "^22.10.5",
"eslint": "^9.18.0",
"eslint-config-prettier": "^10.0.1",
"eslint-plugin-svelte": "^3.0.0",
"globals": "^15.14.0",
"prettier": "^3.4.2",
"prettier-plugin-svelte": "^3.3.3",
"svelte": "^5.19.0",
"svelte-check": "^4.1.4",
"typescript": "^5.7.3",
"typescript-eslint": "^8.20.0",
"vite": "^6.0.7",
"vitest": "^3.0.5"
},
"overrides": {
"cookie": "^0.7.2"
},
"dependencies": {
"@codemirror/autocomplete": "^6.20.2",
"@codemirror/commands": "^6.10.3",
"@codemirror/lang-json": "^6.0.2",
"@codemirror/language": "^6.12.3",
"@codemirror/search": "^6.7.0",
"@codemirror/state": "^6.6.0",
"@codemirror/view": "^6.43.0",
"@lezer/highlight": "^1.2.3",
"codemirror": "^6.0.2"
}
}

View File

@@ -0,0 +1,51 @@
import { defineConfig, devices } from '@playwright/test';
import { fileURLToPath } from 'node:url';
import path from 'node:path';
const __dirname = path.dirname(fileURLToPath(import.meta.url));
const DASHBOARD_PORT = Number(process.env.PICLOUD_DASHBOARD_PORT ?? 5173);
// baseURL is the origin only — the SvelteKit dashboard is mounted at
// `/admin` (svelte.config.js paths.base), so tests use full paths like
// `/admin/login` rather than relying on baseURL path resolution.
const DASHBOARD_BASE = process.env.E2E_BASE_URL ?? `http://localhost:${DASHBOARD_PORT}`;
export default defineConfig({
testDir: './tests/e2e',
outputDir: './tests/e2e/.results',
fullyParallel: true,
forbidOnly: !!process.env.CI,
// Local: 1 retry to absorb dev-server warmup flakiness. CI: 2.
retries: process.env.CI ? 2 : 1,
// Cap at 4 workers locally to keep the shared Vite dev server
// from getting stampeded during cold-start compiles.
workers: process.env.CI ? 2 : 4,
reporter: process.env.CI ? [['html'], ['github']] : 'html',
globalSetup: './tests/e2e/global-setup.ts',
expect: { timeout: 5_000 },
use: {
baseURL: DASHBOARD_BASE,
actionTimeout: 10_000,
navigationTimeout: 30_000,
trace: 'on-first-retry',
screenshot: 'only-on-failure',
video: 'retain-on-failure'
},
projects: [
{
name: 'chromium',
use: {
...devices['Desktop Chrome'],
storageState: path.join(__dirname, 'tests/e2e/.auth/admin.json')
}
}
],
webServer: {
command: 'npm run dev',
url: `http://localhost:${DASHBOARD_PORT}/admin/`,
reuseExistingServer: !process.env.CI,
stdout: 'pipe',
stderr: 'pipe',
timeout: 60_000
}
});

View File

@@ -25,12 +25,18 @@
value = $bindable(''),
language = 'rhai' as Language,
placeholder = '',
minHeight = '12rem'
minHeight = '12rem',
readOnly = false
}: {
value?: string;
language?: Language;
placeholder?: string;
minHeight?: string;
/** When true the editor renders without a cursor and rejects
* keystrokes. Parent-driven `value` changes still apply via
* the dispatch path below — this only blocks user edits.
* Not reactive after mount; re-mount via `{#key}` if needed. */
readOnly?: boolean;
} = $props();
let host: HTMLDivElement | null = null;
@@ -48,6 +54,12 @@
keymap.of([indentWithTab]),
dashboardSyntaxHighlighting,
dashboardTheme,
// readOnly + editable together: readOnly blocks the
// underlying transactions, editable suppresses the caret
// + selection visuals so the user can see it's not
// editable.
EditorState.readOnly.of(readOnly),
EditorView.editable.of(!readOnly),
EditorView.updateListener.of((update) => {
if (update.docChanged && !pushingFromOutside) {
value = update.state.doc.toString();

View File

@@ -0,0 +1,60 @@
import { describe, it, expect } from 'vitest';
import type { AppRole, MeDto } from './api';
import { canAdminApp, canCreateApp, canManageUsers, canWriteApp } from './capabilities';
function me(role: MeDto['instance_role']): MeDto {
return { id: 'u', username: 'u', instance_role: role, email: null };
}
const ROLES: MeDto['instance_role'][] = ['owner', 'admin', 'member'];
const APP_ROLES: (AppRole | null)[] = ['app_admin', 'editor', 'viewer', null];
describe('capabilities', () => {
it('null caller is denied everything', () => {
expect(canCreateApp(null)).toBe(false);
expect(canManageUsers(null)).toBe(false);
expect(canWriteApp(null, 'app_admin')).toBe(false);
expect(canAdminApp(null, 'app_admin')).toBe(false);
});
it('canCreateApp + canManageUsers: owner/admin yes, member no', () => {
expect(canCreateApp(me('owner'))).toBe(true);
expect(canCreateApp(me('admin'))).toBe(true);
expect(canCreateApp(me('member'))).toBe(false);
expect(canManageUsers(me('owner'))).toBe(true);
expect(canManageUsers(me('admin'))).toBe(true);
expect(canManageUsers(me('member'))).toBe(false);
});
it('owner + admin can write and admin every app regardless of my_role', () => {
for (const role of ['owner', 'admin'] as const) {
for (const appRole of APP_ROLES) {
expect(canWriteApp(me(role), appRole)).toBe(true);
expect(canAdminApp(me(role), appRole)).toBe(true);
}
}
});
it('member: write requires app_admin or editor; admin requires app_admin', () => {
const m = me('member');
expect(canWriteApp(m, 'app_admin')).toBe(true);
expect(canWriteApp(m, 'editor')).toBe(true);
expect(canWriteApp(m, 'viewer')).toBe(false);
expect(canWriteApp(m, null)).toBe(false);
expect(canAdminApp(m, 'app_admin')).toBe(true);
expect(canAdminApp(m, 'editor')).toBe(false);
expect(canAdminApp(m, 'viewer')).toBe(false);
expect(canAdminApp(m, null)).toBe(false);
});
it('canAdminApp implies canWriteApp for every combination', () => {
for (const role of ROLES) {
for (const appRole of APP_ROLES) {
if (canAdminApp(me(role), appRole)) {
expect(canWriteApp(me(role), appRole)).toBe(true);
}
}
}
});
});

View File

@@ -0,0 +1,43 @@
// Permission predicates the dashboard uses to shadow create / edit /
// delete affordances. Mirrors the canonical role → capability rules in
// crates/manager-core/src/authz.rs:
//
// owner / admin instance role → implicit app_admin on every app
// app_admin → settings, domain claims, delete app, delete scripts
// editor → CRUD on scripts, routes, sandbox config (no script delete)
// viewer → read scripts + execution logs
// member with no membership → no access
//
// These helpers are read-only and have no Svelte runes — callers pass
// the current `MeDto` and (when relevant) the per-app `my_role` they
// already hold. Hiding here never authorizes anything; the backend's
// `require(Capability::…)` is always the ground truth.
import type { AppRole, MeDto } from './api';
/** Owner + admin only. Members never see "New app". */
export function canCreateApp(me: MeDto | null): boolean {
if (!me) return false;
return me.instance_role === 'owner' || me.instance_role === 'admin';
}
/** Owner + admin only — the "Users" admin page is also gated this way. */
export function canManageUsers(me: MeDto | null): boolean {
if (!me) return false;
return me.instance_role === 'owner' || me.instance_role === 'admin';
}
/** Can mutate scripts and routes (Save, +Add route, remove route). */
export function canWriteApp(me: MeDto | null, appMyRole: AppRole | null): boolean {
if (!me) return false;
if (me.instance_role === 'owner' || me.instance_role === 'admin') return true;
return appMyRole === 'app_admin' || appMyRole === 'editor';
}
/** Can take app-admin actions: app settings, domain claims, delete
* app, delete scripts, manage members. */
export function canAdminApp(me: MeDto | null, appMyRole: AppRole | null): boolean {
if (!me) return false;
if (me.instance_role === 'owner' || me.instance_role === 'admin') return true;
return appMyRole === 'app_admin';
}

View File

@@ -0,0 +1,54 @@
import { describe, it, expect } from 'vitest';
import { generatePassword } from './password-gen';
const CHARSET = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!#$%&*+-?@';
describe('generatePassword', () => {
it('rejects lengths under 8', () => {
expect(() => generatePassword(7)).toThrowError(/at least 8/);
});
it('respects the requested length', () => {
for (const len of [8, 16, 32, 64]) {
expect(generatePassword(len)).toHaveLength(len);
}
});
it('uses only characters from the documented charset', () => {
const set = new Set(CHARSET);
for (let i = 0; i < 1000; i++) {
for (const c of generatePassword(32)) {
expect(set.has(c)).toBe(true);
}
}
});
// Rejection-sampling sanity. With N = 71 the expected count per
// char over 100k samples is ~1408 (σ ≈ 37). A 6σ band catches
// any byte-level bias (biased modulo would push the first 38
// chars by ~16 ppm — too small for this band to flag on its
// own, but a regression to `% N` over Uint16/Uint32 with a
// non-power-of-two charset would still produce visible drift in
// pathological codepaths). Mostly this guards against
// fundamental mistakes (off-by-one in the loop, returning the
// same byte stream every time, etc.).
it('distribution stays within a wide tolerance band', () => {
const samples = 100_000;
const counts = new Map<string, number>();
for (let i = 0; i < samples; i++) {
const c = generatePassword(8)[0];
counts.set(c, (counts.get(c) ?? 0) + 1);
}
const expected = samples / CHARSET.length;
const sigma = Math.sqrt(expected);
const band = 6 * sigma;
for (const c of CHARSET) {
const observed = counts.get(c) ?? 0;
const drift = Math.abs(observed - expected);
expect(
drift,
`char "${c}": observed ${observed}, expected ~${Math.round(expected)} (drift ${drift.toFixed(0)} > ${band.toFixed(0)})`
).toBeLessThan(band);
}
});
});

View File

@@ -8,6 +8,11 @@
// entropy at 16 chars (~95 bits) to be uncopyable by hand mistakes,
// avoidant of characters that ship awkwardly through chat clients
// (no quotes, slashes, or backticks).
//
// Sampling: rejection sampling against a Uint8 stream. The naive
// `byte % CHARSET.length` would slightly overweight the first
// (256 mod N) chars; with N = 71 that's ~16 ppm of bias which is
// safe at 16 chars but easy to remove.
const CHARSET = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!#$%&*+-?@';
@@ -15,11 +20,18 @@ export function generatePassword(length = 16): string {
if (length < 8) {
throw new Error('password length must be at least 8');
}
const buf = new Uint32Array(length);
crypto.getRandomValues(buf);
const n = CHARSET.length;
// Largest multiple of `n` that fits in a Uint8 — bytes ≥ MAX get
// rejected to remove modulo bias.
const max = 256 - (256 % n);
const buf = new Uint8Array(length);
let out = '';
for (let i = 0; i < length; i++) {
out += CHARSET[buf[i] % CHARSET.length];
while (out.length < length) {
crypto.getRandomValues(buf);
for (let i = 0; i < buf.length && out.length < length; i++) {
const byte = buf[i];
if (byte < max) out += CHARSET[byte % n];
}
}
return out;
}

View File

@@ -2,6 +2,11 @@
import { base } from '$app/paths';
import { api, ApiError, type App } from '$lib/api';
import { slugify, SLUG_MAX } from '$lib/slugify';
import { canCreateApp } from '$lib/capabilities';
import { currentUser } from '$lib/auth';
const me = $derived($currentUser);
const canCreate = $derived(canCreateApp(me));
let apps = $state<App[] | null>(null);
let listError = $state<string | null>(null);
@@ -99,18 +104,20 @@
<section>
<header class="page-header">
<h1>Apps</h1>
<button
type="button"
onclick={() => {
showCreate = !showCreate;
if (!showCreate) resetCreate();
}}
>
{showCreate ? 'Cancel' : 'New app'}
</button>
{#if canCreate}
<button
type="button"
onclick={() => {
showCreate = !showCreate;
if (!showCreate) resetCreate();
}}
>
{showCreate ? 'Cancel' : 'New app'}
</button>
{/if}
</header>
{#if showCreate}
{#if showCreate && canCreate}
<form class="create-form" onsubmit={(e) => submitCreate(e)}>
<div class="row">
<label>

View File

@@ -17,6 +17,7 @@
import ActionMenu from '$lib/ActionMenu.svelte';
import RoleChip from '$lib/RoleChip.svelte';
import { currentUser } from '$lib/auth';
import { canAdminApp, canWriteApp } from '$lib/capabilities';
const me = $derived($currentUser);
@@ -36,7 +37,12 @@
let domains = $state<AppDomain[]>([]);
let members = $state<AppMemberDto[]>([]);
const canAdminMembers = $derived(myRole === 'app_admin');
// Derive UI gates from the capabilities helper so the rules stay
// in lockstep with the backend's `can()`. canAdminApp also covers
// the Members + Settings + Domains-mutation tabs; canWriteApp
// covers New script.
const canWrite = $derived(canWriteApp(me, myRole));
const canAdmin = $derived(canAdminApp(me, myRole));
// Script create
let showCreateScript = $state(false);
@@ -102,7 +108,7 @@
editDescription = app.description ?? '';
editSlug = app.slug;
const loaders: Promise<unknown>[] = [loadScripts(app.id), loadDomains(app.id)];
if (canAdminMembers) {
if (canAdmin) {
loaders.push(loadMembers(app.id), loadEligibleUsers());
}
await Promise.all(loaders);
@@ -362,6 +368,16 @@
$effect(() => {
void loadApp();
});
// Defense-in-depth: a viewer / editor following a stale link to
// the Settings or Members tab gets bounced back to Scripts. The
// backend still 403s the underlying calls, but no point showing an
// empty tab.
$effect(() => {
if (!canAdmin && (activeTab === 'settings' || activeTab === 'members')) {
activeTab = 'scripts';
}
});
</script>
{#if loading && !app}
@@ -394,33 +410,35 @@
class:active={activeTab === 'domains'}
onclick={() => (activeTab = 'domains')}>Domains ({domains.length})</button
>
{#if canAdminMembers}
{#if canAdmin}
<button
type="button"
class:active={activeTab === 'members'}
onclick={() => (activeTab = 'members')}>Members ({members.length})</button
>
<button
type="button"
class:active={activeTab === 'settings'}
onclick={() => (activeTab = 'settings')}>Settings</button
>
{/if}
<button
type="button"
class:active={activeTab === 'settings'}
onclick={() => (activeTab = 'settings')}>Settings</button
>
</nav>
{#if activeTab === 'scripts'}
<section>
<div class="row">
<h2>Scripts</h2>
<button
type="button"
onclick={() => (showCreateScript = !showCreateScript)}
>
{showCreateScript ? 'Cancel' : 'New script'}
</button>
{#if canWrite}
<button
type="button"
onclick={() => (showCreateScript = !showCreateScript)}
>
{showCreateScript ? 'Cancel' : 'New script'}
</button>
{/if}
</div>
{#if showCreateScript}
{#if showCreateScript && canWrite}
<form class="create-form" onsubmit={submitCreateScript}>
<div class="row">
<label>
@@ -473,18 +491,20 @@
these. Use <code>app.example.com</code> for exact, <code>*.example.com</code> for
wildcard, or <code>{'{'}tenant{'}'}.example.com</code> to bind a capture.
</p>
<form class="create-form inline" onsubmit={submitCreateDomain}>
<input
bind:value={createDomainPattern}
required
placeholder="app.example.com"
/>
<button type="submit" disabled={creatingDomain}>
{creatingDomain ? 'Adding…' : 'Add domain'}
</button>
</form>
{#if createDomainError}
<div class="error">{createDomainError}</div>
{#if canAdmin}
<form class="create-form inline" onsubmit={submitCreateDomain}>
<input
bind:value={createDomainPattern}
required
placeholder="app.example.com"
/>
<button type="submit" disabled={creatingDomain}>
{creatingDomain ? 'Adding…' : 'Add domain'}
</button>
</form>
{#if createDomainError}
<div class="error">{createDomainError}</div>
{/if}
{/if}
{#if domains.length === 0}
<p class="muted">No domain claims yet.</p>
@@ -496,19 +516,21 @@
<code>{d.pattern}</code>
<span class="muted">{d.shape}</span>
</div>
<button
type="button"
class="secondary danger"
onclick={() => askRemoveDomain(d)}
>
Delete
</button>
{#if canAdmin}
<button
type="button"
class="secondary danger"
onclick={() => askRemoveDomain(d)}
>
Delete
</button>
{/if}
</li>
{/each}
</ul>
{/if}
</section>
{:else if activeTab === 'members' && canAdminMembers}
{:else if activeTab === 'members' && canAdmin}
<section>
<h2>Members</h2>
<p class="muted">
@@ -623,7 +645,7 @@
</div>
{/if}
</section>
{:else if activeTab === 'settings'}
{:else if activeTab === 'settings' && canAdmin}
<section>
<h2>Settings</h2>
<form class="create-form" onsubmit={(e) => saveSettings(e)}>

View File

@@ -6,12 +6,15 @@
api,
ApiError,
type AppDomain,
type AppRole,
type ExecutionLog,
type Route,
type RouteInput,
type Script,
type VersionInfo
} from '$lib/api';
import { currentUser } from '$lib/auth';
import { canAdminApp, canWriteApp } from '$lib/capabilities';
import { logLevelColor, statusColor } from '$lib/styles';
import {
checkHostAgainstClaims,
@@ -21,6 +24,7 @@
pathKindMismatchWarning
} from '$lib/route-utils';
import CodeEditor from '$lib/CodeEditor.svelte';
import ConfirmModal from '$lib/ConfirmModal.svelte';
import { format as formatRhai } from '$lib/rhai';
/// Pretty-print a JSON string in place, leaving it untouched if the
@@ -47,6 +51,11 @@
let appSlug = $state<string | null>(null);
let appDomains = $state<AppDomain[]>([]);
let appMyRole = $state<AppRole | null>(null);
const me = $derived($currentUser);
const canWrite = $derived(canWriteApp(me, appMyRole));
const canAdmin = $derived(canAdminApp(me, appMyRole));
async function loadScript() {
scriptLoading = true;
@@ -58,15 +67,16 @@
editableDescription = script.description ?? '';
editableTimeout = script.timeout_seconds;
editableSandbox = { ...(script.sandbox ?? {}) };
// Resolve the owning app's slug for the breadcrumb and its
// domain claims for the route form's suggestions + live
// validation. Both are non-fatal — the page works without
// them.
// Resolve the owning app for the breadcrumb (slug),
// route-form host suggestions (domain claims), and UI
// shadowing (my_role on this app). All non-fatal — the
// page renders without them, just with reduced fidelity.
const appId = script.app_id;
void api.apps
.get(appId)
.then((a) => {
appSlug = a.slug;
appMyRole = a.my_role ?? null;
})
.catch(() => {});
void api.domains
@@ -366,16 +376,25 @@
}
// ---------------- deletion ----------------
let confirmingDelete = $state(false);
let deleting = $state(false);
async function remove() {
let deleteError = $state<string | null>(null);
function askDelete() {
deleteError = null;
confirmingDelete = true;
}
async function confirmDelete() {
if (!script) return;
if (!confirm(`Delete script "${script.name}"? This cannot be undone.`)) return;
deleting = true;
deleteError = null;
try {
await api.scripts.remove(id);
await goto(base + '/');
} catch (e) {
alert(e instanceof Error ? e.message : String(e));
deleteError = e instanceof Error ? e.message : String(e);
} finally {
deleting = false;
}
}
@@ -386,6 +405,15 @@
void loadRoutes();
void loadLogs();
});
// Defense-in-depth: anyone non-admin who lands on the Settings
// tab via a stale link gets bounced back to Edit. The tab button
// itself is also hidden.
$effect(() => {
if (!canAdmin && tab === 'settings') {
tab = 'edit';
}
});
</script>
<section>
@@ -410,9 +438,11 @@
v{script.version} · timeout {script.timeout_seconds}s · {script.description ?? 'no description'}
</p>
</div>
<button type="button" class="danger" onclick={remove} disabled={deleting}>
{deleting ? 'Deleting…' : 'Delete'}
</button>
{#if canAdmin}
<button type="button" class="danger" onclick={askDelete} disabled={deleting}>
{deleting ? 'Deleting…' : 'Delete'}
</button>
{/if}
</header>
<nav class="tabs">
@@ -423,7 +453,9 @@
<span class="badge-count">{routes.length}</span>
{/if}
</button>
<button class:active={tab === 'settings'} onclick={() => (tab = 'settings')}>Settings</button>
{#if canAdmin}
<button class:active={tab === 'settings'} onclick={() => (tab = 'settings')}>Settings</button>
{/if}
<button class:active={tab === 'executions'} onclick={() => (tab = 'executions')}>
Executions
</button>
@@ -435,26 +467,35 @@
<section class="card">
<header class="editor-header">
<h2>Source</h2>
<button type="button" class="ghost small" onclick={formatRhaiSource}>
Format
</button>
{#if canWrite}
<button type="button" class="ghost small" onclick={formatRhaiSource}>
Format
</button>
{/if}
</header>
<CodeEditor bind:value={editableSource} language="rhai" minHeight="22rem" />
<CodeEditor
bind:value={editableSource}
language="rhai"
minHeight="22rem"
readOnly={!canWrite}
/>
{#if rhaiFormatError}
<div class="error inline">{rhaiFormatError}</div>
{/if}
{#if saveSourceError}
<div class="error inline">{saveSourceError}</div>
{/if}
<div class="actions">
<button
type="button"
onclick={saveSource}
disabled={savingSource || editableSource === script.source}
>
{savingSource ? 'Saving…' : 'Save'}
</button>
</div>
{#if canWrite}
<div class="actions">
<button
type="button"
onclick={saveSource}
disabled={savingSource || editableSource === script.source}
>
{savingSource ? 'Saving…' : 'Save'}
</button>
</div>
{/if}
</section>
<section class="card">
@@ -510,12 +551,14 @@
<section class="card wide">
<header class="card-header">
<h2>Routes</h2>
<button type="button" onclick={() => (showAddRoute = !showAddRoute)}>
{showAddRoute ? 'Cancel' : '+ Add route'}
</button>
{#if canWrite}
<button type="button" onclick={() => (showAddRoute = !showAddRoute)}>
{showAddRoute ? 'Cancel' : '+ Add route'}
</button>
{/if}
</header>
{#if showAddRoute}
{#if showAddRoute && canWrite}
<form class="route-form" onsubmit={submitRoute}>
<label class="full">
<span>Path</span>
@@ -626,9 +669,11 @@
: r.host}
</span>
<span class="path">{r.path}</span>
<button type="button" class="link danger" onclick={() => removeRoute(r.id)}>
remove
</button>
{#if canWrite}
<button type="button" class="link danger" onclick={() => removeRoute(r.id)}>
remove
</button>
{/if}
</div>
{#if info}
<div class="route-url muted">{fullUrlForRoute(r)}</div>
@@ -670,7 +715,7 @@
</section>
<!-- ===================================================== SETTINGS ===== -->
{:else if tab === 'settings'}
{:else if tab === 'settings' && canAdmin}
<section class="card wide">
<h2>General</h2>
<label>
@@ -786,6 +831,35 @@
{/if}
</section>
{/if}
{#if confirmingDelete && script}
<ConfirmModal
title="Delete script “{script.name}”"
variant="danger"
confirmLabel="Delete script"
busyLabel="Deleting…"
confirmPhrase={script.name}
confirmPhrasePrompt="Type the script name to confirm:"
busy={deleting}
onConfirm={confirmDelete}
onCancel={() => (confirmingDelete = false)}
>
<p>
This will <strong>permanently delete</strong>
<strong>{script.name}</strong>, all its routes, and all its
execution logs. There is no undo.
</p>
{#if routes.length > 0}
<p class="muted">
{routes.length} route{routes.length === 1 ? '' : 's'} bound to
this script will be removed.
</p>
{/if}
{#if deleteError}
<p class="modal-error">{deleteError}</p>
{/if}
</ConfirmModal>
{/if}
{/if}
</section>

View File

@@ -79,6 +79,13 @@
let deleteTarget = $state<AdminDto | null>(null);
let deletePending = $state(false);
// Deactivate modal -------------------------------------------------------
// Reactivate is one-click (non-destructive); deactivate routes
// through the modal because it signs the user out and expires
// every API key they hold.
let deactivateTarget = $state<AdminDto | null>(null);
let deactivatePending = $state(false);
// Validation rules (mirror backend: 2-32, [a-z0-9._-]) -------------------
const USERNAME_RE = /^[a-z0-9._-]{2,32}$/;
const EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
@@ -219,19 +226,36 @@
}
}
async function toggleActive(row: AdminDto) {
async function reactivate(row: AdminDto) {
try {
const updated = await api.admins.update(row.id, { is_active: !row.is_active });
const updated = await api.admins.update(row.id, { is_active: true });
admins = admins.map((a) => (a.id === updated.id ? updated : a));
flash(
'info',
`${updated.username} ${updated.is_active ? 'reactivated' : 'deactivated'}.`
);
flash('info', `${updated.username} reactivated.`);
} catch (e) {
flash('error', e instanceof ApiError ? e.message : 'failed to update user');
}
}
function askDeactivate(row: AdminDto) {
deactivateTarget = row;
}
async function confirmDeactivate() {
if (!deactivateTarget) return;
deactivatePending = true;
const target = deactivateTarget;
try {
const updated = await api.admins.update(target.id, { is_active: false });
admins = admins.map((a) => (a.id === updated.id ? updated : a));
deactivateTarget = null;
flash('info', `${updated.username} deactivated.`);
} catch (e) {
flash('error', e instanceof ApiError ? e.message : 'failed to update user');
} finally {
deactivatePending = false;
}
}
function openDelete(row: AdminDto) {
deleteTarget = row;
}
@@ -353,7 +377,8 @@
{ label: 'Edit', onClick: () => openEdit(row) },
{
label: row.is_active ? 'Deactivate' : 'Reactivate',
onClick: () => toggleActive(row)
onClick: () =>
row.is_active ? askDeactivate(row) : reactivate(row)
},
{
label: 'Delete',
@@ -571,6 +596,30 @@
</div>
{/if}
<!-- Deactivate confirmation -->
{#if deactivateTarget}
{@const dt = deactivateTarget}
<ConfirmModal
title="Deactivate {dt.username}?"
variant="danger"
confirmLabel="Deactivate"
busyLabel="Deactivating…"
busy={deactivatePending}
onConfirm={confirmDeactivate}
onCancel={() => (deactivateTarget = null)}
>
<p>
Deactivating signs <strong>{dt.username}</strong> out immediately and
expires <strong>every API key</strong> they hold. Their sessions and keys
won't come back if you reactivate — they'll need to log in again and
mint new keys.
</p>
<p class="muted">
Reactivation is one click — this isn't permanent.
</p>
</ConfirmModal>
{/if}
<!-- Delete confirmation -->
{#if deleteTarget}
{@const dt = deleteTarget}

View File

@@ -0,0 +1,75 @@
# Dashboard E2E tests
Browser-driven tests for the PiCloud dashboard, powered by [Playwright].
## Prerequisites
The tests drive a real dashboard against a real backend. Bring up both
before running:
```sh
# 1. Postgres
docker compose up -d postgres
# 2. Backend (port 18080 matches dashboard/vite.config.ts dev proxy)
PICLOUD_BIND=127.0.0.1:18080 \
PICLOUD_ADMIN_USERNAME=admin \
PICLOUD_ADMIN_PASSWORD=admin \
DATABASE_URL=postgres://picloud:picloud@127.0.0.1:15432/picloud \
cargo run -p picloud
# 3. Browser binaries (one-time, ~200 MB)
cd dashboard && npm run test:e2e:install
```
The Vite dev server is started automatically by Playwright's `webServer`
config — you do not need to run `npm run dev` yourself.
## Running
```sh
cd dashboard
npm run test:e2e # headless, full suite
npm run test:e2e:ui # interactive UI runner
npx playwright test smoke # run a single spec
npx playwright show-report
```
## Env vars
| Var | Default | Notes |
| ------------------------ | ------------------------ | ----------------------------------------------------------------- |
| `E2E_BASE_URL` | `http://localhost:5173` | Origin tests navigate against (dashboard is mounted at `/admin`). |
| `E2E_API_BASE` | `http://127.0.0.1:18080` | Backend used by globalSetup health probe + admin login. |
| `E2E_DASHBOARD_ORIGIN` | `http://localhost:5173` | Used to seed `localStorage` during globalSetup. |
| `E2E_ADMIN_USERNAME` | `admin` | Bootstrap admin to log in as. |
| `E2E_ADMIN_PASSWORD` | `admin` | Match `PICLOUD_ADMIN_PASSWORD` above. |
| `PICLOUD_DASHBOARD_PORT` | `5173` | Dev server port — picked up by both Vite and Playwright. |
## How isolation works
Tests share one backend + one Postgres. To avoid cross-test interference:
- A shared bootstrap admin session is captured once in
`tests/e2e/.auth/admin.json` (gitignored) and reused by every test via
`storageState`.
- Each test creates resources with a unique slug / username produced by
`fixtures/ids.ts` (`e2e-<prefix>-w<worker>-<random>`).
- Each test registers cleanup via `fixtures/cleanup.ts` and tears down
in `afterEach`. Cleanup is best-effort: a missing resource doesn't
fail the suite, so a test can pre-delete and still register the entry.
## Layout
```
tests/e2e/
global-setup.ts # health probe + admin login + storageState seed
smoke.spec.ts # A.5 smoke
fixtures/
auth.ts # UI login/logout helpers (for login-flow specs)
api.ts # bearer-token-backed APIRequestContext
ids.ts # unique slug/username generators (test-fixture)
cleanup.ts # afterEach resource teardown
```
[Playwright]: https://playwright.dev

View File

@@ -0,0 +1,335 @@
import { expect, type Page } from '@playwright/test';
import { test } from '../fixtures/ids';
import { CleanupRegistry } from '../fixtures/cleanup';
import { adminApi } from '../fixtures/api';
import { loginAsUserToken, pageWithUserToken } from '../fixtures/role-page';
const MEMBER_PW = 'e2e-member-pw';
async function seedAppAndMember(opts: {
slug: string;
username: string;
role: 'viewer' | 'editor' | 'app_admin';
}): Promise<{ appId: string; userId: string }> {
const api = await adminApi();
try {
const appRes = await api.post('/api/v1/admin/apps', {
data: { slug: opts.slug, name: opts.slug }
});
expect(appRes.ok()).toBe(true);
const appId = ((await appRes.json()) as { id: string }).id;
const userRes = await api.post('/api/v1/admin/admins', {
data: { username: opts.username, password: MEMBER_PW, instance_role: 'member' }
});
expect(userRes.ok()).toBe(true);
const userId = ((await userRes.json()) as { id: string }).id;
const memberRes = await api.post(`/api/v1/admin/apps/${opts.slug}/members`, {
data: { user_id: userId, role: opts.role }
});
expect(memberRes.ok()).toBe(true);
return { appId, userId };
} finally {
await api.dispose();
}
}
// Phase B2 — Apps Lifecycle. Create, view, edit, delete, plus the
// historical-slug takeover flow and adversarial inputs.
const cleanup = new CleanupRegistry();
test.afterEach(async () => {
await cleanup.run();
});
function failOnDialog(page: Page): void {
page.on('dialog', async (dialog) => {
await dialog.dismiss();
throw new Error(`Unexpected browser dialog fired: ${dialog.type()} — "${dialog.message()}"`);
});
}
async function openCreateForm(page: Page): Promise<void> {
await page.goto('/admin/apps');
await page.getByRole('button', { name: 'New app' }).click();
}
async function createApp(
page: Page,
opts: { name: string; slug: string; description?: string }
): Promise<void> {
await openCreateForm(page);
await page.getByLabel('Name').fill(opts.name);
// Clear the auto-derived slug and type the test-controlled one so
// we know exactly which slug we'll register for cleanup.
const slugInput = page.getByLabel('Slug');
await slugInput.fill('');
await slugInput.fill(opts.slug);
if (opts.description !== undefined) {
await page.getByLabel('Description').fill(opts.description);
}
await page.getByRole('button', { name: 'Create app' }).click();
}
test.describe('B2 apps lifecycle', () => {
test('create app: slug auto-derives from name, app appears in list', async ({
page,
uniqueSlug
}) => {
const slug = uniqueSlug('lifecycle');
const displayName = slug.replace(/-/g, ' ');
await openCreateForm(page);
await page.getByLabel('Name').fill(displayName);
// Slug auto-derives — the input value is set, no extra typing.
const slugInput = page.getByLabel('Slug');
await expect(slugInput).toHaveValue(slug);
await page.getByRole('button', { name: 'Create app' }).click();
cleanup.app(slug);
await expect(page.getByRole('link', { name: new RegExp(displayName) })).toBeVisible();
});
test('edit name + description in settings persists across reload', async ({
page,
uniqueSlug
}) => {
const slug = uniqueSlug('edit');
await createApp(page, { name: slug, slug });
cleanup.app(slug);
await page.getByRole('link', { name: new RegExp(slug) }).click();
await expect(page).toHaveURL(new RegExp(`/admin/apps/${slug}$`));
await page.getByRole('button', { name: 'Settings' }).click();
const newName = `${slug} renamed`;
const newDesc = 'updated description';
await page.getByLabel('Name').fill(newName);
await page.getByLabel('Description').fill(newDesc);
await page.getByRole('button', { name: 'Save changes' }).click();
// Wait for the network round-trip to settle — the busy label
// flips back to "Save changes" when done.
await expect(page.getByRole('button', { name: 'Save changes' })).toBeEnabled();
await page.reload();
await page.getByRole('button', { name: 'Settings' }).click();
await expect(page.getByLabel('Name')).toHaveValue(newName);
await expect(page.getByLabel('Description')).toHaveValue(newDesc);
});
test('delete: wrong phrase keeps button disabled, right phrase removes app', async ({
page,
uniqueSlug
}) => {
const slug = uniqueSlug('delete');
await createApp(page, { name: slug, slug });
cleanup.app(slug); // belt-and-braces; cleanup is best-effort
await page.getByRole('link', { name: new RegExp(slug) }).click();
await page.getByRole('button', { name: 'Settings' }).click();
await page.getByRole('button', { name: 'Delete app' }).click();
const dialog = page.getByRole('dialog');
await expect(dialog).toBeVisible();
const phraseInput = dialog.getByRole('textbox');
const confirmBtn = dialog.getByRole('button', { name: 'Delete app' });
await expect(confirmBtn).toBeDisabled();
await phraseInput.fill('wrong-phrase');
await expect(confirmBtn).toBeDisabled();
await phraseInput.fill(slug);
await expect(confirmBtn).toBeEnabled();
await confirmBtn.click();
await expect(page).toHaveURL(/\/admin\/apps$/);
await expect(page.getByRole('link', { name: new RegExp(slug) })).toHaveCount(0);
});
test('historical slug warning surfaces; force-takeover succeeds', async ({
page,
uniqueSlug
}) => {
const origSlug = uniqueSlug('hist');
const renamedSlug = `${origSlug}-r`;
// Historical-redirect rows are created on RENAME, not on
// delete. So: create app, rename it, original slug now lives
// in app_slug_history.
const api = await adminApi();
try {
const created = await api.post('/api/v1/admin/apps', {
data: { slug: origSlug, name: origSlug }
});
expect(created.ok()).toBe(true);
const renamed = await api.patch(
`/api/v1/admin/apps/${encodeURIComponent(origSlug)}`,
{ data: { slug: renamedSlug } }
);
expect(renamed.ok()).toBe(true);
} finally {
await api.dispose();
}
cleanup.app(renamedSlug); // the renamed app still exists
await openCreateForm(page);
await page.getByLabel('Name').fill(origSlug);
await page.getByLabel('Slug').fill('');
await page.getByLabel('Slug').fill(origSlug);
await page.getByRole('button', { name: 'Create app' }).click();
await expect(page.locator('.warning')).toBeVisible();
await expect(page.locator('.warning')).toContainText(/previously redirected/i);
await page.getByRole('button', { name: /claim slug anyway/i }).click();
cleanup.app(origSlug); // the takeover created a new app
await expect(page.getByRole('link', { name: new RegExp(origSlug) })).toBeVisible();
});
});
test.describe('B2 apps adversarial', () => {
test('slug with uppercase + spaces is normalized in-place', async ({ page, uniqueSlug }) => {
const base = uniqueSlug('norm');
await openCreateForm(page);
await page.getByLabel('Name').fill(base);
const slugInput = page.getByLabel('Slug');
await slugInput.fill('');
// Simulate the user typing/pasting an invalid slug. The
// oninput handler runs slugify() and rewrites the input value.
await slugInput.fill(` Hello WORLD ${base}!`);
await expect(slugInput).toHaveValue(`hello-world-${base}`);
});
test('xss in name and description renders as text everywhere', async ({ page, uniqueSlug }) => {
failOnDialog(page);
const slug = uniqueSlug('xss');
const payload = '<img src=x onerror=alert(1)><script>window.__xss=true;</script>';
await createApp(page, { name: payload, slug, description: payload });
cleanup.app(slug);
// List page — the link's accessible name contains the literal
// payload text, not the parsed HTML.
await expect(page.getByRole('link', { name: new RegExp('img src=x') })).toBeVisible();
// Detail page — open it; payload renders in the breadcrumb /
// header as text only.
await page.goto(`/admin/apps/${slug}`);
const xssRan = await page.evaluate(
() => (window as unknown as { __xss?: boolean }).__xss === true
);
expect(xssRan).toBe(false);
expect(await page.locator('script:has-text("__xss")').count()).toBe(0);
});
test('very long name does not crash the dashboard', async ({ page, uniqueSlug }) => {
// The backend currently has no name length cap; the dashboard
// just needs to keep rendering when handed an unusually long
// value. Guards against layout / locator regressions when a
// future test or user creates an oversized app.
const slug = uniqueSlug('long');
const longName = 'A'.repeat(10_000);
await openCreateForm(page);
await page.getByLabel('Name').fill(longName);
await page.getByLabel('Slug').fill('');
await page.getByLabel('Slug').fill(slug);
await page.getByRole('button', { name: 'Create app' }).click();
const errorVisible = await page
.locator('.create-form .error')
.isVisible()
.catch(() => false);
if (errorVisible) {
// Server rejected — fine, no cleanup needed.
await expect(page.getByRole('link', { name: new RegExp(slug) })).toHaveCount(0);
return;
}
// Server accepted — confirm the dashboard still renders and is
// navigable. Detail page must load too.
cleanup.app(slug);
await expect(page.getByRole('link', { name: new RegExp(slug) })).toBeVisible();
await page.goto(`/admin/apps/${slug}`);
await expect(page.getByRole('button', { name: 'Settings' })).toBeVisible();
});
});
test.describe('B2 apps role shadowing', () => {
test('viewer member sees no "New app" on the apps list', async ({
browser,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('vlist');
const username = uniqueUsername('viewer');
const { userId } = await seedAppAndMember({ slug, username, role: 'viewer' });
cleanup.app(slug);
cleanup.adminUser(userId);
const token = await loginAsUserToken(username, MEMBER_PW);
const page = await pageWithUserToken(browser, token);
try {
await page.goto('/admin/apps');
// Member can see the apps list (just the one they belong to)
// but the create-app affordance is hidden.
await expect(page.getByRole('link', { name: new RegExp(slug) })).toBeVisible();
await expect(page.getByRole('button', { name: /^New app$/ })).toHaveCount(0);
} finally {
await page.context().close();
}
});
test('viewer sees no Add domain form and no Settings tab on app detail', async ({
browser,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('vdom');
const username = uniqueUsername('viewer');
const { userId } = await seedAppAndMember({ slug, username, role: 'viewer' });
cleanup.app(slug);
cleanup.adminUser(userId);
const token = await loginAsUserToken(username, MEMBER_PW);
const page = await pageWithUserToken(browser, token);
try {
await page.goto(`/admin/apps/${slug}`);
await expect(
page.getByRole('button', { name: /^Scripts \(\d+\)$/ })
).toBeVisible();
// Settings tab is absent.
await expect(page.getByRole('button', { name: /^Settings$/ })).toHaveCount(0);
// Domains tab still listable, but no Add-domain submit.
await page.getByRole('button', { name: /^Domains \(\d+\)$/ }).click();
await expect(page.getByRole('button', { name: /^Add domain$/ })).toHaveCount(0);
} finally {
await page.context().close();
}
});
test('editor sees New script but no Settings tab', async ({
browser,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('edit');
const username = uniqueUsername('editor');
const { userId } = await seedAppAndMember({ slug, username, role: 'editor' });
cleanup.app(slug);
cleanup.adminUser(userId);
const token = await loginAsUserToken(username, MEMBER_PW);
const page = await pageWithUserToken(browser, token);
try {
await page.goto(`/admin/apps/${slug}`);
await expect(page.getByRole('button', { name: /^New script$/ })).toBeVisible();
await expect(page.getByRole('button', { name: /^Settings$/ })).toHaveCount(0);
await expect(
page.getByRole('button', { name: /^Members \(\d+\)$/ })
).toHaveCount(0);
} finally {
await page.context().close();
}
});
});

View File

@@ -0,0 +1,118 @@
import { expect, test, type Page } from '@playwright/test';
import { loginAsAdmin, logout } from '../fixtures/auth';
// Phase B1 — Auth & Navigation. Every interaction with the login form
// and the layout-level redirects, plus the obvious adversarial inputs.
const VALID_USERNAME = process.env.E2E_ADMIN_USERNAME ?? 'admin';
const VALID_PASSWORD = process.env.E2E_ADMIN_PASSWORD ?? 'admin';
function failOnDialog(page: Page): void {
page.on('dialog', async (dialog) => {
await dialog.dismiss();
throw new Error(`Unexpected browser dialog fired: ${dialog.type()} — "${dialog.message()}"`);
});
}
test.describe('B1 auth — unauthenticated', () => {
test.use({ storageState: { cookies: [], origins: [] } });
test('valid credentials land on the apps list', async ({ page }) => {
await loginAsAdmin(page);
await expect(page.getByRole('heading', { name: 'Apps', level: 1 })).toBeVisible();
});
test('wrong password shows an inline error and stays on /login', async ({ page }) => {
await page.goto('/admin/login');
await page.getByLabel('Username').fill(VALID_USERNAME);
await page.getByLabel('Password').fill('definitely-not-the-password');
await page.getByRole('button', { name: /sign in/i }).click();
const error = page.locator('.error');
await expect(error).toBeVisible();
await expect(error).not.toHaveText('');
await expect(page).toHaveURL(/\/admin\/login$/);
// localStorage must remain empty — a failed login should not
// leak a session token.
const token = await page.evaluate(() => localStorage.getItem('picloud.admin.token'));
expect(token).toBeNull();
});
test('empty submit is blocked by the browser and does not navigate', async ({ page }) => {
await page.goto('/admin/login');
await page.getByRole('button', { name: /sign in/i }).click();
// HTML5 validation prevents submission; URL is unchanged and the
// username input is reported invalid.
await expect(page).toHaveURL(/\/admin\/login$/);
const usernameInvalid = await page
.getByLabel('Username')
.evaluate((el: HTMLInputElement) => !el.validity.valid);
expect(usernameInvalid).toBe(true);
await expect(page.locator('.error')).toBeHidden();
});
test('visiting an authed route redirects to /login', async ({ page }) => {
await page.goto('/admin/apps');
await expect(page).toHaveURL(/\/admin\/login$/);
await expect(page.getByLabel('Username')).toBeVisible();
});
test('password field is type=password (no plaintext echo)', async ({ page }) => {
await page.goto('/admin/login');
await expect(page.getByLabel('Password')).toHaveAttribute('type', 'password');
});
test('xss payload in username is escaped and does not execute', async ({ page }) => {
failOnDialog(page);
const payload = '<script>window.__xss = true;</script><img src=x onerror=alert(1)>';
await page.goto('/admin/login');
await page.getByLabel('Username').fill(payload);
await page.getByLabel('Password').fill('whatever');
await page.getByRole('button', { name: /sign in/i }).click();
// Whatever the API does with that input, the page must remain
// safe: no script tag injected into the DOM, no global side
// effect, and a visible error (since the credentials don't
// match any user).
await expect(page.locator('.error')).toBeVisible();
const xssRan = await page.evaluate(
() => (window as unknown as { __xss?: boolean }).__xss === true
);
expect(xssRan).toBe(false);
const injectedScript = await page.locator('script:has-text("__xss")').count();
expect(injectedScript).toBe(0);
// The form must still be functional after the rejected attempt.
await page.getByLabel('Username').fill('');
await page.getByLabel('Username').fill(VALID_USERNAME);
await page.getByLabel('Password').fill('');
await page.getByLabel('Password').fill(VALID_PASSWORD);
await page.getByRole('button', { name: /sign in/i }).click();
await expect(page).toHaveURL(/\/admin\/apps$/);
});
});
test.describe('B1 auth — authenticated', () => {
test('visiting /login while signed in bounces to /apps', async ({ page }) => {
await page.goto('/admin/login');
await expect(page).toHaveURL(/\/admin\/apps$/);
});
});
test.describe('B1 auth — logout', () => {
// Logout must NOT use the shared storageState token, or it would
// invalidate the session every other test relies on. Each run
// here logs in fresh so its session is disposable.
test.use({ storageState: { cookies: [], origins: [] } });
test('logout clears the session and lands on /login', async ({ page }) => {
await loginAsAdmin(page);
await expect(page.getByRole('heading', { name: 'Apps', level: 1 })).toBeVisible();
await logout(page);
const token = await page.evaluate(() => localStorage.getItem('picloud.admin.token'));
expect(token).toBeNull();
// And the authed area is now gated again.
await page.goto('/admin/apps');
await expect(page).toHaveURL(/\/admin\/login$/);
});
});

View File

@@ -0,0 +1,47 @@
import { request, type APIRequestContext } from '@playwright/test';
import { promises as fs } from 'node:fs';
import path from 'node:path';
import { fileURLToPath } from 'node:url';
const __dirname = path.dirname(fileURLToPath(import.meta.url));
const API_BASE = process.env.E2E_API_BASE ?? 'http://127.0.0.1:18080';
const STATE_PATH = path.join(__dirname, '..', '.auth', 'admin.json');
interface StoredState {
origins: Array<{
origin: string;
localStorage: Array<{ name: string; value: string }>;
}>;
}
let cachedToken: string | null = null;
async function readAdminToken(): Promise<string> {
if (cachedToken) return cachedToken;
const raw = await fs.readFile(STATE_PATH, 'utf8');
const state = JSON.parse(raw) as StoredState;
for (const origin of state.origins) {
const entry = origin.localStorage.find((e) => e.name === 'picloud.admin.token');
if (entry) {
cachedToken = entry.value;
return entry.value;
}
}
throw new Error(`No picloud.admin.token in ${STATE_PATH} — did globalSetup run?`);
}
// Thin wrapper around Playwright's request context that injects the
// admin bearer token from the shared storageState. Use this for
// setup/teardown shortcuts when the *test itself* is about something
// else (e.g., a script-editor test that just needs an app to exist).
export async function adminApi(): Promise<APIRequestContext> {
const token = await readAdminToken();
return request.newContext({
baseURL: API_BASE,
extraHTTPHeaders: {
authorization: `Bearer ${token}`,
'content-type': 'application/json'
}
});
}

View File

@@ -0,0 +1,21 @@
import type { Page } from '@playwright/test';
import { expect } from '@playwright/test';
const ADMIN_USERNAME = process.env.E2E_ADMIN_USERNAME ?? 'admin';
const ADMIN_PASSWORD = process.env.E2E_ADMIN_PASSWORD ?? 'admin';
// Drive the login form like a real user. globalSetup already saves a
// storageState for the shared admin, so most tests don't need this —
// it's reserved for specs that explicitly cover the login UI.
export async function loginAsAdmin(page: Page): Promise<void> {
await page.goto('/admin/login');
await page.getByLabel('Username').fill(ADMIN_USERNAME);
await page.getByLabel('Password').fill(ADMIN_PASSWORD);
await page.getByRole('button', { name: /sign in/i }).click();
await expect(page).toHaveURL(/\/admin\/apps$/);
}
export async function logout(page: Page): Promise<void> {
await page.getByRole('button', { name: /logout/i }).click();
await expect(page).toHaveURL(/\/admin\/login$/);
}

View File

@@ -0,0 +1,48 @@
import type { APIRequestContext } from '@playwright/test';
import { adminApi } from './api';
// Resources to delete after a test, in LIFO order. Tests register
// their creations and the registry tears everything down in
// `cleanupRegistered` — typically called from `test.afterEach`.
type Cleanup = (api: APIRequestContext) => Promise<void>;
export class CleanupRegistry {
private items: Cleanup[] = [];
app(slugOrId: string): void {
this.items.push(async (api) => {
await api.delete(`/api/v1/admin/apps/${encodeURIComponent(slugOrId)}?force=true`);
});
}
adminUser(userId: string): void {
this.items.push(async (api) => {
await api.delete(`/api/v1/admin/admins/${userId}`);
});
}
apiKey(keyId: string): void {
this.items.push(async (api) => {
await api.delete(`/api/v1/admin/api-keys/${keyId}`);
});
}
async run(): Promise<void> {
if (this.items.length === 0) return;
const api = await adminApi();
try {
for (const item of this.items.reverse()) {
try {
await item(api);
} catch {
// Best-effort cleanup — a missing resource (already
// deleted by the test) shouldn't fail the suite.
}
}
} finally {
await api.dispose();
this.items = [];
}
}
}

View File

@@ -0,0 +1,42 @@
/* eslint-disable no-empty-pattern -- Playwright fixtures require an
object-pattern first arg; these fixtures don't depend on any other
fixture so the pattern is intentionally empty. */
import { test as base } from '@playwright/test';
import { randomBytes } from 'node:crypto';
// Tests share a single backend/Postgres. To avoid collisions we tag
// every resource the test creates with a short random suffix plus the
// Playwright worker index. This way two workers running the same spec
// in parallel never fight over the same slug or username.
export function shortId(): string {
return randomBytes(3).toString('hex');
}
export function uniqueSlug(prefix: string, workerIndex: number): string {
const cleaned = prefix
.toLowerCase()
.replace(/[^a-z0-9]+/g, '-')
.replace(/^-|-$/g, '');
return `e2e-${cleaned}-w${workerIndex}-${shortId()}`;
}
export function uniqueUsername(prefix: string, workerIndex: number): string {
// Username regex is [a-z0-9._-]{2,32}. Mirror the slug format.
const cleaned = prefix.toLowerCase().replace(/[^a-z0-9]+/g, '');
return `e2e${cleaned}w${workerIndex}${shortId()}`.slice(0, 32);
}
export const test = base.extend<{
uniqueSlug: (prefix: string) => string;
uniqueUsername: (prefix: string) => string;
}>({
uniqueSlug: async ({}, use, testInfo) => {
await use((prefix) => uniqueSlug(prefix, testInfo.workerIndex));
},
uniqueUsername: async ({}, use, testInfo) => {
await use((prefix) => uniqueUsername(prefix, testInfo.workerIndex));
}
});
export { expect } from '@playwright/test';

View File

@@ -0,0 +1,46 @@
// Helpers for tests that drive the dashboard as a non-bootstrap admin
// (member with an app-membership row, custom InstanceRole, etc.).
//
// `loginAsUserToken` exchanges username/password for a bearer token
// via the admin API. `pageWithUserToken` opens a fresh browser
// context, seeds the dashboard's localStorage entry, and returns the
// page ready to navigate. Callers are responsible for closing the
// returned page's context.
import { expect, request, type Browser, type Page } from '@playwright/test';
const API_BASE = process.env.E2E_API_BASE ?? 'http://127.0.0.1:18080';
export async function loginAsUserToken(
username: string,
password: string
): Promise<string> {
const probe = await request.newContext({ baseURL: API_BASE });
try {
const res = await probe.post('/api/v1/admin/auth/login', {
data: { username, password },
headers: { 'content-type': 'application/json' }
});
expect(res.ok()).toBe(true);
return ((await res.json()) as { token: string }).token;
} finally {
await probe.dispose();
}
}
export async function pageWithUserToken(
browser: Browser,
token: string
): Promise<Page> {
const ctx = await browser.newContext({ storageState: undefined });
const page = await ctx.newPage();
// Seed localStorage on the right origin, then navigate normally.
await page.goto('/admin/login');
await page.evaluate(
([key, value]) => {
localStorage.setItem(key, value);
},
['picloud.admin.token', token]
);
return page;
}

View File

@@ -0,0 +1,146 @@
import { chromium, request } from '@playwright/test';
import { promises as fs } from 'node:fs';
import path from 'node:path';
import { fileURLToPath } from 'node:url';
const __dirname = path.dirname(fileURLToPath(import.meta.url));
const API_BASE = process.env.E2E_API_BASE ?? 'http://127.0.0.1:18080';
const DASHBOARD_PORT = Number(process.env.PICLOUD_DASHBOARD_PORT ?? 5173);
const DASHBOARD_ORIGIN = process.env.E2E_DASHBOARD_ORIGIN ?? `http://localhost:${DASHBOARD_PORT}`;
const ADMIN_USERNAME = process.env.E2E_ADMIN_USERNAME ?? 'admin';
const ADMIN_PASSWORD = process.env.E2E_ADMIN_PASSWORD ?? 'admin';
const AUTH_DIR = path.join(__dirname, '.auth');
const ADMIN_STATE_PATH = path.join(AUTH_DIR, 'admin.json');
export default async function globalSetup(): Promise<void> {
await assertBackendUp();
await fs.mkdir(AUTH_DIR, { recursive: true });
const token = await loginAsAdmin();
await sweepOrphans(token);
await persistAdminStorageState(token);
}
async function assertBackendUp(): Promise<void> {
const probe = await request.newContext();
try {
const res = await probe.get(`${API_BASE}/healthz`, { timeout: 5_000 });
if (!res.ok()) {
throw new Error(
`backend /healthz returned ${res.status()} — is \`cargo run -p picloud\` listening on ${API_BASE}?`
);
}
} catch (err) {
throw new Error(
`Could not reach backend at ${API_BASE}/healthz. ` +
`Bring it up before running E2E tests:\n\n` +
` docker compose up -d postgres\n` +
` PICLOUD_BIND=127.0.0.1:18080 \\\n` +
` PICLOUD_ADMIN_USERNAME=${ADMIN_USERNAME} \\\n` +
` PICLOUD_ADMIN_PASSWORD=${ADMIN_PASSWORD} \\\n` +
` DATABASE_URL=postgres://picloud:picloud@127.0.0.1:15432/picloud \\\n` +
` cargo run -p picloud\n\n` +
`Underlying error: ${(err as Error).message}`
);
} finally {
await probe.dispose();
}
}
async function loginAsAdmin(): Promise<string> {
const ctx = await request.newContext();
try {
const res = await ctx.post(`${API_BASE}/api/v1/admin/auth/login`, {
data: { username: ADMIN_USERNAME, password: ADMIN_PASSWORD },
headers: { 'content-type': 'application/json' }
});
if (!res.ok()) {
const body = await res.text();
throw new Error(
`Admin login failed (${res.status()}): ${body}. ` +
`Verify PICLOUD_ADMIN_USERNAME / PICLOUD_ADMIN_PASSWORD match the seeded bootstrap admin.`
);
}
const payload = (await res.json()) as { token?: string };
if (!payload.token) {
throw new Error('Admin login response missing token field');
}
return payload.token;
} finally {
await ctx.dispose();
}
}
// Clean up apps + admin users left over from a previous crashed run.
// The convention is that every e2e-created resource has a slug
// starting with `e2e-` (apps) or a username starting with `e2e`
// (admins) — see fixtures/ids.ts. Best-effort: a sweep failure must
// not stop the suite from running.
async function sweepOrphans(token: string): Promise<void> {
const ctx = await request.newContext({
baseURL: API_BASE,
extraHTTPHeaders: { authorization: `Bearer ${token}` }
});
try {
try {
const res = await ctx.get('/api/v1/admin/apps');
if (res.ok()) {
const apps = (await res.json()) as Array<{ slug: string }>;
for (const app of apps) {
if (!app.slug.startsWith('e2e-')) continue;
try {
await ctx.delete(
`/api/v1/admin/apps/${encodeURIComponent(app.slug)}?force=true`
);
} catch {
// Individual delete failure is non-fatal — the per-test
// cleanup will catch it on the next run.
}
}
}
} catch {
// Listing failed; nothing to do but proceed.
}
try {
const res = await ctx.get('/api/v1/admin/admins');
if (res.ok()) {
const admins = (await res.json()) as Array<{ id: string; username: string }>;
for (const a of admins) {
if (!/^e2e/.test(a.username)) continue;
try {
await ctx.delete(`/api/v1/admin/admins/${a.id}`);
} catch {
// Same per-row tolerance as above.
}
}
}
} catch {
// Listing failed; same as above.
}
} finally {
await ctx.dispose();
}
}
// The dashboard reads its session from localStorage under the key
// `picloud.admin.token` (see src/lib/auth.ts). We can't write to
// localStorage without a browser context, so launch a throwaway one,
// seed the value, then save storageState for every test to reuse.
async function persistAdminStorageState(token: string): Promise<void> {
const browser = await chromium.launch();
try {
const context = await browser.newContext();
const page = await context.newPage();
await page.goto(`${DASHBOARD_ORIGIN}/admin/login`);
await page.evaluate(
([key, value]) => {
localStorage.setItem(key, value);
},
['picloud.admin.token', token]
);
await context.storageState({ path: ADMIN_STATE_PATH });
} finally {
await browser.close();
}
}

View File

@@ -0,0 +1,155 @@
import { expect, request, type Page } from '@playwright/test';
import { test } from '../fixtures/ids';
import { CleanupRegistry } from '../fixtures/cleanup';
import { adminApi } from '../fixtures/api';
// Full-stack integration scenarios. Unlike the per-page B1B8 specs,
// these drive a complete user journey across multiple pages and then
// verify the data plane / API surface behaves the way the dashboard
// promised it would.
const API_BASE = process.env.E2E_API_BASE ?? 'http://127.0.0.1:18080';
const cleanup = new CleanupRegistry();
test.afterEach(async () => {
await cleanup.run();
});
async function fillCodeMirror(page: Page, locator: string, text: string): Promise<void> {
const cm = page.locator(locator).first();
await cm.click();
await page.keyboard.press('ControlOrMeta+A');
await page.keyboard.press('Delete');
await page.keyboard.type(text);
}
test('end-to-end: app + domain + script + route via dashboard → invoke via public URL', async ({
page,
uniqueSlug
}) => {
const slug = uniqueSlug('public');
const domain = `${slug}.local`;
const routePath = `/${slug}/hello`;
const scriptName = `${slug}-hello`;
const scriptSource = `return #{ statusCode: 200, body: #{ source: "public", slug: "${slug}" } };`;
// 1. Create the app from the apps list.
await page.goto('/admin/apps');
await page.getByRole('button', { name: 'New app' }).click();
await page.getByLabel('Name').fill(slug);
const slugInput = page.getByLabel('Slug');
await slugInput.fill('');
await slugInput.fill(slug);
await page.getByRole('button', { name: 'Create app' }).click();
cleanup.app(slug);
await expect(page.getByRole('link', { name: new RegExp(slug) })).toBeVisible();
// 2. Open the app and claim the domain on the Domains tab.
await page.getByRole('link', { name: new RegExp(slug) }).click();
await expect(page).toHaveURL(new RegExp(`/admin/apps/${slug}$`));
await page.getByRole('button', { name: /^Domains \(\d+\)$/ }).click();
const domainForm = page.locator('form.create-form.inline');
await domainForm.getByPlaceholder(/app\.example\.com/).fill(domain);
await domainForm.getByRole('button', { name: /^Add domain$/ }).click();
await expect(page.locator('.domain-row')).toContainText(domain);
// 3. Create the script on the Scripts tab.
await page.getByRole('button', { name: /^Scripts \(\d+\)$/ }).click();
await page.getByRole('button', { name: /^New script$/ }).click();
await page.getByLabel('Name').fill(scriptName);
await fillCodeMirror(page, '.cm-content', scriptSource);
await page.getByRole('button', { name: /^Create script$/ }).click();
// 4. Open the script and bind a route on the Routing tab.
await page.getByRole('link', { name: new RegExp(scriptName) }).click();
await page.getByRole('button', { name: 'Routing' }).click();
await page.getByRole('button', { name: '+ Add route' }).click();
const routeForm = page.locator('form.route-form');
await routeForm.getByLabel('Path', { exact: true }).fill(routePath);
await routeForm.getByLabel('Method').selectOption('GET');
await routeForm.getByLabel(/^Host/).fill(domain);
await page.getByRole('button', { name: /^Create route$/ }).click();
await expect(page.locator('.route-list')).toContainText(routePath);
// 5. Invoke via the public URL, with the Host header pointing at
// the claimed domain. The dev backend listens on 127.0.0.1; the
// orchestrator resolves the app from Host, then the route.
const publicCtx = await request.newContext({ baseURL: API_BASE });
try {
const res = await publicCtx.get(routePath, { headers: { host: domain } });
expect(res.status()).toBe(200);
const body = (await res.json()) as { source: string; slug: string };
expect(body.source).toBe('public');
expect(body.slug).toBe(slug);
} finally {
await publicCtx.dispose();
}
});
test('api key minted via dashboard works as a CLI bearer, then revoke disables it', async ({
page
}) => {
const name = `e2e-cli-${Date.now()}`;
// 1. Mint the key from /profile and capture the revealed token.
await page.goto('/admin/profile');
await page.getByRole('button', { name: /\+ Mint API key/ }).click();
const mintForm = page.locator('form.mint');
await mintForm.getByPlaceholder('e.g. ci-deploy').fill(name);
// script:read is enough to read the scripts list — that's our
// "CLI verb" below.
await page.locator('label.scope-chip', { hasText: 'script:read' }).click();
await page.getByRole('button', { name: /^Mint key$/ }).click();
const reveal = page.locator('.reveal');
await expect(reveal).toBeVisible();
const rawToken = (await reveal.locator('code.token').textContent())?.trim();
expect(rawToken).toBeTruthy();
await reveal.getByRole('checkbox', { name: /saved this token/i }).check();
await reveal.getByRole('button', { name: /^Done$/ }).click();
// 2. Act like a CLI: call the API directly with Bearer <token>.
const cli = await request.newContext({
baseURL: API_BASE,
extraHTTPHeaders: { authorization: `Bearer ${rawToken}` }
});
try {
const ok = await cli.get('/api/v1/admin/scripts');
expect(ok.status()).toBe(200);
const body = (await ok.json()) as unknown;
expect(Array.isArray(body)).toBe(true);
// Sanity: a route the scope doesn't cover must reject.
// `script:read` cannot list instance admins (that's
// instance:admin territory).
const denied = await cli.get('/api/v1/admin/admins');
expect(denied.status()).toBe(403);
// 3. Revoke via the dashboard.
await page.reload();
const revokeBtn = page.getByRole('button', { name: `Revoke ${name}` });
await expect(revokeBtn).toBeVisible();
await revokeBtn.click();
await page.getByRole('dialog').getByRole('button', { name: /^Revoke$/ }).click();
await expect(revokeBtn).toHaveCount(0);
// 4. Same CLI call must now fail auth.
const afterRevoke = await cli.get('/api/v1/admin/scripts');
expect(afterRevoke.status()).toBe(401);
} finally {
await cli.dispose();
}
// Belt-and-braces cleanup: if the UI revoke missed, drop via API.
const api = await adminApi();
try {
const list = await api.get('/api/v1/admin/api-keys');
if (list.ok()) {
const all = (await list.json()) as Array<{ id: string; name: string }>;
const k = all.find((x) => x.name === name);
if (k) cleanup.apiKey(k.id);
}
} finally {
await api.dispose();
}
});

View File

@@ -0,0 +1,168 @@
import { expect } from '@playwright/test';
import { test } from '../fixtures/ids';
import { CleanupRegistry } from '../fixtures/cleanup';
import { adminApi } from '../fixtures/api';
import { loginAsUserToken, pageWithUserToken } from '../fixtures/role-page';
// Phase B5 — App Members. Setup creates one or two extra admin
// users via the API; tests drive the Members tab through the
// dashboard like a real app admin would.
const cleanup = new CleanupRegistry();
test.afterEach(async () => {
await cleanup.run();
});
async function createApp(slug: string): Promise<string> {
const api = await adminApi();
try {
const res = await api.post('/api/v1/admin/apps', { data: { slug, name: slug } });
expect(res.ok()).toBe(true);
return ((await res.json()) as { id: string }).id;
} finally {
await api.dispose();
}
}
async function createMemberUser(username: string): Promise<string> {
const api = await adminApi();
try {
const res = await api.post('/api/v1/admin/admins', {
data: { username, password: 'e2e-member-pw', instance_role: 'member' }
});
expect(res.ok()).toBe(true);
return ((await res.json()) as { id: string }).id;
} finally {
await api.dispose();
}
}
test.describe('B5 app members', () => {
test('invite a member-role user, then remove them', async ({ page, uniqueSlug, uniqueUsername }) => {
const slug = uniqueSlug('mem');
const username = uniqueUsername('inv');
await createApp(slug);
const userId = await createMemberUser(username);
cleanup.app(slug);
cleanup.adminUser(userId);
await page.goto(`/admin/apps/${slug}`);
await page.getByRole('button', { name: /^Members \(\d+\)$/ }).click();
// Invite. Both selects sit in `form.create-form`; locate them
// by position to avoid getByLabel ambiguity (the Svelte
// markup nests both labels in a flex row, which makes their
// accessible names overlap).
const form = page.locator('form.create-form');
await form.locator('select').nth(0).selectOption({ label: username });
await form.locator('select').nth(1).selectOption('editor');
await page.getByRole('button', { name: /^Add member$/ }).click();
await expect(page.locator('.member-row')).toContainText(username);
// Remove via action menu + confirm modal.
await page.getByRole('button', { name: new RegExp(`Member actions for ${username}`) }).click();
await page.getByRole('menuitem', { name: /^Remove from app$/ }).click();
const dialog = page.getByRole('dialog');
await expect(dialog).toBeVisible();
await dialog.getByRole('button', { name: /^Remove member$/ }).click();
await expect(page.locator('.member-row')).toHaveCount(0);
});
test('role change via action menu updates the role chip', async ({
page,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('mem');
const username = uniqueUsername('role');
await createApp(slug);
const userId = await createMemberUser(username);
cleanup.app(slug);
cleanup.adminUser(userId);
// Seed the membership via API to skip the invite UI.
const api = await adminApi();
try {
const res = await api.post(`/api/v1/admin/apps/${slug}/members`, {
data: { user_id: userId, role: 'viewer' }
});
expect(res.ok()).toBe(true);
} finally {
await api.dispose();
}
await page.goto(`/admin/apps/${slug}`);
await page.getByRole('button', { name: /^Members \(\d+\)$/ }).click();
await page.getByRole('button', { name: new RegExp(`Member actions for ${username}`) }).click();
await page.getByRole('menuitem', { name: /^Make editor$/ }).click();
const row = page.locator('.member-row', { hasText: username });
await expect(row).toContainText(/editor/i);
});
test('non-app-admin viewers do not see the Members tab', async ({
browser,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('mem');
const username = uniqueUsername('viewer');
const password = 'e2e-member-pw';
await createApp(slug);
const userId = await createMemberUser(username);
cleanup.app(slug);
cleanup.adminUser(userId);
// Grant viewer membership (not app_admin) so the user can see
// the app at all.
const api = await adminApi();
try {
const res = await api.post(`/api/v1/admin/apps/${slug}/members`, {
data: { user_id: userId, role: 'viewer' }
});
expect(res.ok()).toBe(true);
} finally {
await api.dispose();
}
const token = await loginAsUserToken(username, password);
const viewerPage = await pageWithUserToken(browser, token);
try {
await viewerPage.goto(`/admin/apps/${slug}`);
// Scripts tab loads — that's what a viewer sees.
await expect(
viewerPage.getByRole('button', { name: /^Scripts \(\d+\)$/ })
).toBeVisible();
// Members tab button is absent for non-app-admins.
await expect(
viewerPage.getByRole('button', { name: /^Members \(\d+\)$/ })
).toHaveCount(0);
} finally {
await viewerPage.context().close();
}
});
});
test.describe('B5 app members adversarial', () => {
test('role dropdown exposes only the documented values', async ({
page,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('mem');
const username = uniqueUsername('rolelist');
await createApp(slug);
const userId = await createMemberUser(username);
cleanup.app(slug);
cleanup.adminUser(userId);
await page.goto(`/admin/apps/${slug}`);
await page.getByRole('button', { name: /^Members \(\d+\)$/ }).click();
const form = page.locator('form.create-form');
const roleSelect = form.locator('select').nth(1);
const optionValues = await roleSelect.evaluate((el: HTMLSelectElement) =>
Array.from(el.options).map((o) => o.value)
);
expect(optionValues.sort()).toEqual(['app_admin', 'editor', 'viewer']);
});
});

View File

@@ -0,0 +1,150 @@
import { expect, type Page } from '@playwright/test';
import { test } from '../fixtures/ids';
import { CleanupRegistry } from '../fixtures/cleanup';
import { adminApi } from '../fixtures/api';
// Phase B7 — Profile + API Keys (/admin/profile). Covers the
// mint/reveal/revoke flow, the app-binding mutual-exclusion guard,
// and adversarial inputs.
const cleanup = new CleanupRegistry();
test.afterEach(async () => {
await cleanup.run();
});
async function createApp(slug: string): Promise<string> {
const api = await adminApi();
try {
const res = await api.post('/api/v1/admin/apps', { data: { slug, name: slug } });
expect(res.ok()).toBe(true);
return ((await res.json()) as { id: string }).id;
} finally {
await api.dispose();
}
}
async function openMintForm(page: Page): Promise<void> {
await page.goto('/admin/profile');
await page.getByRole('button', { name: /\+ Mint API key/ }).click();
}
async function registerKeyCleanupByName(name: string): Promise<void> {
const api = await adminApi();
try {
const res = await api.get('/api/v1/admin/api-keys');
const all = (await res.json()) as Array<{ id: string; name: string }>;
const k = all.find((x) => x.name === name);
if (k) cleanup.apiKey(k.id);
} finally {
await api.dispose();
}
}
test.describe('B7 profile + API keys', () => {
test('mint instance-wide key: reveal → ack → key appears in list', async ({ page }) => {
const name = `e2e-mint-${Date.now()}`;
await openMintForm(page);
await page.locator('form.mint').getByPlaceholder('e.g. ci-deploy').fill(name);
// Pick a non-instance scope so we don't need to worry about
// mutual exclusion here. The scope-chip is a <label> wrapping
// the checkbox — clicking the label toggles it.
await page.locator('label.scope-chip', { hasText: 'script:read' }).click();
await page.getByRole('button', { name: /^Mint key$/ }).click();
const reveal = page.locator('.reveal');
await expect(reveal).toBeVisible();
await expect(reveal.locator('code.token')).toContainText(/\S{16,}/);
await expect(reveal.getByRole('button', { name: /^Done$/ })).toBeDisabled();
await reveal.getByRole('checkbox', { name: /saved this token/i }).check();
await reveal.getByRole('button', { name: /^Done$/ }).click();
await registerKeyCleanupByName(name);
await expect(page.getByText(name)).toBeVisible();
});
test('binding to an app disables instance scopes', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('keyapp');
const appId = await createApp(slug);
cleanup.app(slug);
await openMintForm(page);
// Default binding is Instance-wide — instance scopes are
// enabled.
const instChip = page.locator('label.scope-chip', { hasText: 'instance:admin' });
await expect(instChip).not.toHaveClass(/disabled/);
// Switch binding to the app. The chip becomes disabled.
await page.getByLabel(/Binding/i).selectOption(appId);
await expect(instChip).toHaveClass(/disabled/);
});
test('revoke key removes it from the list', async ({ page }) => {
const name = `e2e-revoke-${Date.now()}`;
// Seed a key via API so the test focuses on the revoke UI.
const api = await adminApi();
try {
const res = await api.post('/api/v1/admin/api-keys', {
data: { name, scopes: ['script:read'] }
});
expect(res.ok()).toBe(true);
const body = (await res.json()) as { id: string };
cleanup.apiKey(body.id);
} finally {
await api.dispose();
}
await page.goto('/admin/profile');
const revokeBtn = page.getByRole('button', { name: `Revoke ${name}` });
await expect(revokeBtn).toBeVisible();
await revokeBtn.click();
const dialog = page.getByRole('dialog');
await dialog.getByRole('button', { name: /^Revoke$/ }).click();
// Assert the row's revoke button is gone (the flash banner
// also mentions the name, so a plain getByText would still
// match — anchor on the row-scoped button instead).
await expect(revokeBtn).toHaveCount(0);
});
test('denied=users banner shows when arriving from the users redirect', async ({ page }) => {
await page.goto('/admin/profile?denied=users');
await expect(page.getByText(/don.?t have access to the Users page/i)).toBeVisible();
});
});
test.describe('B7 profile adversarial', () => {
test('empty name keeps the mint button disabled', async ({ page }) => {
await openMintForm(page);
// Trying to click would HTML5-validate; instead verify the
// button is disabled while name is empty.
await page.locator('label.scope-chip', { hasText: 'script:read' }).click();
await expect(page.getByRole('button', { name: /^Mint key$/ })).toBeDisabled();
});
test('copy-token button copies the full token, not a truncated form', async ({
page,
context
}) => {
// Permission must be granted explicitly; chromium will throw
// otherwise when calling navigator.clipboard.readText().
await context.grantPermissions(['clipboard-read', 'clipboard-write']);
const name = `e2e-copy-${Date.now()}`;
await openMintForm(page);
await page.locator('form.mint').getByPlaceholder('e.g. ci-deploy').fill(name);
await page.locator('label.scope-chip', { hasText: 'script:read' }).click();
await page.getByRole('button', { name: /^Mint key$/ }).click();
const reveal = page.locator('.reveal');
const tokenInDom = await reveal.locator('code.token').textContent();
expect(tokenInDom).toBeTruthy();
await reveal.getByRole('button', { name: /^Copy$/ }).click();
const copied = await page.evaluate(() => navigator.clipboard.readText());
expect(copied).toBe(tokenInDom);
await reveal.getByRole('checkbox', { name: /saved this token/i }).check();
await reveal.getByRole('button', { name: /^Done$/ }).click();
await registerKeyCleanupByName(name);
});
});

View File

@@ -0,0 +1,189 @@
import { expect, type Page } from '@playwright/test';
import { test } from '../fixtures/ids';
import { CleanupRegistry } from '../fixtures/cleanup';
import { adminApi } from '../fixtures/api';
// Phase B4 — Routing tab in the script editor. Add / remove / match
// preview + validation paths (host check, path-kind mismatch, reserved
// prefix, duplicate conflict, adversarial paths).
const HELLO_RHAI = `return #{ statusCode: 200, body: #{ ok: true } };`;
const cleanup = new CleanupRegistry();
test.afterEach(async () => {
await cleanup.run();
});
async function makeAppWithScript(slug: string): Promise<{ appId: string; scriptId: string }> {
const api = await adminApi();
try {
const appRes = await api.post('/api/v1/admin/apps', {
data: { slug, name: slug }
});
expect(appRes.ok()).toBe(true);
const appBody = (await appRes.json()) as { id: string };
const scriptRes = await api.post('/api/v1/admin/scripts', {
data: { app_id: appBody.id, name: 'route-target', source: HELLO_RHAI }
});
expect(scriptRes.ok()).toBe(true);
const scriptBody = (await scriptRes.json()) as { id: string };
return { appId: appBody.id, scriptId: scriptBody.id };
} finally {
await api.dispose();
}
}
async function gotoRoutingTab(page: Page, scriptId: string): Promise<void> {
await page.goto(`/admin/scripts/${scriptId}`);
await page.getByRole('button', { name: 'Routing' }).click();
}
async function addRoute(
page: Page,
opts: { path: string; pathKind?: 'exact' | 'param' | 'prefix'; method?: string; host?: string }
): Promise<void> {
await page.getByRole('button', { name: '+ Add route' }).click();
const form = page.locator('form.route-form');
await form.getByLabel('Path', { exact: true }).fill(opts.path);
if (opts.pathKind) {
await form.getByLabel('Path kind').selectOption(opts.pathKind);
}
if (opts.method !== undefined) {
await form.getByLabel('Method').selectOption(opts.method);
}
if (opts.host !== undefined) {
await form.getByLabel(/^Host/).fill(opts.host);
}
}
test.describe('B4 routing', () => {
test('add route appears in list and matches in the preview', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('addr');
const { scriptId } = await makeAppWithScript(slug);
cleanup.app(slug);
await gotoRoutingTab(page, scriptId);
await addRoute(page, { path: '/greet', method: 'GET' });
await page.getByRole('button', { name: /^Create route$/ }).click();
await expect(page.locator('.route-list')).toContainText('/greet');
// Match preview confirms the route resolves.
await page.getByLabel('URL').fill('http://localhost/greet');
await page.locator('.actions').getByRole('button', { name: 'Match' }).click();
await expect(page.locator('pre.preview')).toContainText('script_id');
});
test('remove route updates the list', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('remr');
const { scriptId } = await makeAppWithScript(slug);
cleanup.app(slug);
await gotoRoutingTab(page, scriptId);
await addRoute(page, { path: '/transient', method: 'GET' });
await page.getByRole('button', { name: /^Create route$/ }).click();
await expect(page.locator('.route-list')).toContainText('/transient');
// removeRoute() uses window.confirm — accept it.
page.once('dialog', (d) => void d.accept());
await page.locator('.route-list').getByRole('button', { name: 'remove' }).click();
await expect(page.locator('.route-list')).toHaveCount(0);
await expect(page.getByText(/no routes yet/i)).toBeVisible();
});
test('duplicate route surfaces a 409 conflict error inline', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('dupr');
const { scriptId } = await makeAppWithScript(slug);
cleanup.app(slug);
await gotoRoutingTab(page, scriptId);
await addRoute(page, { path: '/twice', method: 'GET' });
await page.getByRole('button', { name: /^Create route$/ }).click();
await expect(page.locator('.route-list')).toContainText('/twice');
// Same path + method again — must conflict.
await addRoute(page, { path: '/twice', method: 'GET' });
await page.getByRole('button', { name: /^Create route$/ }).click();
await expect(page.locator('.route-form .error.inline')).toBeVisible();
});
test('path-kind mismatch warns inline when /:name is set to exact', async ({
page,
uniqueSlug
}) => {
const slug = uniqueSlug('mism');
const { scriptId } = await makeAppWithScript(slug);
cleanup.app(slug);
await gotoRoutingTab(page, scriptId);
await page.getByRole('button', { name: '+ Add route' }).click();
await page.getByLabel('Path', { exact: true }).fill('/users/:id');
// Override to a wrong kind — auto-detect would have picked
// `param`; selecting `exact` should fire the warning.
await page.getByLabel('Path kind').selectOption('exact');
await expect(page.locator('.route-form .warning.inline')).toBeVisible();
});
test('host validation warns when the host is not a claimed domain', async ({
page,
uniqueSlug
}) => {
const slug = uniqueSlug('unclaim');
const { scriptId } = await makeAppWithScript(slug);
cleanup.app(slug);
await gotoRoutingTab(page, scriptId);
await page.getByRole('button', { name: '+ Add route' }).click();
await page.getByLabel('Path', { exact: true }).fill('/x');
await page.getByLabel(/^Host/).fill('example.test-not-claimed.local');
// One of the inline warnings is the unclaimed-host explainer.
await expect(page.locator('.route-form .warning.inline').first()).toBeVisible();
});
});
test.describe('B4 routing adversarial', () => {
test('reserved prefix /api/ is rejected with a visible error', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('reserv');
const { scriptId } = await makeAppWithScript(slug);
cleanup.app(slug);
await gotoRoutingTab(page, scriptId);
await addRoute(page, { path: '/api/v9/oops', method: 'GET' });
await page.getByRole('button', { name: /^Create route$/ }).click();
await expect(page.locator('.route-form .error.inline')).toBeVisible();
await expect(page.locator('.route-form .error.inline')).toContainText(
/reserved|api|prefix/i
);
// Empty-state copy renders when no routes exist; the path
// itself must not appear anywhere on the routing tab.
await expect(page.getByText(/no routes yet/i)).toBeVisible();
});
test('xss payload in path stored or rejected — never executes on render', async ({
page,
uniqueSlug
}) => {
page.on('dialog', async (d) => {
await d.dismiss();
throw new Error(`Unexpected dialog: ${d.message()}`);
});
const slug = uniqueSlug('pxss');
const { scriptId } = await makeAppWithScript(slug);
cleanup.app(slug);
await gotoRoutingTab(page, scriptId);
await addRoute(page, {
path: '/<script>alert(1)</script>',
method: 'GET'
});
await page.getByRole('button', { name: /^Create route$/ }).click();
// Either accepted (rendered as text in the list) or rejected
// (error inline). Both fine — what's NOT fine is an alert
// dialog or an injected <script> tag in the list.
const xssScripts = await page.locator('.route-list script:has-text("alert")').count();
expect(xssScripts).toBe(0);
});
});

View File

@@ -0,0 +1,337 @@
import { expect, type Page } from '@playwright/test';
import { test } from '../fixtures/ids';
import { CleanupRegistry } from '../fixtures/cleanup';
import { adminApi } from '../fixtures/api';
import { loginAsUserToken, pageWithUserToken } from '../fixtures/role-page';
const MEMBER_PW = 'e2e-member-pw';
async function seedAppScriptAndMember(opts: {
slug: string;
username: string;
role: 'viewer' | 'editor';
}): Promise<{ scriptId: string; userId: string }> {
const api = await adminApi();
try {
const appRes = await api.post('/api/v1/admin/apps', {
data: { slug: opts.slug, name: opts.slug }
});
expect(appRes.ok()).toBe(true);
const appId = ((await appRes.json()) as { id: string }).id;
const scriptRes = await api.post('/api/v1/admin/scripts', {
data: { app_id: appId, name: `${opts.slug}-sc`, source: HELLO_RHAI }
});
expect(scriptRes.ok()).toBe(true);
const scriptId = ((await scriptRes.json()) as { id: string }).id;
const userRes = await api.post('/api/v1/admin/admins', {
data: { username: opts.username, password: MEMBER_PW, instance_role: 'member' }
});
expect(userRes.ok()).toBe(true);
const userId = ((await userRes.json()) as { id: string }).id;
const memberRes = await api.post(`/api/v1/admin/apps/${opts.slug}/members`, {
data: { user_id: userId, role: opts.role }
});
expect(memberRes.ok()).toBe(true);
return { scriptId, userId };
} finally {
await api.dispose();
}
}
// Phase B3 — Scripts CRUD + Editor. The script editor lives at
// /admin/scripts/{id}. Setup uses the API to create the app (and
// sometimes a baseline script) so each test can focus on the editor
// flow it actually covers.
const HELLO_RHAI = `return #{ statusCode: 200, body: #{ ok: true } };`;
const cleanup = new CleanupRegistry();
test.afterEach(async () => {
await cleanup.run();
});
async function createAppViaApi(slug: string): Promise<string> {
const api = await adminApi();
try {
const res = await api.post('/api/v1/admin/apps', {
data: { slug, name: slug }
});
expect(res.ok()).toBe(true);
const body = (await res.json()) as { id: string };
return body.id;
} finally {
await api.dispose();
}
}
async function createScriptViaApi(
appId: string,
name: string,
source = HELLO_RHAI
): Promise<string> {
const api = await adminApi();
try {
const res = await api.post('/api/v1/admin/scripts', {
data: { app_id: appId, name, source }
});
expect(res.ok()).toBe(true);
const body = (await res.json()) as { id: string };
return body.id;
} finally {
await api.dispose();
}
}
async function fillCodeMirror(page: Page, locator: string, text: string): Promise<void> {
const cm = page.locator(locator).first();
await cm.click();
await page.keyboard.press('ControlOrMeta+A');
await page.keyboard.press('Delete');
await page.keyboard.type(text);
}
test.describe('B3 scripts CRUD', () => {
test('create script via UI navigates to scripts list with the new entry', async ({
page,
uniqueSlug
}) => {
const slug = uniqueSlug('cscr');
await createAppViaApi(slug);
cleanup.app(slug);
await page.goto(`/admin/apps/${slug}`);
await page.getByRole('button', { name: /^New script$/ }).click();
await page.getByLabel('Name').fill('echo');
// The CodeMirror editor starts empty in create mode; type a
// minimal valid script.
await fillCodeMirror(page, '.cm-content', HELLO_RHAI);
await page.getByRole('button', { name: 'Create script' }).click();
await expect(page.getByRole('link', { name: /echo/i })).toBeVisible();
});
test('edit + save Rhai source persists across reload', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('edit');
const appId = await createAppViaApi(slug);
const scriptId = await createScriptViaApi(appId, 'edit-target');
cleanup.app(slug);
await page.goto(`/admin/scripts/${scriptId}`);
await expect(page.locator('.cm-content').first()).toContainText('statusCode');
const updated = `// edited by e2e\nreturn #{ statusCode: 201, body: #{ edited: true } };`;
await fillCodeMirror(page, '.cm-content', updated);
await page.getByRole('button', { name: /^Save$/ }).click();
// Save button becomes disabled once the buffer matches the
// just-saved source — that's our settle signal.
await expect(page.getByRole('button', { name: /^Save$/ })).toBeDisabled();
await page.reload();
await expect(page.locator('.cm-content').first()).toContainText('edited by e2e');
});
test('invalid Rhai source: Format shows a parse error', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('invrhai');
const appId = await createAppViaApi(slug);
const scriptId = await createScriptViaApi(appId, 'bad-syntax');
cleanup.app(slug);
await page.goto(`/admin/scripts/${scriptId}`);
await fillCodeMirror(page, '.cm-content', 'this is not rhai @@@ {{{');
await page
.locator('.editor-header')
.getByRole('button', { name: 'Format' })
.click();
await expect(page.locator('.error.inline').first()).toBeVisible();
});
});
test.describe('B3 test-invoke', () => {
test('valid JSON body returns status + body in the result panel', async ({
page,
uniqueSlug
}) => {
const slug = uniqueSlug('inv-ok');
const appId = await createAppViaApi(slug);
const scriptId = await createScriptViaApi(appId, 'invoke-ok');
cleanup.app(slug);
await page.goto(`/admin/scripts/${scriptId}`);
// Body editor is the second .cm-content (source is first).
const bodyEditor = page.locator('.cm-content').nth(1);
await bodyEditor.click();
await page.keyboard.press('ControlOrMeta+A');
await page.keyboard.press('Delete');
await page.keyboard.type('{"hello":"world"}');
await page.getByRole('button', { name: /^Send$/ }).click();
await expect(page.locator('.status')).toContainText('HTTP 200');
await expect(page.locator('.result pre')).toContainText('ok');
});
test('malformed JSON body: Format surfaces the parse error', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('inv-bad');
const appId = await createAppViaApi(slug);
const scriptId = await createScriptViaApi(appId, 'invoke-bad');
cleanup.app(slug);
await page.goto(`/admin/scripts/${scriptId}`);
const bodyEditor = page.locator('.cm-content').nth(1);
await bodyEditor.click();
await page.keyboard.press('ControlOrMeta+A');
await page.keyboard.press('Delete');
await page.keyboard.type('{not valid json,');
// The Format button for the request body sits inside the
// Test-invoke card next to the body editor.
await page
.locator('.json-block')
.first()
.getByRole('button', { name: 'Format' })
.click();
await expect(page.locator('.error.inline').first()).toBeVisible();
});
});
test.describe('B3 settings', () => {
test('timeout input rejects zero and non-positive values', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('settz');
const appId = await createAppViaApi(slug);
const scriptId = await createScriptViaApi(appId, 'settings-target');
cleanup.app(slug);
await page.goto(`/admin/scripts/${scriptId}`);
await page.getByRole('button', { name: 'Settings' }).click();
const timeout = page.getByLabel(/Timeout/);
await timeout.fill('0');
const invalid = await timeout.evaluate((el: HTMLInputElement) => !el.validity.valid);
expect(invalid).toBe(true);
});
});
test.describe('B3 scripts role shadowing', () => {
test('viewer: no Delete header, no Save/Format on Edit, no Add route on Routing', async ({
browser,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('vscr');
const username = uniqueUsername('viewer');
const { scriptId, userId } = await seedAppScriptAndMember({
slug,
username,
role: 'viewer'
});
cleanup.app(slug);
cleanup.adminUser(userId);
const token = await loginAsUserToken(username, MEMBER_PW);
const page = await pageWithUserToken(browser, token);
try {
await page.goto(`/admin/scripts/${scriptId}`);
// Header Delete is hidden for non-admins.
await expect(page.getByRole('button', { name: /^Delete$/ })).toHaveCount(0);
// Save/Format on the Edit tab are hidden for viewers.
await expect(page.getByRole('button', { name: /^Save$/ })).toHaveCount(0);
await expect(
page.locator('.editor-header').getByRole('button', { name: 'Format' })
).toHaveCount(0);
// Test invoke is still visible (everyone with read access).
await expect(page.getByRole('button', { name: /^Send$/ })).toBeVisible();
// Routing tab loads, no +Add route.
await page.getByRole('button', { name: /Routing/ }).click();
await expect(page.getByRole('button', { name: /\+ Add route/ })).toHaveCount(0);
// Settings tab is absent for non-admins.
await expect(page.getByRole('button', { name: /^Settings$/ })).toHaveCount(0);
} finally {
await page.context().close();
}
});
test('viewer: CodeMirror is read-only', async ({
browser,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('vro');
const username = uniqueUsername('viewer');
const { scriptId, userId } = await seedAppScriptAndMember({
slug,
username,
role: 'viewer'
});
cleanup.app(slug);
cleanup.adminUser(userId);
const token = await loginAsUserToken(username, MEMBER_PW);
const page = await pageWithUserToken(browser, token);
try {
await page.goto(`/admin/scripts/${scriptId}`);
const cm = page.locator('.cm-content').first();
await expect(cm).toBeVisible();
// CodeMirror sets contenteditable=false when EditorView.editable.of(false)
// is in effect; that's the canonical signal for read-only mode.
await expect(cm).toHaveAttribute('contenteditable', 'false');
} finally {
await page.context().close();
}
});
test('editor: Save visible, Delete header hidden', async ({
browser,
uniqueSlug,
uniqueUsername
}) => {
const slug = uniqueSlug('escr');
const username = uniqueUsername('editor');
const { scriptId, userId } = await seedAppScriptAndMember({
slug,
username,
role: 'editor'
});
cleanup.app(slug);
cleanup.adminUser(userId);
const token = await loginAsUserToken(username, MEMBER_PW);
const page = await pageWithUserToken(browser, token);
try {
await page.goto(`/admin/scripts/${scriptId}`);
// Editor sees Save (disabled until the buffer changes — that's fine).
await expect(page.getByRole('button', { name: /^Save$/ })).toBeVisible();
// Delete stays admin-only.
await expect(page.getByRole('button', { name: /^Delete$/ })).toHaveCount(0);
// Settings stays admin-only.
await expect(page.getByRole('button', { name: /^Settings$/ })).toHaveCount(0);
} finally {
await page.context().close();
}
});
});
test.describe('B3 adversarial', () => {
test('infinite loop script hits the sandbox timeout', async ({ page, uniqueSlug }) => {
const slug = uniqueSlug('loop');
const appId = await createAppViaApi(slug);
const scriptId = await createScriptViaApi(
appId,
'inf-loop',
'loop { let x = 1; }'
);
cleanup.app(slug);
await page.goto(`/admin/scripts/${scriptId}`);
await page.getByRole('button', { name: /^Send$/ }).click();
// Either the status renders with a 5xx code, or an error
// banner shows up. Either way, the page recovers.
await Promise.race([
expect(page.locator('.status')).toBeVisible({ timeout: 30_000 }),
expect(page.locator('.error.inline').last()).toBeVisible({ timeout: 30_000 })
]);
// The dashboard must remain interactive after the timeout.
await page.getByRole('button', { name: 'Settings' }).click();
await expect(page.getByLabel(/Timeout/)).toBeVisible();
});
});

View File

@@ -0,0 +1,81 @@
import { expect, test } from '@playwright/test';
// Phase B8 — Cross-cutting security. Things that aren't tied to a
// single page: session handling, secret leakage, error states for
// missing resources, and a sanity check that no XSS sink fires
// anywhere in the dashboard's main authed routes.
const VALID_USERNAME = process.env.E2E_ADMIN_USERNAME ?? 'admin';
const VALID_PASSWORD = process.env.E2E_ADMIN_PASSWORD ?? 'admin';
test.describe('B8 cross-cutting security', () => {
test('expired/stale token: any authed call redirects to /login', async ({ page }) => {
// Replace the storageState token with an obvious garbage
// value; the fetch wrapper treats 401 as "go to /login".
await page.goto('/admin/login');
await page.evaluate(() => {
localStorage.setItem('picloud.admin.token', 'expired-or-bogus-token');
});
await page.goto('/admin/apps');
await expect(page).toHaveURL(/\/admin\/login$/);
});
test('login response cookie is HttpOnly', async ({ request }) => {
const res = await request.post('/api/v1/admin/auth/login', {
data: { username: VALID_USERNAME, password: VALID_PASSWORD },
headers: { 'content-type': 'application/json' }
});
expect(res.ok()).toBe(true);
const headers = res.headers();
const setCookie = headers['set-cookie'];
// Backend may or may not set a cookie (the dashboard primarily
// uses bearer-in-localStorage). If it does, it must be
// HttpOnly so XSS can't exfiltrate it.
if (setCookie) {
expect(setCookie.toLowerCase()).toContain('httponly');
}
});
test('bootstrap password is not present in the DOM after login', async ({ page }) => {
await page.goto('/admin/apps');
const body = await page.locator('body').innerText();
expect(body).not.toContain(VALID_PASSWORD);
});
test('non-existent app slug shows a recoverable error, not a crash', async ({ page }) => {
await page.goto('/admin/apps/does-not-exist-e2e-9999');
// Page must render *something* and the layout must remain
// intact (header link to Apps still works).
await expect(page.getByRole('link', { name: 'Apps' })).toBeVisible();
// And surface the failure to the user — either a "couldn't
// load" message or a "back to apps" link.
const errorOrBack = page.locator('.error, a[href$="/admin/apps"]');
await expect(errorOrBack.first()).toBeVisible();
});
test('xss probe across major surfaces never fires a dialog', async ({ page }) => {
page.on('dialog', async (dialog) => {
await dialog.dismiss();
throw new Error(
`XSS sink fired — got a ${dialog.type()} dialog: "${dialog.message()}"`
);
});
// Cover each main authed route. None should evaluate any
// payload that earlier tests may have stored, and none should
// inject inline <script> tags from server responses.
for (const path of ['/admin/apps', '/admin/profile', '/admin/users']) {
await page.goto(path);
await page.waitForLoadState('domcontentloaded');
const inlineScripts = await page.locator('script[src=""], script:not([src])').count();
// Svelte itself injects no inline <script> in the
// production bundle; vite dev does, but never with
// onerror/alert payload text in them.
const evilInline = await page
.locator('script:has-text("alert"), script:has-text("__xss")')
.count();
expect(evilInline, `evil inline script tag on ${path}`).toBe(0);
expect(inlineScripts).toBeGreaterThanOrEqual(0); // sanity assertion, no crash
}
});
});

View File

@@ -0,0 +1,28 @@
import { expect, test } from '@playwright/test';
import { loginAsAdmin } from './fixtures/auth';
// A1 smoke: prove globalSetup + webServer + fixtures + proxy all work.
test.describe('smoke', () => {
test.describe('unauthenticated', () => {
test.use({ storageState: { cookies: [], origins: [] } });
test('root redirects to login and shows the form', async ({ page }) => {
await page.goto('/admin/');
await expect(page).toHaveURL(/\/admin\/login$/);
await expect(page.getByLabel('Username')).toBeVisible();
await expect(page.getByLabel('Password')).toBeVisible();
await expect(page.getByRole('button', { name: /sign in/i })).toBeVisible();
});
test('valid credentials land on the apps page', async ({ page }) => {
await loginAsAdmin(page);
await expect(page.getByRole('link', { name: 'Apps' })).toBeVisible();
});
});
test('admin storageState already lands on apps', async ({ page }) => {
await page.goto('/admin/');
await expect(page).toHaveURL(/\/admin\/apps$/);
});
});

View File

@@ -0,0 +1,209 @@
import { expect, type Browser, type Page, request } from '@playwright/test';
import { test } from '../fixtures/ids';
import { CleanupRegistry } from '../fixtures/cleanup';
import { adminApi } from '../fixtures/api';
// Phase B6 — Instance Users (/admin/users). Covers the bootstrap
// admin's view of the user directory: invite, edit, deactivate,
// search, delete, plus the member-role redirect and adversarial
// inputs to the invite form.
const API_BASE = process.env.E2E_API_BASE ?? 'http://127.0.0.1:18080';
const cleanup = new CleanupRegistry();
test.afterEach(async () => {
await cleanup.run();
});
async function createMember(username: string, password = 'e2e-member-pw'): Promise<string> {
const api = await adminApi();
try {
const res = await api.post('/api/v1/admin/admins', {
data: { username, password, instance_role: 'member' }
});
expect(res.ok()).toBe(true);
return ((await res.json()) as { id: string }).id;
} finally {
await api.dispose();
}
}
async function loginToken(username: string, password: string): Promise<string> {
const ctx = await request.newContext({ baseURL: API_BASE });
try {
const res = await ctx.post('/api/v1/admin/auth/login', {
data: { username, password },
headers: { 'content-type': 'application/json' }
});
expect(res.ok()).toBe(true);
return ((await res.json()) as { token: string }).token;
} finally {
await ctx.dispose();
}
}
async function pageWithToken(browser: Browser, token: string): Promise<Page> {
const ctx = await browser.newContext({ storageState: undefined });
const page = await ctx.newPage();
await page.goto('/admin/login');
await page.evaluate(
([key, value]) => {
localStorage.setItem(key, value);
},
['picloud.admin.token', token]
);
return page;
}
test.describe('B6 instance users', () => {
test('invite happy path: form → reveal modal → user in list', async ({
page,
uniqueUsername
}) => {
const username = uniqueUsername('inv');
await page.goto('/admin/users');
await page.getByRole('button', { name: '+ Invite user' }).click();
const modal = page.locator('form.modal');
await modal.getByLabel('Username').fill(username);
await modal.getByRole('radio', { name: /^Member/ }).check();
await modal.getByRole('button', { name: /^Create user$/ }).click();
// Reveal modal shows the one-time password.
const reveal = page.locator('.reveal-modal');
await expect(reveal).toBeVisible();
await expect(reveal).toContainText(/User created — /);
await expect(reveal.getByRole('button', { name: /^Done$/ })).toBeDisabled();
await reveal.getByRole('checkbox', { name: /shared this/i }).check();
await reveal.getByRole('button', { name: /^Done$/ }).click();
// Now in the table.
await expect(page.locator('.row:not(.head-row):not(.empty-row)', { hasText: username })).toBeVisible();
// API cleanup — we don't have the user id from the UI alone.
const api = await adminApi();
try {
const list = await api.get('/api/v1/admin/admins');
const all = (await list.json()) as Array<{ id: string; username: string }>;
const u = all.find((x) => x.username === username);
if (u) cleanup.adminUser(u.id);
} finally {
await api.dispose();
}
});
test('username live validation: bad chars → submit disabled', async ({ page }) => {
await page.goto('/admin/users');
await page.getByRole('button', { name: '+ Invite user' }).click();
const modal = page.locator('form.modal');
await modal.getByLabel('Username').fill('UPPER_CASE_invalid');
await expect(modal.locator('small.invalid')).toContainText(/allowed pattern/i);
await modal.getByRole('radio', { name: /^Member/ }).check();
await expect(modal.getByRole('button', { name: /^Create user$/ })).toBeDisabled();
});
test('search filters the table by username', async ({ page, uniqueUsername }) => {
const target = uniqueUsername('hit');
const decoy = uniqueUsername('miss');
const ids = await Promise.all([createMember(target), createMember(decoy)]);
ids.forEach((id) => cleanup.adminUser(id));
await page.goto('/admin/users');
await page.getByPlaceholder(/Search by username/).fill(target);
await expect(page.locator('.row', { hasText: target })).toBeVisible();
await expect(page.locator('.row', { hasText: decoy })).toHaveCount(0);
});
test('deactivate then reactivate toggles the inactive indicator', async ({
page,
uniqueUsername
}) => {
const username = uniqueUsername('toggle');
const userId = await createMember(username);
cleanup.adminUser(userId);
await page.goto('/admin/users');
await page.getByPlaceholder(/Search by username/).fill(username);
const row = page.locator('.row:not(.head-row):not(.empty-row)', { hasText: username });
await expect(row).toBeVisible();
await row.getByRole('button', { name: new RegExp(`User actions for ${username}`) }).click();
await page.getByRole('menuitem', { name: /^Deactivate$/ }).click();
await expect(row).toContainText(/inactive/i);
await row.getByRole('button', { name: new RegExp(`User actions for ${username}`) }).click();
await page.getByRole('menuitem', { name: /^Reactivate$/ }).click();
await expect(row).not.toContainText(/inactive/i);
});
test('delete: wrong phrase keeps disabled, right phrase removes the user', async ({
page,
uniqueUsername
}) => {
const username = uniqueUsername('del');
const userId = await createMember(username);
cleanup.adminUser(userId);
await page.goto('/admin/users');
await page.getByPlaceholder(/Search by username/).fill(username);
const row = page.locator('.row:not(.head-row):not(.empty-row)', { hasText: username });
await row.getByRole('button', { name: new RegExp(`User actions for ${username}`) }).click();
await page.getByRole('menuitem', { name: /^Delete$/ }).click();
const dialog = page.getByRole('dialog');
const confirm = dialog.getByRole('button', { name: /^Delete user$/ });
await expect(confirm).toBeDisabled();
await dialog.getByRole('textbox').fill('not-the-username');
await expect(confirm).toBeDisabled();
await dialog.getByRole('textbox').fill(username);
await expect(confirm).toBeEnabled();
await confirm.click();
await expect(page.locator('.row:not(.head-row):not(.empty-row)', { hasText: username })).toHaveCount(0);
});
test('member-role user visiting /admin/users is bounced to profile with denied banner', async ({
browser,
uniqueUsername
}) => {
const username = uniqueUsername('memvw');
const password = 'e2e-member-pw';
const userId = await createMember(username, password);
cleanup.adminUser(userId);
const token = await loginToken(username, password);
const memberPage = await pageWithToken(browser, token);
try {
await memberPage.goto('/admin/users');
await expect(memberPage).toHaveURL(/\/admin\/profile\?denied=users$/);
await expect(memberPage.getByText(/don.?t have access to the Users page/i)).toBeVisible();
} finally {
await memberPage.context().close();
}
});
});
test.describe('B6 instance users adversarial', () => {
test('username too short: live invalid + submit disabled', async ({ page }) => {
await page.goto('/admin/users');
await page.getByRole('button', { name: '+ Invite user' }).click();
const modal = page.locator('form.modal');
await modal.getByLabel('Username').fill('a'); // 1 char — minimum is 2
await expect(modal.locator('small.invalid')).toBeVisible();
await modal.getByRole('radio', { name: /^Member/ }).check();
await expect(modal.getByRole('button', { name: /^Create user$/ })).toBeDisabled();
});
test('email with script tag fails validation, never executes', async ({ page }) => {
page.on('dialog', async (d) => {
await d.dismiss();
throw new Error(`Unexpected dialog: ${d.message()}`);
});
await page.goto('/admin/users');
await page.getByRole('button', { name: '+ Invite user' }).click();
const modal = page.locator('form.modal');
await modal.getByLabel(/Email/).fill('<script>alert(1)</script>@x');
await expect(modal.locator('small.invalid')).toContainText(/email/i);
});
});

View File

@@ -9,7 +9,7 @@ import { defineConfig } from 'vitest/config';
export default defineConfig({
test: {
include: ['src/lib/rhai/**/*.test.ts'],
include: ['src/lib/**/*.test.ts'],
environment: 'node'
}
});

View File

@@ -1049,7 +1049,7 @@ pub struct Principal {
| Role | Powers |
|---|---|
| `owner` | full instance control, manage other owners, implicit `app_admin` on every app. Multiple owners allowed. |
| `admin` | create apps, invite users, implicit `editor` on every app. Cannot manage instance-wide settings or other owners. |
| `admin` | create apps, invite users, implicit `app_admin` on every app. Cannot manage instance-wide settings (sandbox ceiling, etc.) or other owners. |
| `member` | invited into specific apps only. Cannot create apps, cannot invite. **Strict isolation enforced at SQL** — list endpoints `WHERE app_id IN (SELECT app_id FROM app_members WHERE user_id = $1)`; the API never returns apps a member isn't part of. |
The current Phase 3a `admin_users` rows all become `owner` via `DEFAULT 'owner'` on the new column. Multi-owner installs get a startup `tracing::warn!` listing the active owner usernames so the operator can demote extras via `PATCH /api/v1/admin/admins/{id}`.
@@ -1058,11 +1058,13 @@ The current Phase 3a `admin_users` rows all become `owner` via `DEFAULT 'owner'`
| Role | Grants |
|---|---|
| `app_admin` | settings, domain claims, delete app |
| `editor` | CRUD on scripts, routes, sandbox config |
| `app_admin` | settings, domain claims, delete app, **delete scripts** |
| `editor` | create + edit scripts, routes, sandbox config (no script delete) |
| `viewer` | read scripts + execution logs |
Implicit grants from instance role: every `owner` is `app_admin` on every app; every `admin` is `editor` on every app. Explicit `app_members` rows are the only path for `member` users.
Implicit grants from instance role: every `owner` and every `admin` is `app_admin` on every app — a single-human install would otherwise have to add itself to each new app's `app_members`. Explicit `app_members` rows are the only path for `member` users.
Script **save** uses `AppWriteScript` (editor+); script **delete** uses `AppAdmin` (app_admin+). Editors can iterate on a script's source freely but cannot remove it — destructive cleanup stays with the role that also owns the app.
### Auth Methods — Same Principal, Different Extractor