Skip to content
Get packs

Playwright Login Flows

Automate website logins in Playwright tests, including OAuth, saved sessions and TOTP 2FA

Source Download skill
Repository
andrewyng/context-hub
Stars
13,984
Licence
MIT
Files
1 file

What it does

This is a reference guide that teaches an AI agent standard patterns for scripting logins in Playwright, a browser-automation tool used for end-to-end tests. Once installed, when you ask for help with logging into a web app in an automated test, the agent can draw on ready-made code for username/password forms, Google-style SSO redirects, reusing a saved signed-in session so tests don't log in every time, and entering time-based one-time codes for two-factor authentication.

Great for

  • Developers writing end-to-end test suites for a web app that requires login
  • QA engineers who want faster test runs by reusing a saved signed-in browser state
  • Teams setting up CI test accounts with environment-variable credentials

Skip it if

  • Scraping or automating logins to sites you do not own or have permission to test, since this may violate terms of service
  • Production accounts with real credentials, because the examples store test passwords in code and a saved auth.json file that must be protected
  • Non-technical users looking for a ready-made tool; this only provides code patterns that require a developer to run

Try asking

  • “Write a Playwright helper that logs into our app with a username and password and waits for the dashboard”
  • “Set up Playwright global setup so my tests reuse a saved login session via storageState”
  • “Add TOTP two-factor login to my Playwright end-to-end tests using a test secret”
  • “Show me how to log in through a Google SSO button in a Playwright test”
Step-by-step guide: how to use Playwright Login FlowsInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 1 original files, the MIT licence and an attribution note.

    login-flows.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip login-flows.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip login-flows.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Keep test credentials in environment variables or a secrets manager, and add auth.json to .gitignore since it contains live session cookies
  • Ask the agent to adapt the selectors to your app's actual form fields, as the examples use generic names like [name="username"]
  • Use a dedicated test account for OAuth and MFA flows, since those providers often rate-limit or flag automated logins

What's inside

  • SKILL.md

Redistributed unmodified from andrewyng/context-hub under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.