MarmicodePragmatic UI Testing with Playwright Workshop
3 Days · Online
🐣 Early Bird starts at €970
Three days to turn UI testing chaos into a well-seasoned Playwright strategy.Learn to build tests that survive refactors, migrations, and AI-assisted development.
🍱 What you will learn
Test Angular, React, Vue, or framework-free apps with the same Playwright toolbox.
Write tests that tell stories — not implementation details — and survive refactors.
Plug Playwright into your AI agent for reproduction, specification, and self-healing tests.
Master request interception, auth setup, and Playwright Clock for fast, reliable tests.
Learn when and how to use Gloves, Test Harnesses, and Playwright Component Testing.
Detect visual regressions without pain.
Enjoy a buffet of tips and tricks to adopt a scalable, cost-effective UI testing strategy.
🗓️ Program
- Why test.
- The different types of tests.
- Testing strategies: ice cream cone, pyramid vs. honeycomb.
- Developer eXperience.
- Speed.
- Debuggability.
- Retry-ability.
- Consistency and stability.
- AI-Assisted Testing.
- Setting up Playwright.
- Setting up Playwright with Nx.
- Implementing and running a first Playwright test.
- Fixtures.
- Assertions.
- Organizing tests.
- Interacting with the DOM.
- Interacting with forms.
- The locator philosophy: web-first, auto-waiting, retry-ability.
- Recommended locators and priority: `getByRole`, `getByLabel`, `getByText` & co.
- Filtering, chaining, and resolving ambiguity (`filter`, `nth`, strict mode).
- Accessibility and testability: why `getByRole` is more than a technical detail.
- Rewriting CSS-driven tests with semantic locators.
- Installing and running tests from the IDE.
- Test implementation assistance and recording.
- Recording a first test.
- UI Mode and Trace Viewer: development and debugging experience.
- Anatomy of a trace: actions, DOM snapshots, network, console.
- `page.pause()`, Inspector, and VSCode breakpoints.
- Diagnosing flakiness via retries and traces.
- Diagnosing a flaky test from its trace.
- Pros and cons of the different techniques.
- Request interception vs. sandboxes.
- Intercepting requests.
- Using a sandbox.
- The cost of repeated logins.
- The `auth.setup.ts` pattern with project dependencies.
- UI vs. API authentication: trade-offs and multi-user scenarios.
- Setting up a reusable authentication setup.
- Fake timers and the Playwright Clock API.
- Use cases: debounce, polling, animations, dates.
- Testing without waiting.
- Playing with the timer.
- Accessibility and testability.
- Page objects: benefits and limits.
- The story behind Test Harnesses.
- Gloves & Test Harnesses: how they work.
- Using test harnesses.
- Implementing test harnesses.
- Breaking the boundaries of "isolated testing" with Playwright Component Testing.
- Isolating and testing a component with Playwright.
- Reusing the test harness.
- Test Doubles: Dummies, Stubs, Spies, Mocks & Fakes.
- Overriding dependencies with dependency injection and fakes.
- Testing props, inputs & outputs based communication.
- Testing the presentation.
- Detecting visual regressions.
- Detecting a visual regression on a component with masking of dynamic elements.
- `playwright-cli` vs Playwright MCP: which to pick so your AI agent can use Playwright.
- Annotated screencast: getting the agent to produce a proof video, with annotations of the elements observed on the page.
- The agent → test loop: exploration, reproduction, specification, fix.
- Having the agent reproduce a bug and generate an annotated screencast that explains it.
- Generating a failing test from that reproduction.
- Having the agent fix the bug based on the previous test.
- CI configuration.
- Reporters.
- Parallelization and sharding.
- How to fight flakiness.
- How to design a maintainable and scalable testing strategy.
🎓 Required knowledge
- Web development knowledge: JavaScript & TypeScript fundamentals
- Curiosity about web technologies
- Git fundamentals (e.g. cloning, resetting local changes, switching branches)
👨🏻🏫 Your instructor
Younes Jaaidi
I am a Software Cook who enjoys whipping code until tests pass.
With nearly 20 years of experience in eXtreme Programming, I've coached dozens of teams and trained thousands of developers to cook robust and maintainable software — using Test-Driven Development, pragmatic testing strategies, and a healthy dose of Collective Ownership.
I'm also an Angular Google Developer Expert, an NX Champion, and a mediocre sailor.
🙋 Frequently Asked Questions
Web developers (Angular, React, Vue, or framework-free) who want to write effective, readable, and cost-effective UI tests. Lead developers and tech leads framing their team's testing strategy. Architects and CTOs looking to industrialize frontend testing without sacrificing delivery velocity. Teams stuck with flaky or unmanageable tests who want a structured, scalable approach that fits AI-assisted development.
You should be comfortable with JavaScript and TypeScript fundamentals. No prior Playwright or testing experience is required — we start from the ground up.
A laptop with internet access, microphone, webcam, an up-to-date browser, and installation rights. Detailed setup instructions are sent a few days before the workshop.
Very. You will alternate between short theory sessions and practical exercises on a single use case throughout the three days. Small groups ensure direct coaching and feedback.
No. The techniques apply to Angular, React, Vue, and framework-free apps. Exercises focus on Playwright patterns that transfer across stacks.
Yes. Contact me for a quote and administrative details.
"Book a Session" lets you join a scheduled cohort. "Custom Session" is for companies who want a private, in-house workshop — with optional adjustments to content, duration, or focus areas.
If the workshop doesn't meet your expectations, reach out within 7 days and we'll work it out.