playwright_test_framework

🥈Silver

Automated end-to-end testing framework built with Playwright and Java, tailored for any website. Designed for scalability and maintainability, this framework covers critical test scenarios with strong assertions and clean, modular code. Perfect for those looking to speed up their test automation journey or enhance their Playwright skills!

36130Updated 2mo ago

Intermediate30min to implementautomation

Saves ~240 min per use

Quick InstallView Source

git clone https://github.com/iamcharankumar/playwright_test_framework.git

Works with:

Claude

Overview

About This Skill

This framework combines Playwright with Java to deliver automated end-to-end testing for websites with a focus on scalability and maintainability. It uses a modular architecture with clean code patterns, supporting Chrome, Firefox, and Edge browsers in both local and headless modes. The framework includes Chrome DevTools Protocol integration for network error monitoring, parallel test execution via Maven, and GitHub Actions CI/CD integration. Built with TestNG, it covers smoke, regression, and E2E test scenarios with robust assertions. Teams can integrate test reports with ReportPortal and Discord notifications, track code coverage with CodeCov, and leverage multi-threaded test execution for faster feedback cycles.

How to Use

1. **Initialize Project**: Run `npm init playwright@latest` in your project directory to scaffold a new Playwright project. Select TypeScript/JavaScript based on your preference. 2. **Configure Environment**: Update `playwright.config.js` with your [WEBSITE_URL], set parallel workers (recommended: 3-5 for medium projects), and configure reporters (HTML/JSON recommended). 3. **Implement Page Objects**: Create modular page classes (e.g., `LoginPage.js`, `DashboardPage.js`) in `/pages` to encapsulate selectors and actions. Use consistent naming conventions (e.g., `getXButton()`, `fillXField()`). 4. **Write Tests**: Add test files in `/tests` using the Page Object Model. Include setup/teardown hooks (e.g., `test.beforeEach` for login) and assertions for UI states, API calls, and performance (e.g., `expect(page).toHaveURL()`). 5. **Run & Debug**: Execute tests via `npx playwright test` (headless) or `npx playwright test --headed` (headed). Use `npx playwright show-report` to view HTML reports. Debug with `npx playwright codegen [WEBSITE_URL]` to auto-generate selectors. **Pro Tips**: - Use `testData.json` for reusable test inputs to avoid hardcoding. - Add `expect(page).toHaveScreenshot()` for visual regression testing. - Integrate with CI/CD (GitHub Actions, Jenkins) using `playwright test --reporter=line`.

Use Cases

Automated regression testing for e-commerce and SaaS applications

Cross-browser testing with Chrome, Firefox, and Edge in CI/CD pipelines

Network error detection and monitoring during test execution via CDP

Parallel test execution with configurable thread counts for faster feedback

Setup & Installation

Quick Install

No install command available. Check the GitHub repository for manual installation instructions.

Alternative Install (Git Clone)

git clone https://github.com/iamcharankumar/playwright_test_framework

Requirements

Claude Code or compatible AI agent
Works with: Claude

Quick Start Guide

Install the Skill

Copy the install command above and run it in your terminal.

Open Your AI Agent

Launch Claude Code, Cursor, or your preferred AI coding agent.

Try It Out

Use the prompt template or examples below to test the skill.

Customize

Adapt the skill to your specific use case and workflow.

Usage Examples

Prompt Template

Create a Playwright test suite for [WEBSITE_URL] that validates the following critical user flows: [FLOW_1], [FLOW_2], and [FLOW_3]. Include setup for headless/headed mode, parallel execution, and a report generation step. Use [TEST_DATA] as input values where applicable. Ensure tests follow Page Object Model (POM) pattern and include assertions for UI elements, API responses, and performance metrics.

Example Output

```javascript
// playwright.config.js
module.exports = {
  testDir: './tests',
  timeout: 30000,
  fullyParallel: true,
  retries: 1,
  workers: 3,
  reporter: [['list'], ['json', { outputFile: 'test-results.json' }]],
  use: {
    trace: 'on-first-retry',
    screenshot: 'only-on-failure',
  },
};

// tests/login.spec.js
const { test, expect } = require('@playwright/test');
const { LoginPage } = require('../pages/login.page');
const { DashboardPage } = require('../pages/dashboard.page');
const testData = require('../test-data.json');

test.describe('Login Flow Tests', () => {
  test.beforeEach(async ({ page }) => {
    await page.goto('https://acme-corp.com/login');
  });

  test('Successful login with valid credentials', async ({ page }) => {
    const loginPage = new LoginPage(page);
    const dashboardPage = new DashboardPage(page);

    await loginPage.fillEmail(testData.validUser.email);
    await loginPage.fillPassword(testData.validUser.password);
    await loginPage.clickLoginButton();

    await expect(dashboardPage.getWelcomeMessage()).toBeVisible();
    await expect(dashboardPage.getWelcomeMessage()).toContainText('Welcome, John Doe!');
    await expect(page).toHaveURL('https://acme-corp.com/dashboard');
  });

  test('Failed login with invalid credentials', async ({ page }) => {
    const loginPage = new LoginPage(page);

    await loginPage.fillEmail(testData.invalidUser.email);
    await loginPage.fillPassword(testData.invalidUser.password);
    await loginPage.clickLoginButton();

    await expect(loginPage.getErrorMessage()).toBeVisible();
    await expect(loginPage.getErrorMessage()).toContainText('Invalid email or password');
  });

  test('Password reset flow', async ({ page }) => {
    const loginPage = new LoginPage(page);
    const resetPage = new ResetPasswordPage(page);

    await loginPage.clickForgotPasswordLink();
    await resetPage.fillEmail(testData.validUser.email);
    await resetPage.clickSendLinkButton();

    await expect(resetPage.getSuccessMessage()).toBeVisible();
    await expect(resetPage.getSuccessMessage()).toContainText('Password reset link sent');

    const email = await resetPage.getLastEmail();
    expect(email.subject).toContain('Password Reset');
    expect(email.body).toContain('Reset your password');
  });
});

// reports/html-report/index.html
// Generated after test execution showing 3/3 tests passed with 0 failures
```

