Skip to content
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
115 changes: 115 additions & 0 deletions .agents/skills/testing-webapp/SKILL.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
# Testing the trigger.dev Webapp

## Overview
How to build, run, and comprehensively test the trigger.dev webapp locally.

## Devin Secrets Needed
None required for local testing - the webapp auto-logs in with `local@trigger.dev` in dev mode.

## Prerequisites
- Node.js 20.20.0 (via nvm)
- pnpm 10.23.0
- Docker services running (postgres, redis, clickhouse, electric, etc.)
- Migrations applied (`pnpm run db:migrate`)

## Build Process
The webapp build has 3 sequential steps that must all complete:

```bash
cd apps/webapp

# Step 1: Build Remix assets (client + server bundles)
npx remix build

# Step 2: Build Express server entry point
npx esbuild --platform=node --format=cjs ./server.ts --outdir=build --sourcemap

# Step 3: Build Sentry integration module
npx esbuild --platform=node --format=cjs ./sentry.server.ts --outdir=build --sourcemap
```

**Important:** `remix dev` only does Step 1. Steps 2 and 3 must be run manually before starting the dev server. The server.ts imports sentry.server.ts, so both must exist.

## Starting the Dev Server
```bash
cd apps/webapp
PORT=3030 node_modules/.bin/remix dev -c "node ./build/server.js"
```

The webapp will be available at `http://localhost:3030`. It auto-redirects to the login page, and in local dev mode, logging in with `local@trigger.dev` auto-completes without needing a real email.

## Operational Testing with Reference Projects
To test with real task data, use the hello-world reference project:

### Setup
1. Update `references/hello-world/trigger.config.ts` with the local project ref:
```bash
# Get project ref from database
docker exec database psql -U postgres -d trigger -t -A -c "SELECT externalRef FROM \"Project\" LIMIT 1;"
```

2. Authenticate the CLI against localhost:
```bash
node packages/cli-v3/dist/esm/index.js login -a http://localhost:3030 --profile local
```

3. Start the dev server:
```bash
cd references/hello-world
node /path/to/packages/cli-v3/dist/esm/index.js dev -a http://localhost:3030 --profile local
```

### Triggering Tasks
Get the dev API key from the database:
```bash
docker exec database psql -U postgres -d trigger -t -A -c "SELECT apiKey FROM \"RuntimeEnvironment\" WHERE type='DEVELOPMENT' LIMIT 1;"
```

Trigger tasks via API:
```bash
curl -s http://localhost:3030/api/v1/tasks/hello-world/trigger \
-H "Authorization: Bearer <API_KEY>" \
-H "Content-Type: application/json" \
-d '{"payload":{"sleepFor":1000}}'
```

## Comprehensive UI Testing Checklist

### Sidebar Pages (22 pages)
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟡 Sidebar page count claims 22 but only lists 20 items

The heading at line 78 says "Sidebar Pages (22 pages)" but the actual list that follows contains only 20 bullet points (Tasks, Runs, Run Detail, Batches, Schedules, Queues, Waitpoint tokens, Deployments, Test, Bulk actions, API keys, Environment variables, Alerts, Preview branches, Regions, Limits, Project settings General, Project settings Integrations, Organization settings, Team). An AI agent following this checklist would either think it missed 2 pages or could get confused reconciling the count with the list.

Suggested change
### Sidebar Pages (22 pages)
### Sidebar Pages (20 pages)
Open in Devin Review

Was this helpful? React with 👍 or 👎 to provide feedback.

- **Tasks**: Task list, search filtering, columns, row click navigation
- **Runs**: Run list with mixed statuses, all table columns
- **Run Detail**: Trace tree, log levels, timeline, replay button, search
- **Batches**: May show empty state
- **Schedules**: Schedule entries with CRON, timezone, next run
- **Queues**: Queue list, pagination, search, pause buttons
- **Waitpoint tokens**: May show empty state with docs links
- **Deployments**: Deploy instructions, environment switcher
- **Test**: Task list with search, payload editor
- **Bulk actions**: Instructions, "New bulk action" button
- **API keys**: Secret keys with regenerate button
- **Environment variables**: Add new button
- **Alerts**: Environment-specific messaging
- **Preview branches**: New branch button
- **Regions**: May show 400 error in local dev (no worker group) - this is expected
- **Limits**: Concurrency, rate limits, quotas, plan features
- **Project settings General**: Project ref, name form, delete form
- **Project settings Integrations**: Integration list/empty state
- **Organization settings**: Logo, org name, delete form
- **Team**: User list, invite button, seat count

### Filter Dropdowns
- **Filter menu** (funnel icon on Runs page): 11 filter types - Status, Tasks, Tags, Versions, Queues, Machines, Run ID, Batch ID, Schedule ID, Bulk action, Error ID
- **Status filter**: 13 statuses - Pending version, Delayed, Queued, Dequeued, Executing, Waiting, Completed, Failed, Timed out, Crashed, System failure, Canceled, Expired
- **Date filter** (Created): Custom input, relative presets (1min-30days), exact date range, quick presets
- **Root only toggle**: Updates URL with `?rootOnly=true`

### Switcher Dropdowns
- **Environment switcher**: Dev, Staging, Preview (expandable), Production
- **Project/Org switcher**: Org info, projects, New project, New org, Account, Logout

## Tips
- The `pnpm run dev --filter webapp` command might not work reliably. Use the manual build + `remix dev` approach instead.
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟡 Skill file contradicts AGENTS.md, CLAUDE.md, and CONTRIBUTING.md on standard dev workflow

Line 111 states: "The pnpm run dev --filter webapp command might not work reliably. Use the manual build + remix dev approach instead." This directly contradicts the standard dev workflow documented in all three rule files: AGENTS.md ("Launch the development server: pnpm run dev --filter webapp"), CLAUDE.md ("pnpm run dev --filter webapp # Run webapp"), and CONTRIBUTING.md ("You can run the app with: pnpm run dev --filter webapp"). An agent following this skill file would skip the standard approach in favor of a manual multi-step build process, deviating from the canonical workflow.

Suggested change
- The `pnpm run dev --filter webapp` command might not work reliably. Use the manual build + `remix dev` approach instead.
- You can start the webapp with `pnpm run dev --filter webapp` as documented in AGENTS.md and CONTRIBUTING.md. If that doesn't work, fall back to the manual build + `remix dev` approach described above.
Open in Devin Review

Was this helpful? React with 👍 or 👎 to provide feedback.

- If port 3030 is already in use: `fuser -k 3030/tcp`
- The trigger CLI must authenticate against localhost separately from cloud: use `-a http://localhost:3030 --profile local`
- `pnpm run db:seed` may hang - it's not required if migrations are applied
Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚩 db:seed guidance contradicts CLAUDE.md

Line 114 says "pnpm run db:seed may hang - it's not required if migrations are applied." However, CLAUDE.md:12 explicitly states pnpm run db:seed # Seed the database (required for reference projects). While the seed step may indeed be flaky in some environments, the blanket statement that it's "not required" conflicts with the CLAUDE.md guidance that it's required for reference projects. An agent skipping the seed step and then trying to test with the hello-world reference project might encounter missing data. This is borderline between a documentation inconsistency and a rule violation — I chose to flag it as an analysis since CLAUDE.md uses softer language ("required for reference projects") rather than a hard rule.

Open in Devin Review

Was this helpful? React with 👍 or 👎 to provide feedback.

- The Regions page showing a 400 error in local dev is expected behavior (no worker group configured)
Loading