import { chromium } from 'playwright';
import { mkdirSync } from 'node:fs';

mkdirSync('/tmp/nib-shots', { recursive: true });
const browser = await chromium.launch();
const page = await browser.newPage({ viewport: { width: 1280, height: 900 } });
await page.goto('http://localhost:8931/demo/harness.html');
await page.waitForSelector('#tree >> text=leftpad', { timeout: 10000 });
await page.waitForTimeout(500);
await page.screenshot({ path: '/tmp/nib-shots/1-boot.png', fullPage: true });

// select main.cjs, run guest
await page.click('#tree >> text=main.cjs');
await page.click('text=Run');
await page.waitForTimeout(1200);
await page.screenshot({ path: '/tmp/nib-shots/2-run.png', fullPage: true });

// new file flow
await page.click('#tree >> text=app');
await page.click('text=New file');
await page.fill('#inline-row input', 'hello.txt');
await page.keyboard.press('Enter');
await page.fill('textarea', 'hi from the harness');
await page.click('text=Save');
await page.waitForTimeout(500);
await page.screenshot({ path: '/tmp/nib-shots/3-created.png', fullPage: true });

// run echo guest
await page.fill('#entry', '/app/echo.cjs');
await page.click('text=Run');
await page.waitForTimeout(1200);
await page.screenshot({ path: '/tmp/nib-shots/4-echo.png', fullPage: true });

await browser.close();
console.log('done');