add woodpecker release job [skip ci]

Reviewed-on: #1
Co-authored-by: Simon Bernier St-Pierre <git.sbstp.ca@gmail.com>

.gitignore

@@ -3,3 +3,7 @@
 /sustenance.db*
 /.env
 /seed.json
+/e2e/node_modules/
+/e2e/test-results/
+/e2e/playwright-report/
+/test-results/

.woodpecker/e2e.yml

@@ -0,0 +1,17 @@
+when:
+  event: [push, pull_request]
+
+steps:
+  e2e-build:
+    image: rust:1
+    commands:
+      - cargo build
+
+  e2e-test:
+    image: node:24
+    directory: e2e
+    commands:
+      - apt-get update
+      - apt-get install -y --no-install-recommends ca-certificates fonts-liberation libasound2 libatk-bridge2.0-0 libatk1.0-0 libcups2 libdbus-1-3 libdrm2 libgbm1 libglib2.0-0 libgtk-3-0 libnspr4 libnss3 libpango-1.0-0 libx11-6 libxcb1 libxcomposite1 libxdamage1 libxext6 libxfixes3 libxkbcommon0 libxrandr2 xdg-utils
+      - npm install && npx playwright install chromium
+      - npx playwright test

.woodpecker/fmt.yml

@@ -0,0 +1,9 @@
+when:
+  event: [push, pull_request]
+
+steps:
+  fmt:
+    image: rust:1
+    commands:
+      - rustup component add rustfmt
+      - cargo fmt --all -- --check

.woodpecker/release.yml

@@ -0,0 +1,17 @@
+when:
+  - event: tag
+
+steps:
+  build:
+    image: rust:1
+    commands:
+      - cargo run --release
+
+  publish:
+    image: alpine:3.23
+    commands:
+      - apk add --no-cache nodejs
+      - node ci/release.js target/release/sustenance
+    environment:
+      GITEA_RELEASE_TOKEN:
+        from_secret: gitea_release_token

.woodpecker/test.yml

@@ -0,0 +1,8 @@
+when:
+  event: [push, pull_request]
+
+steps:
+  test:
+    image: rust:1
+    commands:
+      - cargo test --all

Cargo.lock

@@ -68,7 +68,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "31b698c5f9a010f6573133b09e0de5408834d0c82f8d7475a89fc1867a71cd90"
 dependencies = [
  "axum-core",
- "base64",
+ "base64 0.22.1",
  "bytes",
  "form_urlencoded",
  "futures-util",
@@ -116,6 +116,12 @@ dependencies = [
  "tracing",
 ]
 
+[[package]]
+name = "base64"
+version = "0.13.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "9e1b586273c5702936fe7b7d6896644d8be71e6314cfe09d3167c95f712589e8"
+
 [[package]]
 name = "base64"
 version = "0.22.1"
@@ -315,6 +321,21 @@ version = "0.1.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "d9c4f5dac5e15c24eb999c26181a6ca40b39fe946cbe4c263c7209467bc83af2"
 
+[[package]]
+name = "foreign-types"
+version = "0.3.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f6f339eb8adc052cd2ca78910fda869aefa38d22d5cb648e6485e4d3fc06f3b1"
+dependencies = [
+ "foreign-types-shared",
+]
+
+[[package]]
+name = "foreign-types-shared"
+version = "0.1.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "00b0228411908ca8685dba7fc2cdd70ec9990a6e753e89b6ac91a84c40fbaf4b"
+
 [[package]]
 name = "form_urlencoded"
 version = "1.2.2"
@@ -449,6 +470,12 @@ dependencies = [
  "wasip2",
 ]
 
+[[package]]
+name = "half"
+version = "1.8.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "1b43ede17f21864e81be2fa654110bf1e793774238d86ef8555c37e6519c0403"
+
 [[package]]
 name = "hashbrown"
 version = "0.15.5"
@@ -795,6 +822,12 @@ dependencies = [
  "unicase",
 ]
 
+[[package]]
+name = "minimal-lexical"
+version = "0.2.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "68354c5c6bd36d73ff3feceb05efa59b6acb7626617f4962be322a825e61f79a"
+
 [[package]]
 name = "mio"
 version = "1.2.2"
@@ -806,6 +839,16 @@ dependencies = [
  "windows-sys 0.61.2",
 ]
 
+[[package]]
+name = "nom"
+version = "7.1.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "d273983c5a657a70a3e8f2a01329822f3b8c8172b73826411a55751e404a0a4a"
+dependencies = [
+ "memchr",
+ "minimal-lexical",
+]
+
 [[package]]
 name = "nu-ansi-term"
 version = "0.50.3"
@@ -830,6 +873,43 @@ version = "1.21.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "9f7c3e4beb33f85d45ae3e3a1792185706c8e16d043238c593331cc7cd313b50"
 
+[[package]]
+name = "openssl"
+version = "0.10.81"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "77823a27f0babb03091cb9ed9ef80af3b39dbc82f97e8fa530374b7dafd87a45"
+dependencies = [
+ "bitflags",
+ "cfg-if",
+ "foreign-types",
+ "libc",
+ "openssl-macros",
+ "openssl-sys",
+]
+
+[[package]]
+name = "openssl-macros"
+version = "0.1.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a948666b637a0f465e8564c73e89d4dde00d72d4d473cc972f390fc3dcee7d9c"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "syn 2.0.119",
+]
+
+[[package]]
+name = "openssl-sys"
+version = "0.9.117"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b47e7e6bb2c38cd930d25a23b40fa52e068c10e85f3e03a7f5ba5aaca5713695"
+dependencies = [
+ "cc",
+ "libc",
+ "pkg-config",
+ "vcpkg",
+]
+
 [[package]]
 name = "parking"
 version = "2.2.1"
@@ -1116,6 +1196,16 @@ dependencies = [
  "serde_derive",
 ]
 
+[[package]]
+name = "serde_cbor"
+version = "0.11.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "2bef2ebfde456fb76bbcf9f59315333decc4fda0b2b44b420243c11e0f5ec1f5"
+dependencies = [
+ "half",
+ "serde",
+]
+
 [[package]]
 name = "serde_core"
 version = "1.0.229"
@@ -1267,7 +1357,7 @@ version = "0.8.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "ee6798b1838b6a0f69c007c133b8df5866302197e404e8b6ee8ed3e3a5e68dc6"
 dependencies = [
- "base64",
+ "base64 0.22.1",
  "bytes",
  "crc",
  "crossbeam-queue",
@@ -1288,7 +1378,7 @@ dependencies = [
  "serde",
  "sha2",
  "smallvec",
- "thiserror",
+ "thiserror 2.0.19",
  "tokio",
  "tokio-stream",
  "tracing",
@@ -1351,7 +1441,7 @@ dependencies = [
  "serde",
  "serde_urlencoded",
  "sqlx-core",
- "thiserror",
+ "thiserror 2.0.19",
  "tracing",
  "url",
 ]
@@ -1375,6 +1465,7 @@ dependencies = [
  "argon2",
  "async-trait",
  "axum",
+ "base64 0.22.1",
  "futures-util",
  "hex",
  "maud",
@@ -1384,12 +1475,14 @@ dependencies = [
  "serde_json",
  "sha2",
  "sqlx",
- "thiserror",
+ "thiserror 2.0.19",
  "tokio",
  "tower",
  "tower-http",
  "tracing",
  "tracing-subscriber",
+ "url",
+ "webauthn-rs",
 ]
 
 [[package]]
@@ -1431,13 +1524,33 @@ dependencies = [
  "syn 2.0.119",
 ]
 
+[[package]]
+name = "thiserror"
+version = "1.0.69"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b6aaf5339b578ea85b50e080feb250a3e8ae8cfcdff9a461c9ec2904bc923f52"
+dependencies = [
+ "thiserror-impl 1.0.69",
+]
+
 [[package]]
 name = "thiserror"
 version = "2.0.19"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "09a43598840e33d5b0331f38c5e30d13bb11c11210a4b58f0d9b18a5a5eefcd9"
 dependencies = [
- "thiserror-impl",
+ "thiserror-impl 2.0.19",
+]
+
+[[package]]
+name = "thiserror-impl"
+version = "1.0.69"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "4fee6c4efc90059e10f81e6d42c60a18f76588c3d74cb83a0b242a2b6c7504c1"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "syn 2.0.119",
 ]
 
 [[package]]
@@ -1663,7 +1776,7 @@ dependencies = [
  "log",
  "rand 0.9.5",
  "sha1",
- "thiserror",
+ "thiserror 2.0.19",
 ]
 
 [[package]]
@@ -1706,6 +1819,7 @@ dependencies = [
  "idna",
  "percent-encoding",
  "serde",
+ "serde_derive",
 ]
 
 [[package]]
@@ -1747,6 +1861,25 @@ dependencies = [
  "wit-bindgen",
 ]
 
+[[package]]
+name = "webauthn-rs"
+version = "0.3.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "90b266eccb4b32595876f5c73ea443b0516da0b1df72ca07bc08ed9ba7f96ec1"
+dependencies = [
+ "base64 0.13.1",
+ "nom",
+ "openssl",
+ "rand 0.8.7",
+ "serde",
+ "serde_cbor",
+ "serde_derive",
+ "serde_json",
+ "thiserror 1.0.69",
+ "tracing",
+ "url",
+]
+
 [[package]]
 name = "webpki-roots"
 version = "0.26.11"

Cargo.toml

@@ -7,6 +7,7 @@ edition = "2024"
 argon2 = "0.5"
 async-trait = "0.1"
 axum = { version = "0.8", features = ["ws"] }
+base64 = "0.22"
 futures-util = "0.3"
 hex = "0.4"
 maud = "0.27"
@@ -22,3 +23,11 @@ tower = "0.5"
 tower-http = { version = "0.6", features = ["fs", "trace", "set-header"] }
 tracing = "0.1"
 tracing-subscriber = { version = "0.3", features = ["env-filter"] }
+url = "2"
+webauthn-rs = "0.3"
+
+[profile.release]
+opt-level = "z"
+strip = true
+lto = true
+codegen-units = 1

README.md

@@ -8,7 +8,13 @@ A small shared grocery list built with Rust, Axum, Maud, htmx, WebSockets, and S
 cargo run
 ```
 
-Open <http://127.0.0.1:3000>. The application creates `sustenance.db` in the working directory on first start.
+Open <http://localhost:3000>. The application creates `sustenance.db` in the
+working directory on first start.
+
+**Note:** use `localhost` (not `127.0.0.1`) when testing passkeys locally —
+browsers reject IP addresses as WebAuthn RP IDs. The app defaults to
+`localhost` for loopback hosts, so passkeys work out of the box when you access
+the site via `http://localhost:3000`.
 
 ## Configuration
 
@@ -20,7 +26,9 @@ Open <http://127.0.0.1:3000>. The application creates `sustenance.db` in the wor
 | `COOKIE_SECURE` | `false` | Add the `Secure` attribute to session cookies |
 | `REGISTRATION_MODE` | `invite_only` | Use `open` for local development; otherwise registration requires a valid list invitation after the first account |
 | `SEED_CONFIG` | `seed.json` | Optional JSON file with a default user to create when the database is first initialized |
-| `RUST_LOG` | `sustenance=debug,tower_http=info` | Log filter |
+| `RP_ID` | derived from `PUBLIC_BASE_URL` | WebAuthn relying party ID (the host users access the site from) |
+| `RP_NAME` | `Sustenance` | WebAuthn relying party name shown to users |
+| `RUST_LOG` | `sustenance=info,tower_http=info` | Log filter; HTTP requests are logged at info level |
 
 ### Seeding a default user
 
@@ -41,6 +49,7 @@ The file is optional — if it is missing or invalid, seeding is silently skippe
 ## Current features
 
 - Email/password accounts with Argon2 password hashes
+- Optional WebAuthn passkeys for passwordless sign-in (managed from the account page)
 - Cookie-backed sessions and CSRF tokens for list mutations
 - Shared lists with one-time, seven-day invitation links
 - Invite-only registration by default after the first account
@@ -62,3 +71,23 @@ cargo fmt --all -- --check
 cargo check
 cargo test
 ```
+
+### End-to-end tests (Playwright)
+
+The e2e tests live in `e2e/` and use Playwright with a real browser. Each test
+starts its own server against a fresh, throwaway database on a unique port, so
+tests are fully isolated from each other and from your real `sustenance.db`.
+
+The tests launch `target/debug/sustenance`, so build the server first:
+
+```sh
+# one-time setup
+cargo build
+cd e2e
+npm install
+npx playwright install chromium
+
+# run the tests (each test launches its own server against a fresh DB)
+cd e2e
+npx playwright test
+```

ci/release.js

@@ -0,0 +1,91 @@
+import * as fs from 'node:fs/promises';
+import { basename } from 'node:path';
+
+function getEnv(name) {
+    const val = process.env[name];
+    if (!val) {
+        throw new Error(`Environment variable ${name} is empty`);
+    }
+    return val;
+}
+
+async function fetchJSON(url, options) {
+    const resp = await fetch(url, options);
+    if (!resp.ok) {
+        throw new Error(`Unexpected HTTP status: ${resp.status}`, {
+            cause: {
+                status: resp.status,
+                body: await resp.text(),
+            },
+        });
+    }
+    return await resp.json();
+}
+
+async function postJSON(url, token, payload) {
+    return fetchJSON(url, {
+        method: "POST",
+        headers: {
+            "Authorization": `token ${token}`,
+            "Content-Type": "application/json",
+        },
+        body: JSON.stringify(payload),
+    });
+}
+
+async function postFile(url, token, files) {
+    const formData = new FormData();
+    for (const [name, path] of Object.entries(files)) {
+        const fileBuffer = await fs.readFile(path);
+        const fileObject = new File([fileBuffer], basename(path), { type: 'application/octet-stream' });
+        formData.append(name, fileObject)
+    }
+    return await fetchJSON(url, {
+        method: "POST",
+        headers: {
+            "Authorization": `token ${token}`,
+        },
+        body: formData,
+    });
+}
+
+async function canRead(path) {
+    try {
+        await fs.access(path, fs.constants.R_OK);
+        return true;
+    } catch {
+        return false;
+    }
+}
+
+async function main() {
+    const path = process.argv[2];
+    if (!path || !canRead(path)) {
+        throw Error(`Path ${path} is undefined or inaccessible, use node release.js <path>`);
+    }
+    const token = getEnv("GITEA_RELEASE_TOKEN");
+    const tag = getEnv("CI_COMMIT_TAG");
+    const repo = getEnv("CI_REPO");
+
+    console.log("Creating release...");
+    const releaseData = await postJSON(`https://git.sbstp.ca/api/v1/repos/${repo}/releases`, token, {
+        name: `Release ${tag}`,
+        tag_name: tag,
+        target_commitish: tag,
+        draft: false,
+        prerelease: false,
+    });
+    console.log(`Created release ID ${releaseData.id}`);
+
+    console.log("Uploading asset...");
+    const assetData = await postFile(`https://git.sbstp.ca/api/v1/repos/${repo}/releases/${releaseData.id}/assets?name=${basename(path)}`, token, {
+        attachment: path,
+    });
+    console.log("Asset uploaded:", assetData);
+}
+
+try {
+    await main();
+} catch (err) {
+    console.error(err);
+}

