95 lines
3.1 KiB
JavaScript
95 lines
3.1 KiB
JavaScript
|
// One-off screenshot capture for PR documentation.
|
||
|
|
// Usage: BASE_URL=http://localhost:5177 node scripts/screenshot-seed-kits.mjs
|
||
|
|
|
||
|
|
import { mkdir } from "node:fs/promises";
|
||
|
|
import { resolve } from "node:path";
|
||
|
|
import { chromium } from "@playwright/test";
|
||
|
|
|
||
|
|
const BASE_URL = process.env.BASE_URL ?? "http://localhost:5177";
|
||
|
|
const OUT_DIR = resolve(process.cwd(), "docs/seed-kits");
|
||
|
|
await mkdir(OUT_DIR, { recursive: true });
|
||
|
|
|
||
|
|
const browser = await chromium.launch();
|
||
|
|
const ctx = await browser.newContext({
|
||
|
|
viewport: { width: 1440, height: 900 },
|
||
|
|
deviceScaleFactor: 2,
|
||
|
|
});
|
||
|
|
|
||
|
|
await ctx.addInitScript(() => {
|
||
|
|
window.localStorage.setItem(
|
||
|
|
"openconcho:instances",
|
||
|
|
JSON.stringify({
|
||
|
|
instances: [
|
||
|
|
{ id: "neo", name: "Neo (personal)", baseUrl: "http://localhost:8001", token: "" },
|
||
|
|
{ id: "jeeves", name: "Jeeves (CodeWalnut)", baseUrl: "http://localhost:8002", token: "" },
|
||
|
|
],
|
||
|
|
activeId: "neo",
|
||
|
|
}),
|
||
|
|
);
|
||
|
|
window.localStorage.setItem(
|
||
|
|
"openconcho:seed-kits",
|
||
|
|
JSON.stringify([
|
||
|
|
{
|
||
|
|
id: "kit_ben_personal",
|
||
|
|
name: "Ben — personal core",
|
||
|
|
description: "Identity facts Ben wants every personal-tier agent to know.",
|
||
|
|
lines: [
|
||
|
|
"Name: Ben Sheridan-Edwards",
|
||
|
|
"Preferred address: Chief",
|
||
|
|
"Email: ben@codewalnut.com",
|
||
|
|
"Role: Founder",
|
||
|
|
"Github: BenSheridanEdwards",
|
||
|
|
],
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id: "kit_codewalnut_context",
|
||
|
|
name: "CodeWalnut work context",
|
||
|
|
description: "Work-tier identity for Jeeves and any future CodeWalnut agents.",
|
||
|
|
lines: ["Employer: CodeWalnut", "Role: Founder", "Reports to: (self)"],
|
||
|
|
},
|
||
|
|
]),
|
||
|
|
);
|
||
|
|
});
|
||
|
|
|
||
|
|
const page = await ctx.newPage();
|
||
|
|
|
||
|
|
async function shot(name, options = {}) {
|
||
|
|
const file = resolve(OUT_DIR, `${name}.png`);
|
||
|
|
await page.screenshot({ path: file, fullPage: false, ...options });
|
||
|
|
console.log("wrote", file);
|
||
|
|
}
|
||
|
|
|
||
|
|
// 1. List view with built-ins + user kits
|
||
|
|
await page.goto(`${BASE_URL}/seed-kits`, { waitUntil: "networkidle" });
|
||
|
|
await page.waitForSelector("text=Seed Kits");
|
||
|
|
await page.waitForTimeout(400); // settle animations
|
||
|
|
await shot("01-list");
|
||
|
|
|
||
|
|
// 2. Create form (use the "New kit" button)
|
||
|
|
await page
|
||
|
|
.getByRole("button", { name: /^New kit$/ })
|
||
|
|
.first()
|
||
|
|
.click();
|
||
|
|
await page.waitForSelector("text=New seed kit");
|
||
|
|
await page.waitForTimeout(300);
|
||
|
|
await shot("02-create-form");
|
||
|
|
|
||
|
|
// 3. Back to list, then open apply dialog on the "Ben — personal core" user kit
|
||
|
|
await page.goto(`${BASE_URL}/seed-kits`, { waitUntil: "networkidle" });
|
||
|
|
await page.waitForSelector("text=Ben — personal core");
|
||
|
|
await page.waitForTimeout(400);
|
||
|
|
|
||
|
|
// Find the Apply button next to "Ben — personal core" card
|
||
|
|
const benCard = page.locator("div", { hasText: /^Ben — personal core/ }).first();
|
||
|
|
// Just click the visible Apply button on that kit row
|
||
|
|
const applyButtons = page.getByRole("button", { name: /^Apply$/ });
|
||
|
|
const applyCount = await applyButtons.count();
|
||
|
|
// User kits are rendered after built-ins; the Ben card is the 4th apply button (0-3 built-ins, 4 = first user kit)
|
||
|
|
await applyButtons.nth(3).click();
|
||
|
|
await page.waitForSelector("text=Apply seed kit");
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
await shot("03-apply-dialog");
|
||
|
|
|
||
|
|
await browser.close();
|
||
|
|
console.log("done");
|