headless-web-viewer
Headless Web Viewer
Run
Render + save artifacts
node ./scripts/render_url_playwright.mjs '<URL>' \
--out-html /tmp/page.html \
--out-text /tmp/page.txt \
--out-screenshot /tmp/page.png
Print to stdout (pipe-friendly)
node ./scripts/render_url_playwright.mjs '<URL>' --print text
Dependencies
This skill requires Playwright in the environment where it runs.
Option A (recommended for global use, no browser download)
Install Playwright Core and use system Chrome:
npm i -D playwright-core
Run with --channel chrome.
Option B (bundled browsers)
npm i -D playwright
npx playwright install
Do not auto-install dependencies unless the user asks.
Tips
- If a page hangs on
networkidle, retry with--wait-until domcontentloaded. - If a page blocks headless Chromium, try setting
--user-agentto a realistic UA.
More from okwinds/miscellany
prd-to-engineering-spec
Transform PRD (Product Requirements Document) into actionable engineering specifications. Creates detailed technical specs that developers can implement step-by-step without ambiguity. Covers data modeling, API design, business logic, security architecture, deployment, and agent system design. Use when: converting product requirements to technical specs, validating PRD completeness, planning technical implementation, creating task breakdowns, or defining test specifications. Triggers: 'PRD to spec', 'convert requirements', 'technical spec from PRD', 'engineering doc from requirements', 'validate PRD'.
45prd-writing-guide
Write complete, unambiguous PRDs that development teams can implement without guesswork. Includes requirement discovery framework, structured documentation methodology, completeness checklists, and common pitfall avoidance. Use when: writing new PRDs, reviewing PRD drafts, validating requirement completeness, preparing for engineering handoff. Triggers: 'write PRD', '写PRD', '产品需求文档', '需求文档', '需求规格', '需求评审', '完善需求', 'create requirements doc', 'product requirements', 'feature spec', 'requirements document'. Anti-triggers: 'technical design doc', 'architecture design', 'implementation plan', 'API design', '架构设计', '技术方案', '实现方案', '接口设计'.
23codebase-spec-extractor
Extract complete, replicable engineering specifications from existing codebases. Produces documentation detailed enough to fully replicate a project without seeing the original source code—even using a different tech stack. Use when: analyzing existing projects, documenting legacy systems, creating technical specs from code, preparing for system migration, or onboarding new teams. Triggers: 'extract spec from code', 'document codebase', 'analyze project architecture', 'create spec from existing system'.
16pptx-offline
PPTX 文档离线读写:解析/替换/重排/缩略图、OOXML 解包编辑回包,以及 html2pptx(HTML→PPT)工作流。适用于生成与维护演示文稿(依赖安装可能需要网络)。
14prd-to-uiux-rd-spec
从产品 PRD 产出“复刻级可落地”的 UI/UX 研发规格文档包(目录同构骨架、公共基座、组件/页面契约、覆盖映射、索引与 worklog)。适用于需要把 PRD 转成前端可复刻实现的规格文档、UI/UX 研发规格、界面契约与验收标准的场景;避免用于只要视觉灵感/纯 UI 赏析或直接写代码实现的请求。
14ui-ux-spec-genome
A portable, reproducible UI/UX spec standard: scan a frontend repo for UI sources and scaffold a ui-ux-spec documentation bundle (tokens, global styles, components, patterns, pages, a11y). Also supports plan-driven UI-only refactors based on an existing ui-ux-spec. Excludes business logic and domain workflows.
12