e2e/fixtures.ts

@@ -0,0 +1,126 @@
+import { test as base, expect, Page } from "@playwright/test";
+import { spawn, ChildProcess } from "child_process";
+import * as fs from "fs";
+import * as os from "os";
+import * as path from "path";
+
+/**
+ * Starts a fresh Sustenance server against a unique, throwaway database on a
+ * unique port for each test, and tears it down afterwards. This gives every
+ * test a clean DB with no shared state between tests.
+ */
+export const test = base.extend<{ server: { baseURL: string }; page: Page }>({
+  server: [
+    async ({}, use) => {
+      const server = await startServer();
+      await use({ baseURL: server.baseURL });
+      await killTree(server.child);
+      // Clean up the DB files (including -wal / -shm).
+      for (const suffix of ["", "-wal", "-shm"]) {
+        fs.rmSync(server.dbPath + suffix, { force: true });
+      }
+    },
+    { scope: "test", auto: true },
+  ],
+
+  // Provide a page whose baseURL points at this test's server.
+  page: async ({ browser, server }, use) => {
+    const context = await browser.newContext({ baseURL: server.baseURL });
+    const page = await context.newPage();
+    await use(page);
+    await context.close();
+  },
+});
+
+/** Starts a server, retrying on a fresh port if the first attempt fails to bind. */
+async function startServer() {
+  for (let attempt = 0; attempt < 5; attempt++) {
+    const dbPath = path.join(
+      os.tmpdir(),
+      `sustenance-e2e-${process.pid}-${Date.now()}-${Math.random()
+        .toString(36)
+        .slice(2)}.db`,
+    );
+    const port = 20000 + Math.floor(Math.random() * 30000);
+    const baseURL = `http://localhost:${port}`;
+
+    const child = spawn(
+      path.resolve(__dirname, "..", "target", "debug", "sustenance"),
+      [],
+      {
+        env: {
+          ...process.env,
+          DATABASE_PATH: dbPath,
+          REGISTRATION_MODE: "open",
+          BIND_ADDRESS: `127.0.0.1:${port}`,
+          PUBLIC_BASE_URL: baseURL,
+          // WebAuthn requires a valid domain for the RP ID; localhost is allowed.
+          RP_ID: "localhost",
+          // Point SEED_CONFIG at a nonexistent file so no default user is created.
+          SEED_CONFIG: path.join(os.tmpdir(), "sustenance-e2e-no-seed.json"),
+        },
+        stdio: ["ignore", "ignore", "pipe"],
+        // Run in its own process group so we can kill the whole tree.
+        detached: true,
+      },
+    );
+
+    let stderr = "";
+    child.stderr?.on("data", (chunk) => {
+      stderr += chunk.toString();
+    });
+
+    try {
+      await waitForServer(baseURL, child);
+      return { baseURL, child, dbPath };
+    } catch (error) {
+      // The server may have failed to bind (port collision). Clean up and retry.
+      await killTree(child);
+      for (const suffix of ["", "-wal", "-shm"]) {
+        fs.rmSync(dbPath + suffix, { force: true });
+      }
+      if (attempt === 4) {
+        throw new Error(
+          `server failed to start after retries; last stderr:\n${stderr}\n${error}`,
+        );
+      }
+    }
+  }
+  throw new Error("unreachable");
+}
+
+async function waitForServer(baseURL: string, child: ChildProcess) {
+  const deadline = Date.now() + 60_000;
+  while (Date.now() < deadline) {
+    if (child.exitCode !== null) {
+      throw new Error(`server exited early with code ${child.exitCode}`);
+    }
+    try {
+      const res = await fetch(baseURL + "/login");
+      if (res.ok) return;
+    } catch {
+      // not up yet
+    }
+    await new Promise((r) => setTimeout(r, 200));
+  }
+  throw new Error("timed out waiting for server to start");
+}
+
+async function killTree(child: ChildProcess) {
+  try {
+    process.kill(-child.pid!, "SIGTERM");
+  } catch {
+    child.kill("SIGTERM");
+  }
+  // Give it a moment to shut down gracefully, then force-kill if needed.
+  const exited = new Promise((resolve) => child.once("exit", resolve));
+  const timeout = new Promise((resolve) => setTimeout(resolve, 5000));
+  await Promise.race([exited, timeout]);
+  try {
+    process.kill(-child.pid!, "SIGKILL");
+  } catch {
+    /* already gone */
+  }
+}
+
+export { expect };

e2e/helpers.ts

@@ -0,0 +1,60 @@
+import { Page, expect } from "@playwright/test";
+
+/** Registers a fresh account and lands on the lists page. */
+export async function registerAndLogin(page: Page, email: string) {
+  await page.goto("/register");
+  await page.fill("#display-name", "Test User");
+  await page.fill("#email", email);
+  await page.fill("#password", "a-strong-password");
+  await page.click('button[type="submit"]');
+  await expect(page).toHaveURL(/\/lists/);
+}
+
+/** Creates a meal with the given name and markdown description. */
+export async function createMeal(page: Page, name: string, description: string) {
+  await page.goto("/meals/new");
+  await page.fill("#meal-name", name);
+  await page.fill("#meal-description", description);
+  await page.click('button:has-text("Save meal")');
+  await expect(page).toHaveURL(/\/meals\/\d+/);
+}
+
+/** Creates a list and lands on its page. */
+export async function createList(page: Page, name: string) {
+  await page.goto("/lists");
+  await page.fill("#list-name", name);
+  await page.click('button:has-text("Create list")');
+  await expect(page).toHaveURL(/\/lists\/\d+/);
+}
+
+/** Adds an item to the current list page. */
+export async function addItem(page: Page, name: string, quantity = "") {
+  await page.fill("#item-name", name);
+  if (quantity) {
+    await page.fill("#item-quantity", quantity);
+  }
+  await page.click("#add-item-button");
+  await expect(page.locator(".item-row").filter({ hasText: name })).toBeVisible();
+}
+
+/** Adds an ingredient to the current meal page. */
+export async function addIngredient(page: Page, name: string, quantity = "") {
+  await page.fill("#ingredient-name", name);
+  if (quantity) {
+    await page.fill("#ingredient-quantity", quantity);
+  }
+  await page.click("#add-ingredient-button");
+  await expect(page.locator(".ingredient-list").filter({ hasText: name })).toBeVisible();
+}
+
+/** Creates a meal and adds the given ingredients to it. */
+export async function createMealWithIngredients(
+  page: Page,
+  name: string,
+  ingredients: Array<{ name: string; quantity?: string }>,
+) {
+  await createMeal(page, name, "");
+  for (const ingredient of ingredients) {
+    await addIngredient(page, ingredient.name, ingredient.quantity ?? "");
+  }
+}

e2e/package-lock.json

@@ -0,0 +1,90 @@
+{
+  "name": "sustenance-e2e",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "sustenance-e2e",
+      "version": "1.0.0",
+      "devDependencies": {
+        "@playwright/test": "^1.45.0",
+        "@types/node": "^26.1.2"
+      }
+    },
+    "node_modules/@playwright/test": {
+      "version": "1.62.1",
+      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.62.1.tgz",
+      "integrity": "sha512-DTcUc8qii+cpHvtOwggMtBRMjKZHXYWdw8syRYu2vtzuq4Wxphqq4NfCs5Zt44L6mA8rfDfj+PHnxFc/FeK6mQ==",
+      "dev": true,
+      "dependencies": {
+        "playwright": "1.62.1"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/@types/node": {
+      "version": "26.1.2",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-26.1.2.tgz",
+      "integrity": "sha512-Vu4a5UFA9rIIFJ7rB/Vaafh9lrCQszopTCx6KjFboXTGQbPNasehVR5TEiithSDGyd1DEiUByggTZsg8jukeIg==",
+      "dev": true,
+      "dependencies": {
+        "undici-types": "~8.3.0"
+      }
+    },
+    "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,
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/playwright": {
+      "version": "1.62.1",
+      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.62.1.tgz",
+      "integrity": "sha512-0M+L3LAD8/nm554LOla9Ayx0j0tmFZ0FBcoQ7F1VuVHpM/XpiC8RcDzBQB8W5+hA8L22THxELzeF+2WcUzvcLg==",
+      "dev": true,
+      "dependencies": {
+        "playwright-core": "1.62.1"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "optionalDependencies": {
+        "fsevents": "2.3.2"
+      }
+    },
+    "node_modules/playwright-core": {
+      "version": "1.62.1",
+      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.62.1.tgz",
+      "integrity": "sha512-wPYSwEBJY9GHraISXqyqtx0na0LpO3XEX7jNDhntbex7tzUS7kLnZsOlFruFJB4Hi/rhDMjXGqHewDZ68nYZVw==",
+      "dev": true,
+      "bin": {
+        "playwright-core": "cli.js"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/undici-types": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-8.3.0.tgz",
+      "integrity": "sha512-j375ScV60dom+YkPFIfTLcOiPxkN/buHz5GobjLhixFuANaNs3C9l4GmrWqejgXWJ7BbJcFYpTEUkS1Ge8bpZQ==",
+      "dev": true
+    }
+  }
+}

