Skip to main content
QASkills.sh
Sign In
90-day learning path

Playwright Automation Roadmap with JavaScript, TypeScript, and AI

This Playwright automation roadmap turns 90 days into four practical phases: JavaScript and TypeScript foundations, Playwright fundamentals, framework and CI/CD engineering, and AI-assisted browser testing. Complete one three-day milestone at a time, build the phase projects, and use the interactive checklist to track progress in this browser.

QA engineers, SDETs, developers, and automation testersBeginner to advanced90 days at 2-3 hours per day
Days
90
Phases
4
Milestones
30
Daily practice
2-3h
Your learning progress
0/30milestones complete

0% complete. Progress is saved only in this browser.

  • Set up Node.js and learn JavaScript runtime basics

    Days 1-3

    Variables, primitive types, operators, template literals, and console debugging.

  • Control flow, loops, and reusable functions

    Days 4-6

    Conditionals, for loops, forEach, function parameters, and return values.

  • Work confidently with arrays, objects, maps, and sets

    Days 7-9

    Practice map, filter, reduce, object access, spread syntax, and destructuring.

  • Modules, classes, and error handling

    Days 10-12

    Use imports, exports, classes, try/catch, and small reusable utilities.

  • Add TypeScript types and interfaces

    Days 13-15

    Configure TypeScript and model test data with types, unions, and interfaces.

  • Master promises, async/await, and safe TypeScript

    Days 16-18

    Understand the event loop, asynchronous errors, generics, and optional chaining.

  • Build a typed data-processing mini project

    Days 19-21

    Read JSON, transform records, validate inputs, and write unit-tested helpers.

Finish line

What you will achieve

  • Write maintainable Playwright tests in TypeScript using resilient locators and web-first assertions.
  • Build an isolated, parallel, cross-browser framework with useful traces, reports, and test data.
  • Run the suite in CI with browser caching, sharding, Docker, and retained failure evidence.
  • Use Playwright CLI, MCP, and test agents with explicit review and safety guardrails.
  • Publish a portfolio-ready capstone that demonstrates a complete quality engineering workflow.

Go deeper

Related QASkills resources

Use these guides and installable skills as references while you complete the roadmap.

Install the Playwright CLI skill

Give your coding agent a structured Playwright CLI browser workflow.

View skill

Playwright testing complete guide

Use the long-form guide as the technical reference for phases two and three.

Read guide

Playwright CLI complete guide

Learn terminal-driven browser automation, sessions, snapshots, and traces.

Read guide

Playwright MCP browser automation

Configure MCP clients, browser capabilities, profiles, and security controls.

Read guide

Questions

Frequently asked questions

Can a beginner complete this Playwright roadmap?

Yes. The first 21 days teach the JavaScript and TypeScript concepts needed later. A complete beginner may extend the plan to 120 days and keep the same phase order.

How much time should I spend each day?

Plan for two to three focused hours per day. Spend roughly one third learning, one third coding, and one third debugging or documenting what you built.

Should I learn JavaScript or TypeScript for Playwright?

Learn JavaScript fundamentals first, then use TypeScript for the automation framework. TypeScript makes fixtures, page objects, test data, and configuration safer to maintain.

When should I start Playwright CLI and MCP?

Start them after you can independently write and debug a Playwright test. That foundation helps you review generated actions and detect weak selectors, assertions, or unsafe agent behavior.

Does this roadmap include CI/CD?

Yes. Days 64 through 72 cover GitHub Actions, browser installation, caching, matrices, sharding, Docker, artifact retention, and a production-style framework capstone.

Is roadmap progress saved to my QASkills account?

No. Progress is stored only in this browser with local storage. It works without signing in and does not write to the QASkills database.

Explore every QASkills roadmap

Compare learning paths, choose your next focus area, and continue with a structured sequence instead of a disconnected tutorial list.

All roadmaps