mcpField
P
Playwright Test Framework Example for AI & Playwright MCP Course by jaktestowac.pl

Playwright Test Framework Example for AI & Playwright MCP Course by jaktestowac.pl

Local
github.com/jaktestowacDeveloper Tools2Updated 78w ago
Repository

About Playwright Test Framework Example for AI & Playwright MCP Course by jaktestowac.pl

An example Playwright test framework for learning and practicing UI and API testing. It is intended for a course exploring AI and Playwright MCP, and includes fixtures and reporting configuration.

Key features

  1. 01Page Object Model UI tests
  2. 02End-to-end API tests
  3. 03Custom Playwright fixtures
  4. 04Multiple report format configuration

Use cases

  1. 01Practice registration and login tests
  2. 02Test article viewing as guest or logged-in user
  3. 03Reference HTML, JUnit, and JSON report setup
#test-automation#test-framework#playwright

Configuration

Local server config is the same for every client. Copy it into your client’s MCP config file.

mcp.json · Universal config
{
  "mcpServers": {
    "playwright-test-framework-mcp-example": {
      "command": "npx",
      "args": [
        "-y",
        "playwright"
      ]
    }
  }
}
Run commandnpx -y playwright

Local servers need a runtime on your machine (e.g. Node.js 18+). Config file locations differ by client; see your client’s docs.

Packages
npmplaywright

Tools

No tool list yet

Local servers expose tools only once running on your machine, and the maintainer has not provided a tool list.

Details

From the project README

Playwright Test Framework Example for AI & Playwright MCP Course by jaktestowac.pl

This repository provides an empty Playwright test framework that was designed to test AI and Playwright MCP (Model Context Protocol) in course

(Polish: "Playwright z AI – czyli jak usprawnić swoją pracę" - "Playwright with AI - how to improve your work")

by jaktestowac.pl team.

Overview

Repository contains tests for the following topics:

  • UI Tests with Page Object Model: Automated browser tests for user registration, login, and viewing articles, using Playwright and the Page Object Model pattern for maintainability.

  • API Testing: End-to-end API tests for health, about, users, including user registration, login and viewing articles.

  • Fixtures and Helpers: Custom Playwright fixtures for page objects to promote code reuse and clarity.

  • Test Reporting and Configuration: Example Playwright configuration for multiple reporters (HTML, JUnit, JSON), test directory structure, and device emulation.

Tests and Covered Areas

The repository includes the following test files and their coverage:

  • tests/register.spec.ts: UI test for user registration and login with unique credentials.
  • tests/login.spec.ts: UI test for logging in with valid credentials.
  • tests/articles.spec.ts: UI test for viewing articles as a guest user.
  • tests/logged-articles.spec.ts: UI test for viewing articles as a logged-in user.

These tests cover:

  • User registration and authentication flows
  • Viewing articles (both as guest and logged-in user)

Who we are?

We are Test Architects and Senior Lead Tech Quality Engineers, who are passionate about testing. We are constantly looking for new ways to improve our skills and share our knowledge with others.

We are actively involved in the Playwright community, contributing to the project and sharing our knowledge with others. We have been using Playwright in different companies and projects since 2021.

We believe in the power of open source and the importance of giving back to the community.

Read more about our Contribution to Playwright and Community

Prerequisites

Before you start, make sure you have the following installed:

Project Structure

Test files are located in the tests directory. Each test file contains a set of tests that cover a specific functionality or feature of the application.

Configuration in file playwright.config.ts contain all global settings for project.

Setup

  1. Clone the repository:

    git clone https://github.com/jaktestowac/playwright-test-framework-mcp-example.git
cd playwright-test-framework-mcp-example

  2. Install dependencies:

    npm install

  3. Optionally install Playwright browsers:

    npx playwright install

  4. Optionally install extensions for VSCode:

Navigate to "Extensions" tab in VSCode, filter extensions using "@recommended" filter

Running Tests

Run all tests:

npm run test

Run specific test file:

npx playwright test tests/login.spec.ts

Run tests with UI mode:

npx playwright test --ui

Generate test report:

npx playwright show-report

Troubleshooting

Common issues and solutions:

  1. Tests fail on first run

    • Ensure 🦎 GAD application is running (by default on http://localhost:3000)
    • Check if correct Node.js version is installed

  2. Browser launch fails

    npx playwright install

Resources

Contact

Feel free to reach out to us:

Happy testing and automating tests!🚀

jaktestowac.pl Team 💚❤️

PS. For more resources and updates, follow us on our website and GitHub.

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.