e2e/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "sustenance-e2e",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "test": "playwright test",
+    "test:headed": "playwright test --headed"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.45.0",
+    "@types/node": "^26.1.2"
+  }
+}

e2e/playwright.config.ts

@@ -0,0 +1,10 @@
+import { defineConfig } from "@playwright/test";
+
+export default defineConfig({
+  testDir: "./tests",
+  timeout: 30_000,
+  retries: 2,
+  use: {
+    trace: "on-first-retry",
+  },
+});

e2e/tests/add-meal.spec.ts

@@ -0,0 +1,54 @@
+import { expect } from "@playwright/test";
+import { test } from "../fixtures";
+import { registerAndLogin, createList, createMealWithIngredients } from "../helpers";
+
+test("a user can add a meal's ingredients to a list via the picker", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMealWithIngredients(page, "Spaghetti Bolognese", [
+    { name: "Penne", quantity: "500g" },
+    { name: "Tomato", quantity: "2" },
+  ]);
+  await createList(page, "Weekly shop");
+
+  // Open the add-meal picker.
+  await page.click(".add-meal-button");
+  const picker = page.locator(".meal-picker-backdrop");
+  await expect(picker).toBeVisible();
+  await expect(picker.locator(".meal-picker-button").filter({ hasText: "Spaghetti Bolognese" })).toBeVisible();
+
+  // Select the meal.
+  await picker.locator(".meal-picker-button").filter({ hasText: "Spaghetti Bolognese" }).click();
+
+  // The picker closes and the meal's ingredients appear as items.
+  await expect(picker).toHaveCount(0);
+  await expect(page.locator(".item-row").filter({ hasText: "Penne" })).toBeVisible();
+  await expect(page.locator(".item-row").filter({ hasText: "Tomato" })).toBeVisible();
+  await expect(page.locator(".item-row").filter({ hasText: "Penne" }).locator(".item-qty")).toHaveText("(500g)");
+});
+
+test("the add-meal picker closes via the close button", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMealWithIngredients(page, "Spaghetti Bolognese", [{ name: "Penne" }]);
+  await createList(page, "Weekly shop");
+
+  await page.click(".add-meal-button");
+  const picker = page.locator(".meal-picker-backdrop");
+  await expect(picker).toBeVisible();
+
+  await picker.locator(".meal-picker-close").click();
+  await expect(picker).toHaveCount(0);
+});
+
+test("the add-meal picker closes when clicking outside", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMealWithIngredients(page, "Spaghetti Bolognese", [{ name: "Penne" }]);
+  await createList(page, "Weekly shop");
+
+  await page.click(".add-meal-button");
+  const picker = page.locator(".meal-picker-backdrop");
+  await expect(picker).toBeVisible();
+
+  // Click the backdrop itself (outside the modal card), at the viewport corner.
+  await page.mouse.click(10, 10);
+  await expect(picker).toHaveCount(0);
+});

e2e/tests/auth.spec.ts

@@ -0,0 +1,15 @@
+import { expect } from "@playwright/test";
+import { test } from "../fixtures";
+import { registerAndLogin } from "../helpers";
+
+test("a user can register and log in", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await expect(page.locator("h1")).toContainText("Grocery lists");
+});
+
+test("a user can log out", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await page.click('button:has-text("Sign out")');
+  await expect(page).toHaveURL(/\/login/);
+  await expect(page.locator("h1")).toContainText("Welcome back");
+});

e2e/tests/lists.spec.ts

@@ -0,0 +1,91 @@
+import { expect } from "@playwright/test";
+import { test } from "../fixtures";
+import { registerAndLogin, createList, addItem } from "../helpers";
+
+test("a user can create a list", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+
+  await createList(page, "Weekly shop");
+
+  await expect(page.locator("h1")).toContainText("Weekly shop");
+  await expect(page.locator(".empty-items")).toBeVisible();
+});
+
+test("a user can add an item with a quantity", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createList(page, "Weekly shop");
+
+  await addItem(page, "Apple", "2");
+
+  // Quantity renders in parens to the left of the name.
+  const row = page.locator(".item-row").filter({ hasText: "Apple" });
+  await expect(row.locator(".item-qty")).toHaveText("(2)");
+  await expect(row.locator("strong")).toHaveText("Apple");
+});
+
+test("a user can check off an item", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createList(page, "Weekly shop");
+  await addItem(page, "Apple");
+
+  const row = page.locator(".item-row").filter({ hasText: "Apple" });
+  await row.locator(".check-button").click();
+
+  await expect(row).toHaveClass(/is-checked/);
+});
+
+test("clicking an item's text toggles the checkbox", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createList(page, "Weekly shop");
+  await addItem(page, "Apple");
+
+  const row = page.locator(".item-row").filter({ hasText: "Apple" });
+  await row.locator(".item-copy").click();
+
+  await expect(row).toHaveClass(/is-checked/);
+});
+
+test("a user can edit an item via the actions modal", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createList(page, "Weekly shop");
+  await addItem(page, "Apple", "2");
+
+  const row = page.locator(".item-row").filter({ hasText: "Apple" });
+  await row.locator(".item-actions-button").click();
+
+  const dialog = row.locator("dialog.item-modal");
+  await expect(dialog).toBeVisible();
+  await dialog.locator('[id^="item-edit-name"]').fill("Banana");
+  await dialog.locator('[id^="item-edit-quantity"]').fill("6");
+  await dialog.locator('[id^="item-edit-save"]').click();
+
+  const updated = page.locator(".item-row").filter({ hasText: "Banana" });
+  await expect(updated).toBeVisible();
+  await expect(updated.locator(".item-qty")).toHaveText("(6)");
+});
+
+test("a user can delete an item via the actions modal", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createList(page, "Weekly shop");
+  await addItem(page, "Apple");
+
+  const row = page.locator(".item-row").filter({ hasText: "Apple" });
+  await row.locator(".item-actions-button").click();
+
+  const dialog = row.locator("dialog.item-modal");
+  await expect(dialog).toBeVisible();
+  await dialog.locator('[id^="item-edit-delete"]').click();
+
+  await expect(page.locator(".item-row").filter({ hasText: "Apple" })).toHaveCount(0);
+  await expect(page.locator(".empty-items")).toBeVisible();
+});
+
+test("a user can add a category", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createList(page, "Weekly shop");
+
+  await page.fill("#category-name", "Bakery");
+  await page.click("#add-category-button");
+
+  await expect(page.locator(".category-chip").filter({ hasText: "Bakery" })).toBeVisible();
+});

e2e/tests/meals.spec.ts

@@ -0,0 +1,88 @@
+import { expect } from "@playwright/test";
+import { test } from "../fixtures";
+import { registerAndLogin, createMeal, addIngredient } from "../helpers";
+
+test("a user can add an ingredient to a meal", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMeal(page, "Spaghetti Bolognese", "");
+
+  await addIngredient(page, "Penne", "500g");
+
+  const row = page.locator(".ingredient-list").filter({ hasText: "Penne" });
+  await expect(row.locator(".item-qty")).toHaveText("(500g)");
+  await expect(row.locator("strong")).toHaveText("Penne");
+});
+
+test("a user can edit a meal name and description via the modal", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMeal(page, "Spaghetti Bolognese", "A classic.");
+
+  await page.click('button:has-text("Edit")');
+  const dialog = page.locator("dialog#meal-edit-modal");
+  await expect(dialog).toBeVisible();
+  await dialog.locator("#meal-edit-name").fill("Pasta al Pomodoro");
+  await dialog.locator("#meal-edit-description").fill("## Ingredients\n\nA simple tomato sauce.");
+  await dialog.locator("#meal-edit-save").click();
+
+  await expect(page.locator("h1")).toContainText("Pasta al Pomodoro");
+  await expect(page.locator(".markdown h2")).toContainText("Ingredients");
+});
+
+test("a user can delete a meal", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMeal(page, "Spaghetti Bolognese", "");
+
+  await page.click('button:has-text("Delete")');
+  await expect(page).toHaveURL(/\/meals$/);
+  await expect(page.locator(".list-card").filter({ hasText: "Spaghetti Bolognese" })).toHaveCount(0);
+});
+
+test("a user can edit an ingredient via the actions modal", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMeal(page, "Spaghetti Bolognese", "");
+  await addIngredient(page, "Penne", "500g");
+
+  const row = page.locator(".ingredient-list").filter({ hasText: "Penne" });
+  await row.locator(".item-actions-button").click();
+
+  const dialog = row.locator("dialog.item-modal");
+  await expect(dialog).toBeVisible();
+  await dialog.locator('[id^="ingredient-edit-name"]').fill("Rigatoni");
+  await dialog.locator('[id^="ingredient-edit-quantity"]').fill("400g");
+  await dialog.locator('[id^="ingredient-edit-save"]').click();
+
+  const updated = page.locator(".ingredient-list").filter({ hasText: "Rigatoni" });
+  await expect(updated).toBeVisible();
+  await expect(updated.locator(".item-qty")).toHaveText("(400g)");
+});
+
+test("a user can delete an ingredient via the actions modal", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMeal(page, "Spaghetti Bolognese", "");
+  await addIngredient(page, "Penne");
+
+  const row = page.locator(".ingredient-list").filter({ hasText: "Penne" });
+  await row.locator(".item-actions-button").click();
+
+  const dialog = row.locator("dialog.item-modal");
+  await expect(dialog).toBeVisible();
+  await dialog.locator('[id^="ingredient-edit-delete"]').click();
+
+  await expect(page.locator(".ingredient-list").filter({ hasText: "Penne" })).toHaveCount(0);
+});
+
+test("ingredients are grouped under their categories", async ({ page }) => {
+  await registerAndLogin(page, "alice@example.com");
+  await createMeal(page, "Spaghetti Bolognese", "");
+
+  // Add an ingredient in the default "Produce" category.
+  await page.fill("#ingredient-name", "Tomato");
+  await page.selectOption("#ingredient-category", { label: "Produce" });
+  await page.click("#add-ingredient-button");
+
+  // Add one without a category.
+  await addIngredient(page, "Penne");
+
+  await expect(page.locator(".category-heading").filter({ hasText: "Produce" })).toBeVisible();
+  await expect(page.locator(".category-heading").filter({ hasText: "Uncategorized" })).toBeVisible();
+});

e2e/tests/passkey.spec.ts