Apply to these tools

Browse all tools

Automa

Automate your browser workflows effortlessly

Microsoft Teams

Get more done every day with Microsoft Teams – powered by AI

Drata

Automate security compliance and monitor real-time security posture seamlessly.

GPT for work

Automate your spreadsheet tasks with AI power

Respell

Agentic AI Workflow platform

Notion

Connected workspace for docs, wikis, and projects

Compatible MCP servers

Browse all MCP servers

Find the right skills for your stack

Take a free 3-minute scan and get personalized AI skill recommendations.

Take free scan

Overview

About This Skill

How to Use

Use Cases

Automated regression testing for e-commerce and SaaS applications

Cross-browser testing with Chrome, Firefox, and Edge in CI/CD pipelines

Network error detection and monitoring during test execution via CDP

Parallel test execution with configurable thread counts for faster feedback

Quick Install

No install command available. Check the GitHub repository for manual installation instructions.

Alternative Install (Git Clone)

git clone https://github.com/iamcharankumar/playwright_test_framework

Requirements

Claude Code or compatible AI agent
Works with: Claude

Quick Start Guide

Install the Skill

Copy the install command above and run it in your terminal.

Open Your AI Agent

Launch Claude Code, Cursor, or your preferred AI coding agent.

Try It Out

Use the prompt template or examples below to test the skill.

Customize

Adapt the skill to your specific use case and workflow.

Usage Examples

Prompt Template

Create a Playwright test suite for [WEBSITE_URL] that validates the following critical user flows: [FLOW_1], [FLOW_2], and [FLOW_3]. Include setup for headless/headed mode, parallel execution, and a report generation step. Use [TEST_DATA] as input values where applicable. Ensure tests follow Page Object Model (POM) pattern and include assertions for UI elements, API responses, and performance metrics.

Example Output

```javascript
// playwright.config.js
module.exports = {
  testDir: './tests',
  timeout: 30000,
  fullyParallel: true,
  retries: 1,
  workers: 3,
  reporter: [['list'], ['json', { outputFile: 'test-results.json' }]],
  use: {
    trace: 'on-first-retry',
    screenshot: 'only-on-failure',
  },
};

// tests/login.spec.js
const { test, expect } = require('@playwright/test');
const { LoginPage } = require('../pages/login.page');
const { DashboardPage } = require('../pages/dashboard.page');
const testData = require('../test-data.json');

test.describe('Login Flow Tests', () => {
  test.beforeEach(async ({ page }) => {
    await page.goto('https://acme-corp.com/login');
  });

  test('Successful login with valid credentials', async ({ page }) => {
    const loginPage = new LoginPage(page);
    const dashboardPage = new DashboardPage(page);

    await loginPage.fillEmail(testData.validUser.email);
    await loginPage.fillPassword(testData.validUser.password);
    await loginPage.clickLoginButton();

    await expect(dashboardPage.getWelcomeMessage()).toBeVisible();
    await expect(dashboardPage.getWelcomeMessage()).toContainText('Welcome, John Doe!');
    await expect(page).toHaveURL('https://acme-corp.com/dashboard');
  });

  test('Failed login with invalid credentials', async ({ page }) => {
    const loginPage = new LoginPage(page);

    await loginPage.fillEmail(testData.invalidUser.email);
    await loginPage.fillPassword(testData.invalidUser.password);
    await loginPage.clickLoginButton();

    await expect(loginPage.getErrorMessage()).toBeVisible();
    await expect(loginPage.getErrorMessage()).toContainText('Invalid email or password');
  });

  test('Password reset flow', async ({ page }) => {
    const loginPage = new LoginPage(page);
    const resetPage = new ResetPasswordPage(page);

    await loginPage.clickForgotPasswordLink();
    await resetPage.fillEmail(testData.validUser.email);
    await resetPage.clickSendLinkButton();

    await expect(resetPage.getSuccessMessage()).toBeVisible();
    await expect(resetPage.getSuccessMessage()).toContainText('Password reset link sent');

    const email = await resetPage.getLastEmail();
    expect(email.subject).toContain('Password Reset');
    expect(email.body).toContain('Reset your password');
  });
});

// reports/html-report/index.html
// Generated after test execution showing 3/3 tests passed with 0 failures
```

playwright_test_framework

Overview

About This Skill

How to Use

Use Cases

Tags

Setup & Installation

Quick Install

Alternative Install (Git Clone)

Requirements

Quick Start Guide

Install the Skill

Open Your AI Agent

Try It Out

Customize

Usage Examples

Prompt Template

Example Output

Apply to these tools

Automa

Microsoft Teams

Drata

GPT for work

Respell

Notion

Compatible MCP servers

context sync

mcp notion server

src to kb

notion mcp

slime

notion

Find the right skills for your stack

playwright_test_framework

Overview

About This Skill

How to Use

Use Cases

Tags

Setup & Installation

Quick Install

Alternative Install (Git Clone)

Requirements

Quick Start Guide

Install the Skill

Open Your AI Agent

Try It Out

Customize

Usage Examples

Prompt Template

Example Output

Apply to these tools

Automa

Microsoft Teams

Drata

GPT for work

Respell

Notion

Compatible MCP servers

context sync

mcp notion server

src to kb

notion mcp

slime

notion

Find the right skills for your stack