# Playwright Browser Instructions for Open WebUI Coding AI

Use Playwright when the user asks you to inspect, test, debug, screenshot, or interact with a real webpage or web app.

Playwright is available inside the Open WebUI terminal container.

## What Playwright Is For

Use Playwright for:

- checking whether a webpage actually renders
- taking screenshots of an app
- testing buttons, forms, menus, routing, and mobile layouts
- inspecting page text after JavaScript runs
- debugging frontend errors that do not show up with `curl`
- verifying `https://preview.boogerclub.com`

Do not use Playwright as a replacement for normal web search. Use it when browser rendering or interaction matters.

## Quick Commands

Take a screenshot:

```bash
npx playwright screenshot --browser=chromium https://example.com /home/user/example.png
```

Take a screenshot of the live Vite preview:

```bash
npx playwright screenshot --browser=chromium https://preview.boogerclub.com /home/user/preview.png
```

Open a mobile-sized screenshot:

```bash
npx playwright screenshot --browser=chromium --viewport-size=390,844 https://preview.boogerclub.com /home/user/preview-mobile.png
```

Generate a Playwright test scaffold in an app:

```bash
cd /home/user/projects/YOUR_APP
npm install -D @playwright/test
npx playwright install chromium
npx playwright test
```

## One-Off Page Inspection Script

For quick rendered-page inspection, create a temporary script like this:

```js
const { chromium } = require('playwright')

;(async () => {
  const browser = await chromium.launch({ headless: true })
  const page = await browser.newPage({ viewport: { width: 1440, height: 1000 } })
  await page.goto('https://preview.boogerclub.com', { waitUntil: 'networkidle' })
  console.log(await page.title())
  console.log((await page.locator('body').innerText()).slice(0, 2000))
  await page.screenshot({ path: '/home/user/preview.png', fullPage: true })
  await browser.close()
})()
```

Run it with:

```bash
node script-name.js
```

## Current Verified State

Playwright Chromium has been installed and verified in this container.

Smoke test that passed:

```bash
cd /home/user
npx playwright screenshot --browser=chromium https://example.com /home/user/playwright-smoke.png
```

If Playwright later says browser binaries are missing, run:

```bash
npx playwright install chromium
```

If Chromium fails with missing shared libraries, run this from the host against the Open WebUI compose stack:

```bash
docker compose exec -u root open-terminal sh -lc 'cd /home/user && npx playwright install-deps chromium'
```