@@ -0,0 +1,47 @@
+import { expect } from "@playwright/test";
+import { test } from "../fixtures";
+import { registerAndLogin } from "../helpers";
+
+/**
+ * Enables a virtual WebAuthn authenticator on the given context so the browser
+ * can complete passkey ceremonies without a real device.
+ */
+async function enableVirtualAuthenticator(context: any) {
+  const cdp = await context.newCDPSession(context.pages()[0]);
+  await cdp.send("WebAuthn.enable", { enableUI: false });
+  await cdp.send("WebAuthn.addVirtualAuthenticator", {
+    options: {
+      protocol: "ctap2",
+      transport: "internal",
+      hasResidentKey: true,
+      hasUserVerification: true,
+      isUserVerified: true,
+    },
+  });
+}
+
+test("a user can register a passkey and sign in with it", async ({ page, browser, server }) => {
+  const context = await browser.newContext({ baseURL: server.baseURL });
+  const p = await context.newPage();
+
+  await enableVirtualAuthenticator(context);
+
+  // Register with a password first.
+  await registerAndLogin(p, "alice@example.com");
+
+  // Add a passkey from the account page.
+  await p.goto("/account");
+  await p.click("#add-passkey");
+  await expect(p.locator(".passkey-row")).toHaveCount(1);
+
+  // Log out.
+  await p.click('button:has-text("Sign out")');
+  await expect(p).toHaveURL(/\/login/);
+
+  // Sign in with the passkey.
+  await p.fill("#email", "alice@example.com");
+  await p.click("#passkey-login");
+  await expect(p).toHaveURL(/\/lists/);
+
+  await context.close();
+});

e2e/tests/websocket.spec.ts

@@ -0,0 +1,31 @@
+import { expect } from "@playwright/test";
+import { test } from "../fixtures";
+import { registerAndLogin, createList, addItem } from "../helpers";
+
+test("a list updates live for another user via websocket", async ({ page, browser, server }) => {
+  // User A registers and creates a list.
+  await registerAndLogin(page, "alice@example.com");
+  await createList(page, "Weekly shop");
+  const listUrl = page.url();
+
+  // User B registers in a separate context (separate session).
+  const contextB = await browser.newContext({ baseURL: server.baseURL });
+  const pageB = await contextB.newPage();
+  await registerAndLogin(pageB, "bob@example.com");
+
+  // Both users open the same list.
+  await page.goto(listUrl);
+  await pageB.goto(listUrl);
+
+  // Give the websocket connections a moment to establish.
+  await page.waitForTimeout(500);
+
+  // User A adds an item.
+  await addItem(page, "Apple", "2");
+
+  // It should appear on User B's page without any reload.
+  await expect(pageB.locator(".item-row").filter({ hasText: "Apple" })).toBeVisible();
+  await expect(pageB.locator(".item-row").filter({ hasText: "Apple" }).locator(".item-qty")).toHaveText("(2)");
+
+  await contextB.close();
+});

src/domain.rs

@@ -21,6 +21,15 @@ pub struct User {
     pub display_name: String,
 }
 
