> ## Documentation Index
> Fetch the complete documentation index at: https://synthetiq.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Verify with a PRD

> Bind the task tracker's requirements to runnable, watchable tests

The task tracker now has a schema, an API, pages, access control, and a workflow. The PRD pins all of that down: a plain-language requirements document where every entry is backed by a real test, so anyone can confirm the app does what it should by watching it rather than reading code. This page adds one feature entry end to end; the full system is covered in [PRD Verification](/docs/platform-docs/app-framework/prd/overview).

## Declare the requirement

Add the entry to `prd.json` at the app root:

```jsonc theme={null}
{
  "sections": [
    {
      "id": "tasks",
      "title": "Managing tasks",
      "entries": [
        {
          "id": "tasks.member-can-add",
          "title": "A member can add a task",
          "behavior": "A signed-in member types a task and adds it; the task appears in their list.",
          "acceptanceCriteria": [
            "The new task appears in the member's list immediately"
          ],
          "test": { "type": "e2e", "file": "prd/tests/tasks.member-can-add.spec.ts", "name": "tasks.member-can-add" }
        }
      ]
    }
  ]
}
```

The entry is a claim in plain language. The binding keeps it honest: `test.name` must equal the entry id, and the build fails on any entry whose test doesn't exist.

## Write the hero test

Create `prd/tests/tasks.member-can-add.spec.ts`, a story told in steps, each one user action ending on its visible result:

```typescript theme={null}
import { definePrdTest, expect } from "@synthetiq/app-framework/prd/harness";

definePrdTest("tasks.member-can-add", async ({ prd }) => {
  const page = await prd.actAs({ scopes: [] }); // any signed-in member

  await prd.step("A member opens their task list", async () => {
    await page.goto("/");
    await expect(page.getByText("No tasks yet")).toBeVisible();
  });
  await prd.step("They type a new task", async () => {
    await page.getByLabel("New task").pressSequentially("Ship the report", { delay: 90 });
  });
  await prd.step("They click Add", async () => {
    await page.getByRole("button", { name: "Add" }).click();
    await expect(page.getByText("Ship the report")).toBeVisible();
  });
  await prd.verify("The task 'Ship the report' now appears in their list", async () => {
    const task = page.getByText("Ship the report");
    await prd.highlight(task);
    await expect(task).toBeVisible();
  });
});
```

`prd.step` marks one beat of the recording; `prd.verify` records an assertion with its plain-language label. The harness handles watchability automatically: pacing, a visible cursor, your step labels shown as the flow plays, and who's acting at each step.

## Run it

```bash theme={null}
synthetiq-app build      # compiles, and runs the PRD suite
synthetiq-app prd:test   # full run: records the videos and writes results back
```

`prd:test` boots the app against a throwaway test database with all services stubbed, runs the entry, and writes the result into `prd.json` along with recordings in both light and dark themes.

## Watch it

Open the app's PRD view and click into the entry. You'll find the video with a synced step timeline, the database state the test started from and ended with, and every service call the app made. From here on, the suite re-runs on every build: change the app, and this entry either stays green or tells you exactly what broke.

## Going further

This entry is the simplest case. The PRD system covers considerably more:

* [Feature tests](/docs/platform-docs/app-framework/prd/feature-tests) — seeding data, acting as multiple users with different permissions and data
* [Verifying calculations](/docs/platform-docs/app-framework/prd/verifying-calculations) — proving metrics and aggregations produce exact values
* [Services and workflows](/docs/platform-docs/app-framework/prd/services-and-workflows) — asserting what the app sends, and running workflows for real
* [Access verification](/docs/platform-docs/app-framework/prd/access-verification) — the machine-checked access matrix for every endpoint