browse

Files (1)

• SKILL.md

SKILL.md (first lines)

Open a URL in a headless browser, take screenshots, and report what you see.

Target: the task/scope the user described when invoking this skill (if none given, ask or infer from context)

## Steps
1. **Check Playwright**: run `npx playwright --version`. If missing, install: `npm install playwright && npx playwright install chromium`.
2. **Create and run this browser script** (substitute the target URL):
```javascript
const { chromium } = require('playwright');
(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();

  // Register error collectors BEFORE goto so load-time errors are captured
  const errors = [];
  page.on('console', msg => { if (msg.type() === 'error') errors.push(msg.text()); });
  page.on('pageerror', err => { errors.push(err.message); });

  await page.setViewportSize({ width: 1280, height: 720 });
  await page.goto('TARGET_URL', { waitUntil: 'networkidle' });
  await page.screenshot({ path: '/tmp/browse-desktop.png', fullPage: true });

  await page.setViewportSize({ width: 375, height: 812 });
  await page.screenshot({ path: '/tmp/browse-mobile.png', fullPage: true });

  const title = await page.title();
  const metaDesc = await page.$eval('meta[name="description"]', el => el.content).catch(() => 'none');
  console.log(JSON.stringify({ title, metaDesc, errors }, null, 2));
  await browser.close();
})();
```
3. **View the screenshots** (`/tmp/browse-desktop.png`, `/tmp/browse-mobile.png`).
4. **Report**: page title & meta description, both screenshots, console errors, broken images/missing resources, basic observations (layout, loading state, visible content).

## Rules
- Always wait for `networkidle` before screenshotting.
- Capture both desktop (1280px) and mobile (375px).
- Report console errors even if the page looks fine.
- If the URL requires auth, inform the user and ask for credentials.
- Clean up temp screenshot files after showing them.
- If the task/scope the user described when invoking this skill (if none given, ask or infer from context) is not a URL, check if it's a local dev server route and construct the full URL.

From Hbin77/codex-kit, MIT.

More from Hbin77/codex-kit