+#[derive(Clone, Debug)]
+pub struct Passkey {
+    pub id: i64,
+    pub user_id: i64,
+    pub credential_id: String,
+    pub credential: String,
+    pub counter: i64,
+}
+
 #[derive(Clone, Debug)]
 pub struct SessionUser {
     pub user: User,

src/http.rs

@@ -5,7 +5,7 @@ use std::time::Duration;
 use axum::{
     Router,
     extract::{
-        Form, FromRequest, FromRequestParts, Path, Query, Request, State,
+        Form, FromRequest, FromRequestParts, Json, Path, Query, Request, State,
         ws::{Message, WebSocket, WebSocketUpgrade},
     },
     http::{HeaderMap, HeaderValue, StatusCode, header, request::Parts},
@@ -19,14 +19,15 @@ use thiserror::Error;
 use tower_http::{
     services::ServeDir,
     set_header::SetResponseHeaderLayer,
-    trace::TraceLayer,
+    trace::{DefaultMakeSpan, DefaultOnResponse, TraceLayer},
 };
-use tracing::{error, warn};
+use tracing::{Level, error, warn};
 
 use crate::domain::{DomainError, SessionUser};
 use crate::ports::{HubEvent, RealtimeNotifier};
 use crate::services::{AuthService, InvitationService, ListService, MealService};
 use crate::views;
+use crate::webauthn::WebAuthnService;
 
 #[derive(Clone)]
 pub struct AppState {
@@ -34,6 +35,7 @@ pub struct AppState {
     pub lists: Arc<ListService>,
     pub meals: Arc<MealService>,
     pub invitations: Arc<InvitationService>,
+    pub webauthn: Arc<WebAuthnService>,
     pub realtime: Arc<dyn RealtimeNotifier>,
     pub cookie_secure: bool,
     pub public_base_url: String,
@@ -52,10 +54,13 @@ pub enum AppError {
 impl IntoResponse for AppError {
     fn into_response(self) -> Response {
         match self {
-            AppError::Database(_) => status_html_response(
+            AppError::Database(error) => {
+                error!(%error, "request failed");
+                status_html_response(
                     StatusCode::INTERNAL_SERVER_ERROR,
                     views::error_page("500", "Something went wrong."),
-            ),
+                )
+            }
             AppError::BadRequest(message) => {
                 status_html_response(StatusCode::BAD_REQUEST, views::error_page("400", &message))
             }
@@ -73,6 +78,18 @@ pub fn build_router(state: AppState) -> Router {
         .route("/login", get(login_page).post(login))
         .route("/register", get(register_page).post(register))
         .route("/logout", post(logout))
+        .route("/account", get(account_page))
+        .route("/auth/passkey/register/start", post(passkey_register_start))
+        .route(
+            "/auth/passkey/register/finish",
+            post(passkey_register_finish),
+        )
+        .route("/auth/passkey/login/start", post(passkey_login_start))
+        .route("/auth/passkey/login/finish", post(passkey_login_finish))
+        .route(
+            "/account/passkeys/{passkey_id}/delete",
+            post(delete_passkey),
+        )
         .route("/lists", get(lists_page).post(create_list))
         .route("/lists/{list_id}", get(list_page))
         .route("/lists/{list_id}/items", post(add_item))
@@ -87,8 +104,14 @@ pub fn build_router(state: AppState) -> Router {
         .route("/meals/{meal_id}/edit", post(edit_meal))
         .route("/meals/{meal_id}/delete", post(delete_meal))
         .route("/meals/{meal_id}/ingredients", post(add_ingredient))
-        .route("/meals/{meal_id}/ingredients/{ingredient_id}/edit", post(edit_ingredient))
+        .route(
-        .route("/meals/{meal_id}/ingredients/{ingredient_id}/delete", post(delete_ingredient))
+            "/meals/{meal_id}/ingredients/{ingredient_id}/edit",
+            post(edit_ingredient),
+        )
+        .route(
+            "/meals/{meal_id}/ingredients/{ingredient_id}/delete",
+            post(delete_ingredient),
+        )
         .route("/lists/{list_id}/add-meal", post(add_meal_to_list))
         .route("/lists/{list_id}/stream", get(list_stream))
         .route("/invite/{token}", get(invitation_page))
@@ -102,7 +125,11 @@ pub fn build_router(state: AppState) -> Router {
                 ))
                 .service(ServeDir::new("static")),
         )
-        .layer(TraceLayer::new_for_http())
+        .layer(
+            TraceLayer::new_for_http()
+                .make_span_with(DefaultMakeSpan::new().level(Level::INFO))
+                .on_response(DefaultOnResponse::new().level(Level::INFO)),
+        )
         .layer(middleware::from_fn(log_response_status))
         .with_state(state)
 }
@@ -225,6 +252,32 @@ struct CategoryForm {
     csrf: String,
 }
 
+#[derive(Debug, Deserialize)]
+struct PasskeyRegisterStartForm {
+    csrf: String,
+}
+
+#[derive(Debug, Deserialize)]
+struct PasskeyRegisterFinishForm {
+    csrf: String,
+    response: webauthn_rs::proto::RegisterPublicKeyCredential,
+}
+
+#[derive(Debug, Deserialize)]
+struct PasskeyLoginStartForm {
+    email: String,
+}
+
+#[derive(Debug, Deserialize)]
+struct PasskeyLoginFinishForm {
+    response: webauthn_rs::proto::PublicKeyCredential,
+}
+
+#[derive(Debug, Deserialize)]
+struct DeletePasskeyForm {
+    csrf: String,
+}
+
 #[derive(Debug, Deserialize)]
 struct MealForm {
     name: String,
@@ -379,6 +432,92 @@ async fn logout(State(state): State<AppState>, user: CurrentUser) -> Result<Resp
     Ok(response)
 }
 
+async fn account_page(
+    State(state): State<AppState>,
+    user: CurrentUser,
+) -> Result<Response, AppError> {
+    let passkeys = state.webauthn.list_passkeys(user.session.user.id).await?;
+    Ok(html_response(views::account_page(
+        &user.session.user,
+        &passkeys,
+        &user.session.csrf_token,
+    )))
+}
+
+async fn passkey_register_start(
+    State(state): State<AppState>,
+    user: CurrentUser,
+    Json(form): Json<PasskeyRegisterStartForm>,
+) -> Result<Response, AppError> {
+    verify_csrf(&user, &form.csrf)?;
+    let challenge = state
+        .webauthn
+        .start_registration(&user.session.user)
+        .map_err(AppError::Database)?;
+    Ok(Json(challenge).into_response())
+}
+
+async fn passkey_register_finish(
+    State(state): State<AppState>,
+    user: CurrentUser,
+    Json(form): Json<PasskeyRegisterFinishForm>,
+) -> Result<Response, AppError> {
+    verify_csrf(&user, &form.csrf)?;
+    state
+        .webauthn
+        .finish_registration(&user.session.user, form.response)
+        .await?;
+    Ok(Redirect::to("/account").into_response())
+}
+
+async fn passkey_login_start(
+    State(state): State<AppState>,
+    Json(form): Json<PasskeyLoginStartForm>,
+) -> Result<Response, AppError> {
+    let email = form.email.trim().to_lowercase();
+    let Some((user, _)) = state.auth.find_user_by_email(email).await? else {
+        return Err(AppError::NotFound);
+    };
+    let challenge = state
+        .webauthn
+        .start_authentication(user.id)
+        .await
+        .map_err(AppError::Database)?;
+    Ok(Json(challenge).into_response())
+}
+
+async fn passkey_login_finish(
+    State(state): State<AppState>,
+    Json(form): Json<PasskeyLoginFinishForm>,
+) -> Result<Response, AppError> {
+    let user_id = state
+        .webauthn
+        .resolve_user_id_for_assertion(&form.response)
+        .await?;
+    state
+        .webauthn
+        .finish_authentication(user_id, form.response)
+        .await?;
+    let (session_token, _) = state.auth.create_session_for_user(user_id).await?;
+    let mut response = Redirect::to("/lists").into_response();
+    set_session_cookie(&mut response, &session_token, state.cookie_secure);
+    Ok(response)
+}
+
+async fn delete_passkey(
+    State(state): State<AppState>,
+    user: CurrentUser,
+    Path(passkey_id): Path<i64>,
+    LoggedForm(form): LoggedForm<DeletePasskeyForm>,
+) -> Result<Response, AppError> {
+    verify_csrf(&user, &form.csrf)?;
+    state
+        .webauthn
+        .delete_passkey(user.session.user.id, passkey_id)
+        .await?;
+    Ok(Redirect::to("/account").into_response())
+}
+
 async fn lists_page(
     State(state): State<AppState>,
     user: CurrentUser,

src/main.rs

@@ -7,6 +7,7 @@ mod seed;
 mod services;
 mod sqlite;
 mod views;
+mod webauthn;
 
 use std::env;
 use std::path::Path as FilePath;
@@ -19,29 +20,37 @@ use crate::http::{AppState, build_router};
 use crate::hub::InMemoryHub;
 use crate::ports::{
     CategoryRepository, InvitationRepository, ItemRepository, ListRepository,
-    MealIngredientRepository, MealRepository, PasswordHasher, RealtimeNotifier, SessionRepository,
+    MealIngredientRepository, MealRepository, PasskeyRepository, PasswordHasher, RealtimeNotifier,
-    TokenGenerator, UserRepository,
+    SessionRepository, TokenGenerator, UserRepository,
 };
 use crate::security::{Argon2PasswordHasher, RandomTokenGenerator};
 use crate::services::{AuthService, InvitationService, ListService, MealService, RegistrationMode};
 use crate::sqlite::{
-    SqliteCategoryRepository, SqliteInvitationRepository, SqliteItemRepository,
+    SqliteCategoryRepository, SqliteDatabase, SqliteInvitationRepository, SqliteItemRepository,
     SqliteListRepository, SqliteMealIngredientRepository, SqliteMealRepository,
-    SqliteSessionRepository, SqliteDatabase, SqliteUserRepository,
+    SqlitePasskeyRepository, SqliteSessionRepository, SqliteUserRepository,
 };
+use crate::webauthn::{AppWebauthnConfig, WebAuthnService};
 
 #[tokio::main]
 async fn main() -> Result<(), Box<dyn std::error::Error>> {
     tracing_subscriber::fmt()
         .with_env_filter(
-            env::var("RUST_LOG").unwrap_or_else(|_| "sustenance=debug,tower_http=info".into()),
+            env::var("RUST_LOG").unwrap_or_else(|_| "sustenance=info,tower_http=info".into()),
         )
         .init();
 
     let database_path = env::var("DATABASE_PATH").unwrap_or_else(|_| "sustenance.db".into());
     let bind_address = env::var("BIND_ADDRESS").unwrap_or_else(|_| "127.0.0.1:3000".into());
-    let public_base_url =
+    // For loopback hosts, advertise `localhost` so WebAuthn works locally (browsers
-        env::var("PUBLIC_BASE_URL").unwrap_or_else(|_| format!("http://{}", bind_address));
+    // reject IP addresses as RP IDs). Access the app via http://localhost:PORT.
+    let bind_host = bind_address.split(':').next().unwrap_or("127.0.0.1");
+    let is_loopback = bind_host == "127.0.0.1" || bind_host == "::1" || bind_host == "localhost";
+    let public_host = if is_loopback { "localhost" } else { bind_host };
+    let public_base_url = env::var("PUBLIC_BASE_URL").unwrap_or_else(|_| {
+        let port = bind_address.rsplit(':').next().unwrap_or("3000");
+        format!("http://{}:{}", public_host, port)
+    });
     let cookie_secure = env::var("COOKIE_SECURE")
         .map(|value| value == "1" || value.eq_ignore_ascii_case("true"))
         .unwrap_or(false);
@@ -69,6 +78,7 @@ async fn main() -> Result<(), Box<dyn std::error::Error>> {
     let meal_ingredients: Arc<dyn MealIngredientRepository> =
         Arc::new(SqliteMealIngredientRepository);
     let invitations: Arc<dyn InvitationRepository> = Arc::new(SqliteInvitationRepository);
+    let passkeys: Arc<dyn PasskeyRepository> = Arc::new(SqlitePasskeyRepository);
     let hasher: Arc<dyn PasswordHasher> = Arc::new(Argon2PasswordHasher);
     let tokens: Arc<dyn TokenGenerator> = Arc::new(RandomTokenGenerator);
     let realtime: Arc<dyn RealtimeNotifier> = Arc::new(InMemoryHub::default());
@@ -102,6 +112,29 @@ async fn main() -> Result<(), Box<dyn std::error::Error>> {
         Arc::clone(&realtime),
     ));
 
+    // WebAuthn config from env vars. RP_ID must match the host users access the site from.
+    let rp_id = env::var("RP_ID").unwrap_or_else(|_| {
+        let host = public_base_url
+            .trim_start_matches("http://")
+            .trim_start_matches("https://")
+            .split('/')
+            .next()
+            .unwrap_or("localhost")
+            .split(':')
+            .next()
+            .unwrap_or("localhost")
+            .to_owned();
+        host
+    });
+    let rp_name = env::var("RP_NAME").unwrap_or_else(|_| "Sustenance".into());
+    let origin =
+        url::Url::parse(&public_base_url).map_err(|e| format!("invalid PUBLIC_BASE_URL: {e}"))?;
+    let webauthn_service = Arc::new(WebAuthnService::new(
+        db.clone(),
+        AppWebauthnConfig::new(rp_id, rp_name, origin),
+        Arc::clone(&passkeys),
+    ));
+
     let seed_path = env::var("SEED_CONFIG").unwrap_or_else(|_| "seed.json".into());
     seed::seed_if_needed(&db, &users, &hasher, FilePath::new(&seed_path)).await;
 
@@ -110,6 +143,7 @@ async fn main() -> Result<(), Box<dyn std::error::Error>> {
         lists: lists_service,
         meals: meals_service,
         invitations: invitations_service,
+        webauthn: webauthn_service,
         realtime,
         cookie_secure,
         public_base_url,

src/ports.rs

@@ -2,8 +2,8 @@ use async_trait::async_trait;
 use sqlx::SqliteConnection;
 
 use crate::domain::{
-    Category, DomainResult, GroceryList, Item, Meal, MealIngredient, PresenceUser, SessionUser,
+    Category, DomainResult, GroceryList, Item, Meal, MealIngredient, Passkey, PresenceUser,
-    User,
+    SessionUser, User,
 };
 
 /// Repositories take `&mut SqliteConnection` (which a `Transaction` derefs to),
@@ -27,6 +27,34 @@ pub trait UserRepository: Send + Sync {
     async fn has_users(&self, txn: &mut SqliteConnection) -> DomainResult<bool>;
 }
 
+#[async_trait]
+pub trait PasskeyRepository: Send + Sync {
+    async fn create_passkey(
+        &self,
+        txn: &mut SqliteConnection,
+        user_id: i64,
+        credential_id: String,
+        credential: String,
+        counter: i64,
+    ) -> DomainResult<Passkey>;
+    async fn find_by_credential_id(
+        &self,
+        txn: &mut SqliteConnection,
+        credential_id: String,
+    ) -> DomainResult<Option<Passkey>>;
+    async fn list_for_user(
+        &self,
+        txn: &mut SqliteConnection,
+        user_id: i64,
+    ) -> DomainResult<Vec<Passkey>>;
+    async fn delete_passkey(
+        &self,
+        txn: &mut SqliteConnection,
+        user_id: i64,
+        passkey_id: i64,
+    ) -> DomainResult<()>;
+}
+
 #[async_trait]
 pub trait SessionRepository: Send + Sync {
     async fn create_session(
@@ -64,16 +92,7 @@ pub trait ListRepository: Send + Sync {
 #[async_trait]
 pub trait CategoryRepository: Send + Sync {
     async fn categories(&self, txn: &mut SqliteConnection) -> DomainResult<Vec<Category>>;
-    async fn create_category(
+    async fn create_category(&self, txn: &mut SqliteConnection, name: String) -> DomainResult<i64>;
-        &self,
-        txn: &mut SqliteConnection,
-        name: String,
-    ) -> DomainResult<i64>;
-    async fn category_by_name(
-        &self,
-        txn: &mut SqliteConnection,
-        name: String,
-    ) -> DomainResult<Option<Category>>;
 }
 
 /// A single item to insert in bulk, without a per-item revision bump.

src/services.rs

@@ -1,12 +1,10 @@
 use std::sync::Arc;
 
-use crate::domain::{
+use crate::domain::{DomainError, DomainResult, GroceryList, Item, Meal, SessionUser, User};
-    DomainError, DomainResult, GroceryList, Item, Meal, SessionUser, User,
-};
 use crate::ports::{
-    CategoryRepository, InvitationRepository, ItemRepository, ListRepository, MealIngredientRepository,
+    CategoryRepository, InvitationRepository, ItemRepository, ListRepository,
-    MealRepository, NewItem, PasswordHasher, RealtimeNotifier, SessionRepository, TokenGenerator,
+    MealIngredientRepository, MealRepository, NewItem, PasswordHasher, RealtimeNotifier,
-    UserRepository,
+    SessionRepository, TokenGenerator, UserRepository,
 };
 use crate::sqlite::SqliteDatabase;
 
@@ -127,6 +125,20 @@ impl AuthService {
             .await
     }
 
+    pub async fn find_user_by_email(&self, email: String) -> DomainResult<Option<(User, String)>> {
+        let users = Arc::clone(&self.users);
+        self.db
+            .run(move |txn| Box::pin(async move { users.find_user_by_email(txn, email).await }))
+            .await
+    }
+
+    pub async fn create_session_for_user(&self, user_id: i64) -> DomainResult<(String, String)> {
+        let sessions = Arc::clone(&self.sessions);
+        self.db
+            .run(move |txn| Box::pin(async move { sessions.create_session(txn, user_id).await }))
+            .await
+    }
+
     pub async fn logout(&self, session_token: String) -> DomainResult<()> {
         let sessions = Arc::clone(&self.sessions);
         self.db
@@ -312,7 +324,9 @@ impl MealService {
     pub async fn create_meal(&self, name: String, description: String) -> DomainResult<Meal> {
         let meals = Arc::clone(&self.meals);
         self.db
-            .run(move |txn| Box::pin(async move { meals.create_meal(txn, name, description).await }))
+            .run(move |txn| {
+                Box::pin(async move { meals.create_meal(txn, name, description).await })
+            })
             .await
     }
 

src/sqlite.rs

@@ -7,12 +7,13 @@ use sha2::{Digest, Sha256};
 use sqlx::{Connection, Row, SqliteConnection, SqlitePool, sqlite::SqliteConnectOptions};
 
 use crate::domain::{
-    Category, DomainError, DomainResult, GroceryList, Item, Meal, MealIngredient, SessionUser,
+    Category, DomainError, DomainResult, GroceryList, Item, Meal, MealIngredient, Passkey,
-    User,
+    SessionUser, User,
 };
 use crate::ports::{
-    CategoryRepository, InvitationRepository, ItemRepository, ListRepository, MealIngredientRepository,
+    CategoryRepository, InvitationRepository, ItemRepository, ListRepository,
-    MealRepository, NewItem, SessionRepository, UserRepository,
+    MealIngredientRepository, MealRepository, NewItem, PasskeyRepository, SessionRepository,
+    UserRepository,
 };
 
 #[derive(Clone)]
@@ -106,6 +107,14 @@ async fn migrate(pool: &SqlitePool) -> DomainResult<()> {
             csrf_token TEXT NOT NULL,
             expires_at INTEGER NOT NULL
         );
+        CREATE TABLE IF NOT EXISTS passkeys (
+            id INTEGER PRIMARY KEY AUTOINCREMENT,
+            user_id INTEGER NOT NULL REFERENCES users(id) ON DELETE CASCADE,
+            credential_id TEXT NOT NULL UNIQUE,
+            credential TEXT NOT NULL,
+            counter INTEGER NOT NULL DEFAULT 0,
+            created_at INTEGER NOT NULL
+        );
         CREATE TABLE IF NOT EXISTS lists (
             id INTEGER PRIMARY KEY AUTOINCREMENT,
             name TEXT NOT NULL,
@@ -258,6 +267,117 @@ impl UserRepository for SqliteUserRepository {
     }
 }
 
+#[derive(Clone, Copy)]
+pub struct SqlitePasskeyRepository;
+
+#[async_trait]
+impl PasskeyRepository for SqlitePasskeyRepository {
+    async fn create_passkey(
+        &self,
+        txn: &mut SqliteConnection,
+        user_id: i64,
+        credential_id: String,
+        credential: String,
+        counter: i64,
+    ) -> DomainResult<Passkey> {
+        let result = sqlx::query(
+            "INSERT INTO passkeys (user_id, credential_id, credential, counter, created_at)
+             VALUES (?1, ?2, ?3, ?4, ?5)",
+        )
+        .bind(user_id)
+        .bind(&credential_id)
+        .bind(&credential)
+        .bind(counter)
+        .bind(now())
+        .execute(&mut *txn)
+        .await;
+        match result {
+            Ok(_) => {
+                let id = sqlx::query("SELECT last_insert_rowid()")
+                    .fetch_one(&mut *txn)
+                    .await
+                    .map_err(db_error)?
+                    .get::<i64, _>(0);
+                Ok(Passkey {
+                    id,
+                    user_id,
+                    credential_id,
+                    credential,
+                    counter,
+                })
+            }
+            Err(error) if is_unique_violation(&error) => Err(DomainError::Conflict),
+            Err(error) => Err(db_error(error)),
+        }
+    }
+
+    async fn find_by_credential_id(
+        &self,
+        txn: &mut SqliteConnection,
+        credential_id: String,
+    ) -> DomainResult<Option<Passkey>> {
+        let row = sqlx::query(
+            "SELECT id, user_id, credential_id, credential, counter
+             FROM passkeys WHERE credential_id = ?1",
+        )
+        .bind(&credential_id)
+        .fetch_optional(&mut *txn)
+        .await
+        .map_err(db_error)?;
+        Ok(row.map(|row| Passkey {
+            id: row.get(0),
+            user_id: row.get(1),
+            credential_id: row.get(2),
+            credential: row.get(3),
+            counter: row.get(4),
+        }))
+    }
+
+    async fn list_for_user(
+        &self,
+        txn: &mut SqliteConnection,
+        user_id: i64,
+    ) -> DomainResult<Vec<Passkey>> {
+        let rows = sqlx::query(
+            "SELECT id, user_id, credential_id, credential, counter
+             FROM passkeys WHERE user_id = ?1 ORDER BY id ASC",
+        )
+        .bind(user_id)
+        .fetch_all(&mut *txn)
+        .await
+        .map_err(db_error)?;
+        Ok(rows
+            .into_iter()
+            .map(|row| Passkey {
+                id: row.get(0),
+                user_id: row.get(1),
+                credential_id: row.get(2),
+                credential: row.get(3),
+                counter: row.get(4),
+            })
+            .collect())
+    }
+
+    async fn delete_passkey(
+        &self,
+        txn: &mut SqliteConnection,
+        user_id: i64,
+        passkey_id: i64,
+    ) -> DomainResult<()> {
+        let changed = sqlx::query("DELETE FROM passkeys WHERE id = ?1 AND user_id = ?2")
+            .bind(passkey_id)
+            .bind(user_id)
+            .execute(&mut *txn)
+            .await
+            .map_err(db_error)?
+            .rows_affected();
+        if changed == 0 {
+            return Err(DomainError::NotFound);
+        }
+        Ok(())
+    }
+}
+
 #[derive(Clone, Copy)]
 pub struct SqliteSessionRepository;
 
@@ -416,11 +536,7 @@ impl CategoryRepository for SqliteCategoryRepository {
             .collect())
     }
 
-    async fn create_category(
+    async fn create_category(&self, txn: &mut SqliteConnection, name: String) -> DomainResult<i64> {
-        &self,
-        txn: &mut SqliteConnection,
-        name: String,
-    ) -> DomainResult<i64> {
         let position: i64 = sqlx::query("SELECT COALESCE(MAX(position), -1) + 1 FROM categories")
             .fetch_one(&mut *txn)
             .await
@@ -447,26 +563,6 @@ impl CategoryRepository for SqliteCategoryRepository {
             .get::<i64, _>(0);
         Ok(id)
     }
-
-    async fn category_by_name(
-        &self,
-        txn: &mut SqliteConnection,
-        name: String,
-    ) -> DomainResult<Option<Category>> {
-        let row = sqlx::query(
-            "SELECT id, name
-             FROM categories
-             WHERE name = ?1 COLLATE NOCASE",
-        )
-        .bind(&name)
-        .fetch_optional(&mut *txn)
-        .await
-        .map_err(db_error)?;
-        Ok(row.map(|row| Category {
-            id: row.get(0),
-            name: row.get(1),
-        }))
-    }
 }
 
 #[derive(Clone, Copy)]
@@ -975,10 +1071,7 @@ impl MealIngredientRepository for SqliteMealIngredientRepository {
     }
 }
 
-async fn ensure_category(
+async fn ensure_category(txn: &mut SqliteConnection, category_id: Option<i64>) -> DomainResult<()> {
-    txn: &mut SqliteConnection,
-    category_id: Option<i64>,
-) -> DomainResult<()> {
     let Some(category_id) = category_id else {
         return Ok(());
     };
@@ -1381,11 +1474,7 @@ mod tests {
         let id = db
             .run(move |txn| {
                 let categories = categories.clone();
-                Box::pin(async move {
+                Box::pin(async move { categories.create_category(txn, "Bakery".into()).await })
-                    categories
-                        .create_category(txn, "Bakery".into())
-                        .await
-                })
             })
             .await
             .unwrap();
@@ -1402,34 +1491,12 @@ mod tests {
         let result = db
             .run(move |txn| {
                 let categories = categories.clone();
-                Box::pin(async move {
+                Box::pin(async move { categories.create_category(txn, "Produce".into()).await })
-                    categories
-                        .create_category(txn, "Produce".into())
-                        .await
-                })
             })
             .await;
         assert!(matches!(result, Err(DomainError::Conflict)));
     }
 
-    #[tokio::test]
-    async fn category_by_name_resolves_globally() {
-        let db = setup().await;
-        let categories = SqliteCategoryRepository;
-        let found = db
-            .run(move |txn| {
-                let categories = categories.clone();
-                Box::pin(async move {
-                    categories
-                        .category_by_name(txn, "produce".into())
-                        .await
-                })
-            })
-            .await
-            .unwrap();
-        assert_eq!(found.unwrap().name, "Produce");
-    }
-
     // ---- ItemRepository ----
 
     #[tokio::test]
@@ -1977,7 +2044,14 @@ mod tests {
                 let ingredients = ingredients.clone();
                 Box::pin(async move {
                     ingredients
-                        .add_ingredient(txn, meal.id, "X".into(), String::new(), String::new(), Some(9999))
+                        .add_ingredient(
+                            txn,
+                            meal.id,
+                            "X".into(),
+                            String::new(),
+                            String::new(),
+                            Some(9999),
+                        )
                         .await
                 })
             })
@@ -2054,12 +2128,110 @@ mod tests {
         let result = db
             .run(move |txn| {
                 let ingredients = ingredients.clone();
+                Box::pin(async move { ingredients.delete_ingredient(txn, meal.id, 9999).await })
+            })
+            .await;
+        assert!(matches!(result, Err(DomainError::NotFound)));
+    }
+
+    // ---- PasskeyRepository ----
+
+    #[tokio::test]
+    async fn passkey_crud_roundtrip() {
+        let db = setup().await;
+        let user = create_user(&db, "alice@example.com").await;
+        let passkeys = SqlitePasskeyRepository;
+
+        let created = db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
                 Box::pin(async move {
-                    ingredients
+                    passkeys
-                        .delete_ingredient(txn, meal.id, 9999)
+                        .create_passkey(txn, user.id, "cred-1".into(), "{}".into(), 0)
                         .await
                 })
             })
+            .await
+            .unwrap();
+        assert!(created.id > 0);
+        assert_eq!(created.user_id, user.id);
+        assert_eq!(created.credential_id, "cred-1");
+
+        let found = db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move { passkeys.find_by_credential_id(txn, "cred-1".into()).await })
+            })
+            .await
+            .unwrap()
+            .unwrap();
+        assert_eq!(found.id, created.id);
+
+        let listed = db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move { passkeys.list_for_user(txn, user.id).await })
+            })
+            .await
+            .unwrap();
+        assert_eq!(listed.len(), 1);
+
+        db.run(move |txn| {
+            let passkeys = passkeys.clone();
+            Box::pin(async move { passkeys.delete_passkey(txn, user.id, created.id).await })
+        })
+        .await
+        .unwrap();
+
+        let after = db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move { passkeys.list_for_user(txn, user.id).await })
+            })
+            .await
+            .unwrap();
+        assert!(after.is_empty());
+    }
+
+    #[tokio::test]
+    async fn duplicate_passkey_credential_id_conflicts() {
+        let db = setup().await;
+        let user = create_user(&db, "alice@example.com").await;
+        let passkeys = SqlitePasskeyRepository;
+        db.run(move |txn| {
+            let passkeys = passkeys.clone();
+            Box::pin(async move {
+                passkeys
+                    .create_passkey(txn, user.id, "cred-1".into(), "{}".into(), 0)
+                    .await
+            })
+        })
+        .await
+        .unwrap();
+
+        let result = db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move {
+                    passkeys
+                        .create_passkey(txn, user.id, "cred-1".into(), "{}".into(), 0)
+                        .await
+                })
+            })
+            .await;
+        assert!(matches!(result, Err(DomainError::Conflict)));
+    }
+
+    #[tokio::test]
+    async fn delete_missing_passkey_fails() {
+        let db = setup().await;
+        let user = create_user(&db, "alice@example.com").await;
+        let passkeys = SqlitePasskeyRepository;
+        let result = db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move { passkeys.delete_passkey(txn, user.id, 9999).await })
+            })
             .await;
         assert!(matches!(result, Err(DomainError::NotFound)));
     }

