Automation Selenium and Playwright(Java&Javascript)

 

✅ What is Playwright?

Playwright is an open-source automation library for testing web applications across multiple browsers. It supports Chromium, Firefox, and WebKit and works with JavaScript, TypeScript, Python, C#, and Java.

🔹 Key Features

• Cross-browser testing (Chrome, Firefox, Safari)

• Auto-wait mechanism for elements

• Built-in support for headless/headful mode

• Parallel test execution

• Page Object Model (POM) support

• CI/CD integration

  
  

  🛠️ Step-by-Step Guide

  Step 1: Install Node.js and Playwright

  npm init -y
  npm install -D @playwright/test
  npx playwright install

  Step 2: Basic Folder Structure

  /playwright-project
    ├── tests/
    │   └── example.spec.js
    ├── playwright.config.js
    └── package.json

  Step 3: Sample Test Case

  // tests/example.spec.js
  const { test, expect } = require('@playwright/test');
  
  test('Home page title test', async ({ page }) => {
    await page.goto('https://example.com');
    await expect(page).toHaveTitle('Example Domain');
  });

  Step 4: Run Your Test

  npx playwright test

  🔍 Understanding Core Concepts
  1. Browser Context
  Each test runs in a new browser context, isolated from others. Think of it like a new browser window.
  2. Selectors
  Playwright supports powerful selectors:
  CSS: page.locator('h1')
  Text: page.getByText('Submit')
  XPath: page.locator("//button[text()='Submit']")
  3. Assertions
  await expect(page).toHaveTitle(/Example/);
  await expect(page.locator('h1')).toHaveText('Example Domain');
  4. Fixtures
  Use built-in test fixtures to manage browser/page lifecycle.
  5. Page Object Model (POM)
  Organize your code with POM:
  class LoginPage {
    constructor(page) {
      this.page = page;
      this.username = page.locator('#username');
      this.password = page.locator('#password');
      this.loginBtn = page.locator('button[type=submit]');
    }
  
    async login(user, pass) {
      await this.username.fill(user);
      await this.password.fill(pass);
      await this.loginBtn.click();
    }
  }
  🚀 Advanced Tips
  Use tracing to debug failed tests
  Run in parallel using --workers
  Integrate with Jenkins, GitHub Actions, or Azure DevOps
  📦 Integrating with CI/CD (Azure DevOps)
  Create a YAML pipeline
  Add Playwright install and test steps
  - script: |
      npm ci
      npx playwright install --with-deps
      npx playwright test
    displayName: 'Run Playwright tests'
  🧪 Real-Time Use Cases
  Login test automation
  E-commerce cart validation
  Checkout flow automation
  API + UI integration test