From 4ffa7417a359ef4eae09f61d7da4de06539462ca Mon Sep 17 00:00:00 2001
From: Craig Jennings <c@cjennings.net>
Date: Sun, 19 Apr 2026 15:24:51 -0500
Subject: refactor(playwright): split into playwright-js + playwright-py
 variants
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Rename `playwright-skill/` → `playwright-js/` and add `playwright-py/`
as a verbatim fork of Anthropic's official `webapp-testing` skill
(Apache-2.0). Cross-pollinate: each skill gains patterns and helpers
inspired by the other's strengths, with upstream semantics preserved.

## playwright-js (JS/TS stack)

Renamed from playwright-skill; upstream lackeyjb MIT content untouched.
New sections added (clearly marked, preserving upstream semantics):

- Static HTML vs Dynamic Webapp decision tree (core Anthropic methodology)
- Reconnaissance-Then-Action pattern (navigate → networkidle → inspect → act)
- Console Log Capture snippet (page.on console/pageerror/requestfailed)

Description updated to clarify JS/TS stack fit (React/Next/Vue/Svelte/Node)
and reference `/playwright-py` as the Python sibling.

## playwright-py (Python stack)

Verbatim fork of anthropics/skills/skills/webapp-testing; upstream SKILL.md
and bundled `scripts/with_server.py` + examples kept intact. New scripts
and examples added (all lackeyjb-style conveniences in Python):

Scripts:
  scripts/detect_dev_servers.py   Probe common localhost ports for HTTP
                                  servers; outputs JSON of found services.
  scripts/safe_actions.py         safe_click, safe_type (retry-wrapped),
                                  handle_cookie_banner (common selectors),
                                  build_context_with_headers (env-var-
                                  driven: PW_HEADER_NAME / PW_HEADER_VALUE /
                                  PW_EXTRA_HEADERS='{…json…}').

Examples:
  examples/login_flow.py          Login form + wait_for_url.
  examples/broken_links.py        Scan visible external hrefs via HEAD.
  examples/responsive_sweep.py    Multi-viewport screenshots to /tmp.

SKILL.md gains 5 "Added:" sections documenting the new scripts, retry
helpers, env-header injection, and /tmp script discipline. Attribution
notes explicitly mark upstream vs local additions.

## Makefile

SKILLS: playwright-skill → playwright-js + playwright-py
deps target: extended Playwright step to install Python package +
  Chromium via `python3 -m pip install --user playwright && python3 -m
  playwright install chromium` when playwright-py/ is present. Idempotent
  (detected via `python3 -c "import playwright"`).

## Usage

Both skills symlinked globally via `make install`. Invoke whichever
matches the project stack — cross-references in descriptions route you
to the right one. Run `make deps` once to install both runtimes.
---
 Makefile | 25 ++++++++++++++++++-------
 1 file changed, 18 insertions(+), 7 deletions(-)

(limited to 'Makefile')

diff --git a/Makefile b/Makefile
index c78bad6..74d1905 100644
--- a/Makefile
+++ b/Makefile
@@ -6,7 +6,7 @@ RULES_DIR  := $(HOME)/.claude/rules
 SKILLS     := c4-analyze c4-diagram debug add-tests respond-to-review review-pr fix-issue security-check \
               arch-design arch-decide arch-document arch-evaluate \
               brainstorm codify root-cause-trace five-whys prompt-engineering \
-              playwright-skill
+              playwright-js playwright-py
 RULES      := $(wildcard claude-rules/*.md)
 LANGUAGES  := $(notdir $(wildcard languages/*))
 
@@ -64,15 +64,26 @@ deps: ## Install required tools (claude, node, jq, fzf, ripgrep, emacs, playwrig
 		{ echo "  ripgrep:    installing..."; $(call install_pkg,ripgrep); }
 	@command -v emacs >/dev/null 2>&1 && echo "  emacs:      installed" || \
 		{ echo "  emacs:      installing..."; $(call install_pkg,emacs); }
-	@if [ -d "$(CURDIR)/playwright-skill" ]; then \
-		if [ -d "$(CURDIR)/playwright-skill/node_modules/playwright" ]; then \
-			echo "  playwright: installed (skill node_modules present)"; \
+	@if [ -d "$(CURDIR)/playwright-js" ]; then \
+		if [ -d "$(CURDIR)/playwright-js/node_modules/playwright" ]; then \
+			echo "  playwright (js):  installed (skill node_modules present)"; \
 		else \
-			echo "  playwright: running skill setup (npm install + chromium download ~300 MB)..."; \
-			(cd "$(CURDIR)/playwright-skill" && npm run setup); \
+			echo "  playwright (js):  running skill setup (npm install + chromium download ~300 MB)..."; \
+			(cd "$(CURDIR)/playwright-js" && npm run setup); \
 		fi \
 	else \
-		echo "  playwright: skipped (playwright-skill/ not present in this repo)"; \
+		echo "  playwright (js):  skipped (playwright-js/ not present)"; \
+	fi
+	@if [ -d "$(CURDIR)/playwright-py" ]; then \
+		if python3 -c "import playwright" >/dev/null 2>&1; then \
+			echo "  playwright (py):  installed (python package importable)"; \
+		else \
+			echo "  playwright (py):  installing via pip --user..."; \
+			python3 -m pip install --user playwright && \
+			python3 -m playwright install chromium; \
+		fi \
+	else \
+		echo "  playwright (py):  skipped (playwright-py/ not present)"; \
 	fi
 	@echo "Done."
 
-- 
cgit v1.2.3