2e74d32871
## Thinking Path > - Paperclip is the open source app people use to manage AI agents for work. > - The board UI is the operator surface where users create, assign, monitor, and review work items. > - The product language is moving toward "tasks" for user-facing work items while the internal API and database still use "issues". > - PR #7543 bundled this copy migration with broader information-architecture work, which made the branch too large for Greptile review. > - This pull request peels the Issue-to-Task copy migration into a smaller, independently reviewable change. > - The benefit is clearer user-facing terminology, less agent confusion via the Paperclip skill note, and a smaller PR that Greptile can review. ## Linked Issues or Issue Description Refs #7645 Refs #7543 Refs PAP-10430 This PR was split out of #7543 so the Issue-to-Task copy migration can be reviewed separately and the remaining IA PR can fall under Greptile's file limit. ## What Changed - Preserves Scott Tong's original `PAP-57` copy-only commit, with author and co-author credit intact, to rename user-facing "Issues" copy to "Tasks" across the UI while keeping routes/API/internal symbols as `issue`. - Updates onboarding and release-smoke browser selectors from `Create & Open Issue` to `Create & Open Task`. - Adds a terminology note to `skills/paperclip/SKILL.md` clarifying that task and issue refer to the same Paperclip work item. - Resolves the only cherry-pick conflict by keeping current search artifacts support and changing visible search copy to "tasks". ## Verification - `pnpm --filter @paperclipai/ui build` passed. - `NODE_ENV=test pnpm exec vitest run ui/src/components/IssuesList.test.tsx ui/src/components/Sidebar.test.tsx ui/src/components/NewIssueDialog.test.tsx ui/src/pages/IssueDetail.test.tsx` passed: 4 files, 66 tests. - `git diff --check origin/master...HEAD` passed. - Diff is 80 files, below Greptile's 100-file limit. - Before/after UI copy examples: "Issues" -> "Tasks", "New Issue" -> "New Task", "Create & Open Issue" -> "Create & Open Task". ## Risks - Medium copy-risk: this intentionally changes user-facing terminology broadly while keeping internal issue identifiers and routes unchanged. - Some docs and APIs still say `issue`; the skill note clarifies this so agents do not treat task and issue as separate entities. - Browser-level visual validation is expected from CI because this local container is missing usable browser dependencies. > For core feature work, check [`ROADMAP.md`](ROADMAP.md) first and discuss it in `#dev` before opening the PR. Feature PRs that overlap with planned core work may need to be redirected — check the roadmap first. See `CONTRIBUTING.md`. ## Model Used Scott Tong authored the original `PAP-57` copy migration, assisted by Claude Opus 4.8 and Paperclip agents per the preserved commit metadata. Codex / GPT-5-class coding agent with shell, GitHub CLI, and repository access performed the PR split, conflict resolution, skill note, and verification. ## Checklist - [x] I have included a thinking path that traces from project context to this change - [x] I have specified the model used (with version and capability details) - [x] I have checked ROADMAP.md and confirmed this PR does not duplicate planned core work - [x] I have searched GitHub for duplicate or related PRs and linked them above - [x] I have either (a) linked existing issues with `Fixes: #` / `Closes #` / `Refs #` OR (b) described the issue in-PR following the relevant issue template - [x] I have run tests locally and they pass - [x] I have added or updated tests where applicable - [x] If this change affects the UI, I have included before/after screenshots - [x] I have updated relevant documentation to reflect my changes - [x] I have considered and documented any risks above - [x] All Paperclip CI gates are green - [x] Greptile is 5/5 with no open P2s, recommendations, or follow-ups - [x] I will address all Greptile and reviewer comments before requesting merge --------- Co-authored-by: scotttong <scott.tong@gmail.com> Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com> Co-authored-by: Paperclip <noreply@paperclip.ing>
182 lines
6.5 KiB
TypeScript
182 lines
6.5 KiB
TypeScript
import { test, expect } from "@playwright/test";
|
|
|
|
/**
|
|
* E2E: Onboarding wizard flow (skip_llm mode).
|
|
*
|
|
* Walks through the 4-step OnboardingWizard:
|
|
* Step 1 — Name your company
|
|
* Step 2 — Create your first agent (adapter selection + config)
|
|
* Step 3 — Give it something to do (task creation)
|
|
* Step 4 — Ready to launch (summary + open issue)
|
|
*
|
|
* By default this runs in skip_llm mode: we do NOT assert that an LLM
|
|
* heartbeat fires. Set PAPERCLIP_E2E_SKIP_LLM=false to enable LLM-dependent
|
|
* assertions (requires a valid ANTHROPIC_API_KEY).
|
|
*/
|
|
|
|
const SKIP_LLM = process.env.PAPERCLIP_E2E_SKIP_LLM !== "false";
|
|
|
|
const COMPANY_NAME = `E2E-Test-${Date.now()}`;
|
|
const AGENT_NAME = "CEO";
|
|
const TASK_TITLE = "E2E test task";
|
|
|
|
test.describe("Onboarding wizard", () => {
|
|
test("completes full wizard flow", async ({ page }) => {
|
|
await page.goto("/onboarding");
|
|
|
|
const wizardHeading = page.locator("h3", { hasText: "Name your company" });
|
|
|
|
await expect(wizardHeading).toBeVisible({ timeout: 5_000 });
|
|
|
|
const companyNameInput = page.locator('input[placeholder="Acme Corp"]');
|
|
await companyNameInput.fill(COMPANY_NAME);
|
|
|
|
const nextButton = page.getByRole("button", { name: "Next" });
|
|
await nextButton.click();
|
|
|
|
await expect(
|
|
page.locator("h3", { hasText: "Create your first agent" })
|
|
).toBeVisible({ timeout: 30_000 });
|
|
|
|
const agentNameInput = page.locator('input[placeholder="CEO"]');
|
|
await expect(agentNameInput).toHaveValue(AGENT_NAME);
|
|
|
|
await expect(
|
|
page.locator("button", { hasText: "Claude Code" }).locator("..")
|
|
).toBeVisible();
|
|
|
|
await page.getByRole("button", { name: "More Agent Adapter Types" }).click();
|
|
await expect(page.getByRole("button", { name: "Process" })).toHaveCount(0);
|
|
|
|
await page.getByRole("button", { name: "Next" }).click();
|
|
|
|
await expect(
|
|
page.locator("h3", { hasText: "Give it something to do" })
|
|
).toBeVisible({ timeout: 30_000 });
|
|
|
|
const baseUrl = page.url().split("/").slice(0, 3).join("/");
|
|
if (SKIP_LLM) {
|
|
const companiesAfterAgentRes = await page.request.get(`${baseUrl}/api/companies`);
|
|
expect(companiesAfterAgentRes.ok()).toBe(true);
|
|
const companiesAfterAgent = await companiesAfterAgentRes.json();
|
|
const companyAfterAgent = companiesAfterAgent.find(
|
|
(c: { name: string }) => c.name === COMPANY_NAME
|
|
);
|
|
expect(companyAfterAgent).toBeTruthy();
|
|
|
|
const agentsAfterCreateRes = await page.request.get(
|
|
`${baseUrl}/api/companies/${companyAfterAgent.id}/agents`
|
|
);
|
|
expect(agentsAfterCreateRes.ok()).toBe(true);
|
|
const agentsAfterCreate = await agentsAfterCreateRes.json();
|
|
const ceoAgentAfterCreate = agentsAfterCreate.find(
|
|
(a: { name: string }) => a.name === AGENT_NAME
|
|
);
|
|
expect(ceoAgentAfterCreate).toBeTruthy();
|
|
|
|
const disableWakeRes = await page.request.patch(
|
|
`${baseUrl}/api/agents/${ceoAgentAfterCreate.id}?companyId=${encodeURIComponent(companyAfterAgent.id)}`,
|
|
{
|
|
data: {
|
|
runtimeConfig: {
|
|
heartbeat: {
|
|
enabled: false,
|
|
intervalSec: 300,
|
|
wakeOnDemand: false,
|
|
cooldownSec: 10,
|
|
maxConcurrentRuns: 5,
|
|
},
|
|
},
|
|
},
|
|
}
|
|
);
|
|
expect(disableWakeRes.ok()).toBe(true);
|
|
}
|
|
|
|
const taskTitleInput = page.locator(
|
|
'input[placeholder="e.g. Research competitor pricing"]'
|
|
);
|
|
await taskTitleInput.clear();
|
|
await taskTitleInput.fill(TASK_TITLE);
|
|
|
|
await page.getByRole("button", { name: "Next" }).click();
|
|
|
|
await expect(
|
|
page.locator("h3", { hasText: "Ready to launch" })
|
|
).toBeVisible({ timeout: 30_000 });
|
|
|
|
await expect(page.locator("text=" + COMPANY_NAME)).toBeVisible();
|
|
await expect(page.locator("text=" + AGENT_NAME)).toBeVisible();
|
|
await expect(page.locator("text=" + TASK_TITLE)).toBeVisible();
|
|
|
|
await page.getByRole("button", { name: "Create & Open Task" }).click();
|
|
|
|
await expect(page).toHaveURL(/\/issues\//, { timeout: 30_000 });
|
|
|
|
const companiesRes = await page.request.get(`${baseUrl}/api/companies`);
|
|
expect(companiesRes.ok()).toBe(true);
|
|
const companies = await companiesRes.json();
|
|
const company = companies.find(
|
|
(c: { name: string }) => c.name === COMPANY_NAME
|
|
);
|
|
expect(company).toBeTruthy();
|
|
|
|
const agentsRes = await page.request.get(
|
|
`${baseUrl}/api/companies/${company.id}/agents`
|
|
);
|
|
expect(agentsRes.ok()).toBe(true);
|
|
const agents = await agentsRes.json();
|
|
const ceoAgent = agents.find(
|
|
(a: { name: string }) => a.name === AGENT_NAME
|
|
);
|
|
expect(ceoAgent).toBeTruthy();
|
|
expect(ceoAgent.role).toBe("ceo");
|
|
expect(ceoAgent.adapterType).not.toBe("process");
|
|
|
|
const instructionsBundleRes = await page.request.get(
|
|
`${baseUrl}/api/agents/${ceoAgent.id}/instructions-bundle?companyId=${company.id}`
|
|
);
|
|
expect(instructionsBundleRes.ok()).toBe(true);
|
|
const instructionsBundle = await instructionsBundleRes.json();
|
|
expect(
|
|
instructionsBundle.files.map((file: { path: string }) => file.path).sort()
|
|
).toEqual(["AGENTS.md", "HEARTBEAT.md", "SOUL.md", "TOOLS.md"]);
|
|
|
|
const issuesRes = await page.request.get(
|
|
`${baseUrl}/api/companies/${company.id}/issues`
|
|
);
|
|
expect(issuesRes.ok()).toBe(true);
|
|
const issues = await issuesRes.json();
|
|
const task = issues.find(
|
|
(i: { title: string }) => i.title === TASK_TITLE
|
|
);
|
|
expect(task).toBeTruthy();
|
|
expect(task.assigneeAgentId).toBe(ceoAgent.id);
|
|
expect(task.description).toContain(
|
|
"You are the CEO. You set the direction for the company."
|
|
);
|
|
expect(task.description).not.toContain("github.com/paperclipai/companies");
|
|
|
|
if (!SKIP_LLM) {
|
|
await expect(async () => {
|
|
const res = await page.request.get(
|
|
`${baseUrl}/api/issues/${task.id}`
|
|
);
|
|
const issue = await res.json();
|
|
expect(["in_progress", "done"]).toContain(issue.status);
|
|
}).toPass({ timeout: 120_000, intervals: [5_000] });
|
|
} else {
|
|
await expect
|
|
.poll(async () => {
|
|
const runsRes = await page.request.get(
|
|
`${baseUrl}/api/companies/${company.id}/heartbeat-runs?agentId=${ceoAgent.id}`
|
|
);
|
|
expect(runsRes.ok()).toBe(true);
|
|
const runs = await runsRes.json();
|
|
return Array.isArray(runs) ? runs.length : -1;
|
|
}, { timeout: 10_000, intervals: [500, 1_000, 2_000] })
|
|
.toBe(0);
|
|
}
|
|
});
|
|
});
|