src/views.rs

@@ -3,7 +3,7 @@ use pulldown_cmark::{Options, Parser, html as cmark_html};
 
 use crate::{
     domain::PresenceUser,
-    domain::{Category, GroceryList, Item, Meal, MealIngredient, User},
+    domain::{Category, GroceryList, Item, Meal, MealIngredient, Passkey, User},
 };
 
 pub fn login_page(error: Option<&str>, invite: Option<&str>) -> Markup {
@@ -28,8 +28,11 @@ pub fn login_page(error: Option<&str>, invite: Option<&str>) -> Markup {
                     input id="password" name="password" type="password" autocomplete="current-password" required;
                     button class="button button-primary" type="submit" { "Sign in" }
                 }
+                div class="auth-divider" { span { "or" } }
+                button id="passkey-login" class="button button-secondary" type="button" { "Sign in with a passkey" }
                 p class="auth-switch" { "Need an account? " a href="/register" { "Create one" } }
             }
+            script src="/static/passkey-login.js" {}
         },
     )
 }
@@ -79,6 +82,51 @@ pub fn registration_closed_page() -> Markup {
     )
 }
 
+pub fn account_page(user: &User, passkeys: &[Passkey], csrf_token: &str) -> Markup {
+    page(
+        "Account",
+        Some(user),
+        html! {
+            div class="page-heading" {
+                div {
+                    p class="eyebrow" { "ACCOUNT" }
+                    h1 { "Account" }
+                    p class="lede" { "Manage your sign-in methods." }
+                }
+            }
+            div class="dashboard-grid" {
+                section class="panel" {
+                    div class="panel-heading" {
+                        h2 { "Passkeys" }
+                        span class="count-badge" { (passkeys.len()) }
+                    }
+                    p { "Passkeys let you sign in without a password using your device." }
+                    @if passkeys.is_empty() {
+                        p class="muted" { "You have no passkeys yet." }
+                    } @else {
+                        div class="passkey-list" {
+                            @for passkey in passkeys {
+                                div class="passkey-row" {
+                                    div class="item-copy" {
+                                        strong { "Passkey" }
+                                        small { (passkey.credential_id) }
+                                    }
+                                    form method="post" action=(format!("/account/passkeys/{}/delete", passkey.id)) {
+                                        input type="hidden" name="csrf" value=(csrf_token);
+                                        button class="danger-link" type="submit" { "Remove" }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                    button id="add-passkey" class="button button-primary" type="button" data-csrf=(csrf_token) { "Add a passkey" }
+                }
+            }
+            script src="/static/passkey-register.js" {}
+        },
+    )
+}
+
 pub fn lists_page(user: &User, lists: &[GroceryList], csrf_token: &str) -> Markup {
     page(
         "Your lists",
@@ -237,11 +285,7 @@ pub fn meal_picker(meals: &[Meal], list_id: i64, csrf_token: &str) -> Markup {
     }
 }
 
-pub fn meal_form_page(
+pub fn meal_form_page(user: &User, meal: Option<&Meal>, csrf_token: &str) -> Markup {
-    user: &User,
-    meal: Option<&Meal>,
-    csrf_token: &str,
-) -> Markup {
     let (title, action, name, description) = match meal {
         Some(meal) => (
             "Edit meal",
@@ -276,12 +320,7 @@ pub fn meal_form_page(
     )
 }
 
-pub fn meal_page(
+pub fn meal_page(user: &User, meal: &Meal, categories: &[Category], csrf_token: &str) -> Markup {
-    user: &User,
-    meal: &Meal,
-    categories: &[Category],
-    csrf_token: &str,
-) -> Markup {
     page(
         &meal.name,
         Some(user),
@@ -305,10 +344,10 @@ pub fn meal_page(
                     form method="post" action=(format!("/meals/{}/edit", meal.id)) class="stack" {
                         input type="hidden" name="csrf" value=(csrf_token);
                         label { "Name" }
-                        input name="name" value=(meal.name) maxlength="120" required;
+                        input id="meal-edit-name" name="name" value=(meal.name) maxlength="120" required;
                         label { "Description (markdown)" }
-                        textarea name="description" rows="8" { (meal.description) }
+                        textarea id="meal-edit-description" name="description" rows="8" { (meal.description) }
-                        button class="button button-primary" type="submit" { "Save meal" }
+                        button id="meal-edit-save" class="button button-primary" type="submit" { "Save meal" }
                     }
                 }
             }
@@ -339,19 +378,19 @@ pub fn meal_page(
                 aside class="side-column" {
                     section class="panel" {
                         div class="panel-heading" { h2 { "Add ingredient" } }
-                        form method="post" action=(format!("/meals/{}/ingredients", meal.id)) class="stack" {
+                        form id="add-ingredient-form" method="post" action=(format!("/meals/{}/ingredients", meal.id)) class="stack" {
                             input type="hidden" name="csrf" value=(csrf_token);
                             label { "Name" }
-                            input name="name" type="text" maxlength="120" required;
+                            input id="ingredient-name" name="name" type="text" maxlength="120" required;
                             label { "Quantity" }
-                            input name="quantity" type="text" maxlength="40";
+                            input id="ingredient-quantity" name="quantity" type="text" maxlength="40";
                             label { "Note" }
-                            input name="note" type="text" maxlength="120";
+                            input id="ingredient-note" name="note" type="text" maxlength="120";
                             label { "Category" }
-                            select name="category_id" {
+                            select id="ingredient-category" name="category_id" {
                                 (category_options(categories, None))
                             }
-                            button class="button button-primary" type="submit" { "Add ingredient" }
+                            button id="add-ingredient-button" class="button button-primary" type="submit" { "Add ingredient" }
                         }
                     }
                 }
@@ -391,20 +430,20 @@ fn ingredient_row(
                 {
                     input type="hidden" name="csrf" value=(csrf_token);
                     label { "Name" }
-                    input name="name" value=(ingredient.name) maxlength="120" required;
+                    input id=(format!("ingredient-edit-name-{}", ingredient.id)) name="name" value=(ingredient.name) maxlength="120" required;
                     label { "Quantity" }
-                    input name="quantity" value=(ingredient.quantity) maxlength="40";
+                    input id=(format!("ingredient-edit-quantity-{}", ingredient.id)) name="quantity" value=(ingredient.quantity) maxlength="40";
                     label { "Note" }
-                    input name="note" value=(ingredient.note) maxlength="120";
+                    input id=(format!("ingredient-edit-note-{}", ingredient.id)) name="note" value=(ingredient.note) maxlength="120";
                     label { "Category" }
-                    select name="category_id" {
+                    select id=(format!("ingredient-edit-category-{}", ingredient.id)) name="category_id" {
                         (category_options(categories, ingredient.category_id))
                     }
-                    button class="button button-primary" type="submit" { "Save" }
+                    button id=(format!("ingredient-edit-save-{}", ingredient.id)) class="button button-primary" type="submit" { "Save" }
                 }
                 form method="post" action=(format!("/meals/{}/ingredients/{}/delete", meal_id, ingredient.id)) {
                     input type="hidden" name="csrf" value=(csrf_token);
-                    button class="danger-link" type="submit" { "Remove" }
+                    button id=(format!("ingredient-edit-delete-{}", ingredient.id)) class="danger-link" type="submit" { "Remove" }
                 }
             }
         }
@@ -573,11 +612,11 @@ fn list_content(
             input type="hidden" name="csrf" value=(csrf_token);
             label class="sr-only" for="item-name" { "Item name" }
             input id="item-name" name="name" type="text" maxlength="120" placeholder="Add an item..." autocomplete="off" required;
-            input name="quantity" type="text" maxlength="40" placeholder="Qty" aria-label="Quantity";
+            input id="item-quantity" name="quantity" type="text" maxlength="40" placeholder="Qty" aria-label="Quantity";
-            select name="category_id" aria-label="Category" {
+            select id="item-category" name="category_id" aria-label="Category" {
                 (category_options(categories, None))
             }
-            button class="button button-primary add-button" type="submit" { "+ Add" }
+            button id="add-item-button" class="button button-primary add-button" type="submit" { "+ Add" }
         }
         (list_items_fragment(list, items, categories, csrf_token, false))
     }
@@ -673,11 +712,11 @@ fn item_row(item: &Item, categories: &[Category], csrf_token: &str) -> Markup {
             {
                 input type="hidden" name="csrf" value=(csrf_token);
                 input type="hidden" name="checked" value=(next_checked);
-                button class="check-button" type="submit" aria-label=(if item.checked { "Mark unchecked" } else { "Mark complete" }) {
+                button id=(format!("item-check-{}", item.id)) class="check-button" type="submit" aria-label=(if item.checked { "Mark unchecked" } else { "Mark complete" }) {
                     @if item.checked { "✓" } @else { "" }
                 }
             }
-            div class="item-copy" {
+            label class="item-copy" for=(format!("item-check-{}", item.id)) {
                 @if !item.quantity.is_empty() {
                     span class="item-qty" { "(" (item.quantity) ")" }
                 }
@@ -701,16 +740,16 @@ fn item_row(item: &Item, categories: &[Category], csrf_token: &str) -> Markup {
                     {
                         input type="hidden" name="csrf" value=(csrf_token);
                         label { "Name" }
-                        input name="name" value=(item.name) maxlength="120" required;
+                        input id=(format!("item-edit-name-{}", item.id)) name="name" value=(item.name) maxlength="120" required;
                         label { "Quantity" }
-                        input name="quantity" value=(item.quantity) maxlength="40";
+                        input id=(format!("item-edit-quantity-{}", item.id)) name="quantity" value=(item.quantity) maxlength="40";
                         label { "Note" }
-                        input name="note" value=(item.note) maxlength="120";
+                        input id=(format!("item-edit-note-{}", item.id)) name="note" value=(item.note) maxlength="120";
                         label { "Category" }
-                        select name="category_id" {
+                        select id=(format!("item-edit-category-{}", item.id)) name="category_id" {
                             (category_options(categories, item.category_id))
                         }
-                        button class="button button-primary" type="submit" { "Save" }
+                        button id=(format!("item-edit-save-{}", item.id)) class="button button-primary" type="submit" { "Save" }
                     }
                     form
                         hx-post=(format!("/lists/{}/items/{}/delete", item.list_id, item.id))
@@ -718,7 +757,7 @@ fn item_row(item: &Item, categories: &[Category], csrf_token: &str) -> Markup {
                         hx-swap="outerHTML"
                     {
                         input type="hidden" name="csrf" value=(csrf_token);
-                        button class="danger-link" type="submit" { "Remove item" }
+                        button id=(format!("item-edit-delete-{}", item.id)) class="danger-link" type="submit" { "Remove item" }
                     }
                 }
             }
@@ -743,11 +782,7 @@ fn category_options(categories: &[Category], selected: Option<i64>) -> Markup {
     }
 }
 
-pub fn categories_panel(
+pub fn categories_panel(categories: &[Category], csrf_token: &str, out_of_band: bool) -> Markup {
-    categories: &[Category],
-    csrf_token: &str,
-    out_of_band: bool,
-) -> Markup {
     let panel = html! {
         div class="panel-heading" {
             h2 { "Categories" }
@@ -762,8 +797,8 @@ pub fn categories_panel(
             class="category-form"
         {
             input type="hidden" name="csrf" value=(csrf_token);
-            input name="name" type="text" maxlength="60" placeholder="Add a category" required;
+            input id="category-name" name="name" type="text" maxlength="60" placeholder="Add a category" required;
-            button class="button button-small button-secondary" type="submit" { "Add" }
+            button id="add-category-button" class="button button-small button-secondary" type="submit" { "Add" }
         }
         @if categories.is_empty() {
             p class="muted category-empty" { "No categories yet." }
@@ -920,7 +955,7 @@ fn page(title: &str, user: Option<&User>, content: Markup) -> Markup {
                             a href="/meals" { "Meals" }
                         }
                         div class="account-nav" {
-                            span class="user-name" { (user.display_name) }
+                            a class="user-name" href="/account" { (user.display_name) }
                             form method="post" action="/logout" {
                                 button class="text-button" type="submit" { "Sign out" }
                             }

src/webauthn.rs

@@ -0,0 +1,271 @@
+use std::collections::HashMap;
+use std::sync::{Arc, Mutex};
+
+use webauthn_rs::{
+    Webauthn,
+    core::{AuthenticationState, RegistrationState, WebauthnConfig},
+    error::WebauthnError as WanError,
+    proto::{
+        CreationChallengeResponse, Credential, PublicKeyCredential, RegisterPublicKeyCredential,
+        RequestChallengeResponse,
+    },
+};
+
+use crate::domain::{DomainError, DomainResult, Passkey as DbPasskey, User};
+use crate::ports::PasskeyRepository;
+use crate::sqlite::SqliteDatabase;
+
+/// Site-specific WebAuthn configuration, derived from env vars.
+pub struct AppWebauthnConfig {
+    rp_id: String,
+    rp_name: String,
+    origin: url::Url,
+}
+
+impl AppWebauthnConfig {
+    pub fn new(rp_id: String, rp_name: String, origin: url::Url) -> Self {
+        Self {
+            rp_id,
+            rp_name,
+            origin,
+        }
+    }
+}
+
+impl WebauthnConfig for AppWebauthnConfig {
+    fn get_relying_party_name(&self) -> &str {
+        &self.rp_name
+    }
+    fn get_origin(&self) -> &url::Url {
+        &self.origin
+    }
+    fn get_relying_party_id(&self) -> &str {
+        &self.rp_id
+    }
+}
+
+/// A single-use, in-memory challenge store keyed by user id.
+#[derive(Default)]
+struct ChallengeStore {
+    registrations: HashMap<i64, RegistrationState>,
+    authentications: HashMap<i64, AuthenticationState>,
+}
+
+pub struct WebAuthnService {
+    db: SqliteDatabase,
+    webauthn: Webauthn<AppWebauthnConfig>,
+    passkeys: Arc<dyn PasskeyRepository>,
+    challenges: Mutex<ChallengeStore>,
+}
+
+impl WebAuthnService {
+    pub fn new(
+        db: SqliteDatabase,
+        config: AppWebauthnConfig,
+        passkeys: Arc<dyn PasskeyRepository>,
+    ) -> Self {
+        let webauthn = Webauthn::new(config);
+        Self {
+            db,
+            webauthn,
+            passkeys,
+            challenges: Mutex::new(ChallengeStore::default()),
+        }
+    }
+
+    /// Start a passkey registration ceremony for an authenticated user.
+    pub fn start_registration(&self, user: &User) -> DomainResult<CreationChallengeResponse> {
+        let (challenge, state) = self
+            .webauthn
+            .generate_challenge_register(&user.display_name, true)
+            .map_err(webauthn_error)?;
+        self.challenges
+            .lock()
+            .map_err(|_| DomainError::Database("challenge lock poisoned".into()))?
+            .registrations
+            .insert(user.id, state);
+        Ok(challenge)
+    }
+
+    /// Finish a passkey registration ceremony and persist the credential.
+    pub async fn finish_registration(
+        &self,
+        user: &User,
+        response: RegisterPublicKeyCredential,
+    ) -> DomainResult<()> {
+        let state = self
+            .challenges
+            .lock()
+            .map_err(|_| DomainError::Database("challenge lock poisoned".into()))?
+            .registrations
+            .remove(&user.id)
+            .ok_or(DomainError::NotFound)?;
+
+        let passkeys = Arc::clone(&self.passkeys);
+        let credential_id = response.raw_id.0.clone();
+        let user_id = user.id;
+        let credential = self
+            .webauthn
+            .register_credential(&response, &state, |_| Ok(false))
+            .map_err(webauthn_error)?;
+
+        let serialized = serde_json::to_string(&credential.0)
+            .map_err(|e| DomainError::Database(e.to_string()))?;
+        let credential_id_b64 = base64_url(&credential_id);
+        let counter = credential.0.counter as i64;
+
+        self.db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move {
+                    passkeys
+                        .create_passkey(txn, user_id, credential_id_b64, serialized, counter)
+                        .await?;
+                    Ok(())
+                })
+            })
+            .await
+    }
+
+    /// Start a passkey authentication ceremony for a user.
+    pub async fn start_authentication(
+        &self,
+        user_id: i64,
+    ) -> DomainResult<RequestChallengeResponse> {
+        let passkeys = Arc::clone(&self.passkeys);
+        let db = self.db.clone();
+        let credentials: Vec<Credential> = db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move {
+                    let rows = passkeys.list_for_user(txn, user_id).await?;
+                    let mut creds = Vec::new();
+                    for row in rows {
+                        let cred: Credential = serde_json::from_str(&row.credential)
+                            .map_err(|e| DomainError::Database(e.to_string()))?;
+                        creds.push(cred);
+                    }
+                    Ok(creds)
+                })
+            })
+            .await?;
+        if credentials.is_empty() {
+            return Err(DomainError::NotFound);
+        }
+        let (challenge, state) = self
+            .webauthn
+            .generate_challenge_authenticate(credentials)
+            .map_err(webauthn_error)?;
+        self.challenges
+            .lock()
+            .map_err(|_| DomainError::Database("challenge lock poisoned".into()))?
+            .authentications
+            .insert(user_id, state);
+        Ok(challenge)
+    }
+
+    /// Finish a passkey authentication ceremony.
+    pub async fn finish_authentication(
+        &self,
+        user_id: i64,
+        response: PublicKeyCredential,
+    ) -> DomainResult<()> {
+        let state = self
+            .challenges
+            .lock()
+            .map_err(|_| DomainError::Database("challenge lock poisoned".into()))?
+            .authentications
+            .remove(&user_id)
+            .ok_or(DomainError::NotFound)?;
+
+        let (cred_id, auth_data) = self
+            .webauthn
+            .authenticate_credential(&response, &state)
+            .map_err(|e| {
+                tracing::error!(%e, "webauthn authenticate_credential failed");
+                webauthn_error(e)
+            })?;
+
+        let passkeys = Arc::clone(&self.passkeys);
+        let db = self.db.clone();
+        let credential_id_b64 = base64_url(cred_id);
+        db.run(move |txn| {
+            let passkeys = passkeys.clone();
+            Box::pin(async move {
+                let stored = passkeys
+                    .find_by_credential_id(txn, credential_id_b64)
+                    .await?
+                    .ok_or(DomainError::NotFound)?;
+                let mut cred: Credential = serde_json::from_str(&stored.credential)
+                    .map_err(|e| DomainError::Database(e.to_string()))?;
+                cred.counter = auth_data.counter;
+                let serialized = serde_json::to_string(&cred)
+                    .map_err(|e| DomainError::Database(e.to_string()))?;
+                sqlx::query("UPDATE passkeys SET credential = ?1 WHERE id = ?2")
+                    .bind(&serialized)
+                    .bind(stored.id)
+                    .execute(&mut *txn)
+                    .await
+                    .map_err(db_error)?;
+                Ok(())
+            })
+        })
+        .await
+    }
+
+    /// List the passkeys registered to a user.
+    pub async fn list_passkeys(&self, user_id: i64) -> DomainResult<Vec<DbPasskey>> {
+        let passkeys = Arc::clone(&self.passkeys);
+        self.db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move { passkeys.list_for_user(txn, user_id).await })
+            })
+            .await
+    }
+
+    /// Delete a passkey owned by a user.
+    pub async fn delete_passkey(&self, user_id: i64, passkey_id: i64) -> DomainResult<()> {
+        let passkeys = Arc::clone(&self.passkeys);
+        self.db
+            .run(move |txn| {
+                let passkeys = passkeys.clone();
+                Box::pin(async move { passkeys.delete_passkey(txn, user_id, passkey_id).await })
+            })
+            .await
+    }
+
+    /// Resolve the user id that owns the credential in an assertion response.
+    pub async fn resolve_user_id_for_assertion(
+        &self,
+        response: &PublicKeyCredential,
+    ) -> DomainResult<i64> {
+        let passkeys = Arc::clone(&self.passkeys);
+        let db = self.db.clone();
+        let credential_id_b64 = base64_url(&response.raw_id.0);
+        db.run(move |txn| {
+            let passkeys = passkeys.clone();
+            Box::pin(async move {
+                let stored = passkeys
+                    .find_by_credential_id(txn, credential_id_b64)
+                    .await?
+                    .ok_or(DomainError::NotFound)?;
+                Ok(stored.user_id)
+            })
+        })
+        .await
+    }
+}
+
+fn base64_url(bytes: &[u8]) -> String {
+    use base64::Engine;
+    base64::engine::general_purpose::URL_SAFE_NO_PAD.encode(bytes)
+}
+
+fn webauthn_error(error: WanError) -> DomainError {
+    DomainError::Database(error.to_string())
+}
+
+fn db_error(error: sqlx::Error) -> DomainError {
+    DomainError::Database(error.to_string())
+}

static/passkey-login.js

@@ -0,0 +1,38 @@
+function b64ToBytes(b64) {
+  const bin = atob(b64.replace(/-/g, "+").replace(/_/g, "/"));
+  const bytes = new Uint8Array(bin.length);
+  for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i);
+  return bytes;
+}
+
+document.getElementById("passkey-login").addEventListener("click", async () => {
+  const email = document.getElementById("email").value;
+  if (!email) {
+    alert("Enter your email first.");
+    return;
+  }
+  const start = await fetch("/auth/passkey/login/start", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ email }),
+  });
+  if (!start.ok) {
+    alert("No passkey found for that email.");
+    return;
+  }
+  const options = await start.json();
+  const pk = options.publicKey;
+  pk.challenge = b64ToBytes(pk.challenge);
+  if (pk.allowCredentials) {
+    pk.allowCredentials.forEach((c) => (c.id = b64ToBytes(c.id)));
+  }
+  const credential = await navigator.credentials.get(options);
+  const finish = await fetch("/auth/passkey/login/finish", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ response: credential }),
+  });
+  if (finish.ok) {
+    window.location.href = "/lists";
+  }
+});

static/passkey-register.js

@@ -0,0 +1,32 @@
+function b64ToBytes(b64) {
+  const bin = atob(b64.replace(/-/g, "+").replace(/_/g, "/"));
+  const bytes = new Uint8Array(bin.length);
+  for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i);
+  return bytes;
+}
+
+document.getElementById("add-passkey").addEventListener("click", async () => {
+  const csrf = document.getElementById("add-passkey").dataset.csrf;
+  const start = await fetch("/auth/passkey/register/start", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ csrf }),
+  });
+  const options = await start.json();
+  const pk = options.publicKey;
+  pk.challenge = b64ToBytes(pk.challenge);
+  pk.user.id = b64ToBytes(pk.user.id);
+  if (pk.excludeCredentials) {
+    pk.excludeCredentials.forEach((c) => (c.id = b64ToBytes(c.id)));
+  }
+  const credential = await navigator.credentials.create(options);
+  const response = { csrf, response: credential };
+  const finish = await fetch("/auth/passkey/register/finish", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(response),
+  });
+  if (finish.ok) {
+    window.location.href = "/account";
+  }
+});

static/style.css

@@ -51,7 +51,8 @@ a { color: inherit; }
 }
 .site-nav a:hover { color: var(--ink); background: #eef2ea; }
 .account-nav { display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: .9rem; }
-.user-name { color: var(--ink); font-weight: 700; }
+.user-name { color: var(--ink); font-weight: 700; text-decoration: none; }
+.user-name:hover { color: var(--deep-sage); }
 .text-button { border: 0; padding: 0; color: var(--deep-sage); background: transparent; cursor: pointer; font-weight: 700; }
 
 .site-main { width: min(1120px, calc(100% - 40px)); margin: 30px auto 80px; }
@@ -96,6 +97,12 @@ textarea:focus { border-color: var(--deep-sage); box-shadow: 0 0 0 4px rgba(85,
 
 .auth-card { width: min(100%, 480px); margin: 7vh auto 0; padding: clamp(27px, 6vw, 54px); border: 1px solid var(--line); border-radius: 28px; background: rgba(255, 253, 248, .9); box-shadow: var(--shadow); }
 .auth-card .button { margin-top: 11px; }
+.auth-divider { display: flex; align-items: center; gap: 12px; margin: 20px 0 4px; color: var(--muted); font-size: .8rem; }
+.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
+.passkey-list { display: grid; gap: 8px; margin-bottom: 16px; }
+.passkey-row { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
+.passkey-row .item-copy { flex: 1; }
+.passkey-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .auth-switch { margin: 25px 0 0; color: var(--muted); font-size: .9rem; text-align: center; }
 .auth-switch a { color: var(--deep-sage); font-weight: 800; }
 .alert { margin-bottom: 18px; padding: 12px 14px; border-radius: 12px; font-size: .9rem; }