Generate Playwright Tests

Maeris MCP can automatically generate comprehensive Playwright test suites by analyzing your codebase. It scans your React, Vue, Angular, or plain HTML source files, maps all user-facing flows, and produces both positive (happy-path) and negative (validation-failure) test cases for every flow it discovers.

Running Test Generation

From your project root, run:

maeris test generate

You will be prompted for your application's base URL (the URL where your app runs locally, e.g. http://localhost:3000). Maeris uses this as the starting point for every generated test — all tests navigate from the base URL and click through the interface to reach target pages.

# You can also pass the base URL directly maeris test generate --url http://localhost:3000

How It Works: Code Scanning

Maeris performs a multi-phase scan of your source files:

Phase 1: Code Map

Maeris reads all React (.jsx/.tsx), Vue (.vue), Angular (.ts/.html), or plain HTML files in your project. It identifies every interactive element — buttons, forms, inputs, links, modals, navigation items — and builds a structural map of your application.

Phase 2: Flow Discovery

From the code map, Maeris identifies distinct user flows: login/logout, registration, form submissions, CRUD operations (create, read, update, delete), navigation paths, settings pages, modals, data tables, and more.

Phase 3: Test Generation

For each discovered flow, Maeris generates at minimum one positive test (the happy path — filling in correct data and verifying success) and one negative test (submitting invalid data, empty fields, or triggering error states). Complex flows receive additional edge-case tests.

Supported Frameworks

React — .jsx and .tsx files, including Next.js projects
Vue.js — .vue single-file components (Vue 2 and Vue 3)
Angular — .component.ts and .component.html files
Plain HTML — Static HTML files with inline or external JavaScript
Svelte — .svelte files (basic support)

Flow Types Detected

Maeris looks for the following categories of user flows:

Authentication — Login, logout, registration, password reset, email verification
Forms — Contact forms, settings forms, profile updates, search inputs
CRUD operations — Create, read, update, delete for any data entities
Navigation — Menu items, breadcrumbs, tabs, sidebar links, back/forward
Modals & dialogs — Opening, confirming, and dismissing modal windows
Data tables — Sorting, filtering, pagination, row selection
File uploads — File picker interactions and upload validation
Multi-step wizards — Onboarding flows, checkout processes

Test Navigation Pattern

Important: All tests start from base_url

Every generated test begins with a page.goto(base_url) call and then navigates to the target page by clicking through the UI — exactly as a real user would. Tests never jump directly to deep URLs like /dashboard/settings because this bypasses authentication and state setup that only the full navigation path can establish.

Viewing Generated Tests

After generation completes, list all generated tests:

maeris test list

Tests are organized by flow category. Example output:

Generated Tests (24 total)

Authentication
  [+] login_valid_credentials
  [-] login_invalid_password
  [-] login_empty_email

Registration
  [+] register_new_user
  [-] register_duplicate_email
  [-] register_weak_password

Contact Form
  [+] submit_contact_form
  [-] submit_empty_contact_form

...

Tests marked [+] are positive/happy-path tests. Tests marked [-] are negative/validation tests.

Next Steps

Once tests are generated, run them against your live application using the auto-fix loop. See the Run & Auto-Fix Tests guide to execute your tests and have Maeris automatically repair any failing selectors.