Discover Ui Surface

Before you write Playwright scripts for something like LinkedIn or Notion, run through the flow once with this and it'll build you a map of what selectors actually work and which API calls fire when you click things. It's the difference between guessing at CSS selectors in a React app and having a tested reference. Three modes depending on how much detail you need: Chrome DevTools Recorder if you just want the basics fast, Playwright observer for richer capture, or Playwright codegen plus trace for the full structured output. Saves you from that painful cycle of write script, run it, watch it break on a data-testid that changed yesterday.

Install to Claude Code

npx -y skills add zhixiangluo/10xproductivity --skill discover-ui-surface --agent claude-code