Test Automation - Complete Guide

// Jest Unit Test Example (JavaScript) describe('Calculator', () => { test('add() should sum two numbers', () => { const calculator = new Calculator(); expect(calculator.add(2, 3)).toBe(5); expect(calculator.add(-1, 1)).toBe(0); expect(calculator.add(0, 0)).toBe(0); }); test('divide() should throw error when dividing by zero', () => { const calculator = new Calculator(); expect(() => calculator.divide(5, 0)).toThrow('Division by zero'); }); });

// Integration Test Example (Python) import pytest from app import create_app, db from app.models import User, Order @pytest.fixture def client(): app = create_app('testing') with app.test_client() as client: with app.app_context(): db.create_all() yield client db.drop_all() def test_create_order_workflow(client): # Create user user = User(username='testuser', email='test@example.com') db.session.add(user) db.session.commit() # Create order response = client.post('/api/orders', json={ 'user_id': user.id, 'product_id': 123, 'quantity': 2 }) assert response.status_code == 201 data = response.get_json() assert data['order_id'] is not None # Verify order in database order = Order.query.get(data['order_id']) assert order.user_id == user.id assert order.quantity == 2

// API Test with REST Assured (Java) import io.restassured.RestAssured; import static io.restassured.RestAssured.*; import static org.hamcrest.Matchers.*; public class APITests { @Test public void testGetUser() { given() .header("Authorization", "Bearer " + token) .pathParam("userId", 123) .when() .get("/api/users/{userId}") .then() .statusCode(200) .body("id", equalTo(123)) .body("name", notNullValue()) .body("email", containsString("@")); } @Test public void testCreateUser() { String requestBody = """ { "name": "John Doe", "email": "john@example.com", "role": "admin" } """; given() .header("Content-Type", "application/json") .body(requestBody) .when() .post("/api/users") .then() .statusCode(201) .body("id", notNullValue()) .body("name", equalTo("John Doe")); } }

// Cypress E2E Test describe('E-commerce Checkout Flow', () => { beforeEach(() => { cy.visit('/'); cy.login('user@example.com', 'password123'); }); it('should complete purchase successfully', () => { // Browse products cy.get('[data-testid="category-electronics"]').click(); cy.url().should('include', '/category/electronics'); // Add product to cart cy.get('[data-testid="product-laptop"]').click(); cy.get('[data-testid="add-to-cart"]').click(); cy.get('[data-testid="cart-badge"]').should('contain', '1'); // Go to cart cy.get('[data-testid="cart-icon"]').click(); cy.get('[data-testid="cart-item"]').should('have.length', 1); cy.get('[data-testid="cart-total"]').should('contain', '$999.99'); // Checkout cy.get('[data-testid="checkout-button"]').click(); // Fill shipping info cy.get('#shipping-address').type('123 Main St'); cy.get('#shipping-city').type('New York'); cy.get('#shipping-zip').type('10001'); // Fill payment info cy.get('#card-number').type('4111111111111111'); cy.get('#card-expiry').type('12/25'); cy.get('#card-cvc').type('123'); // Complete order cy.get('[data-testid="place-order"]').click(); // Verify success cy.url().should('include', '/order-confirmation'); cy.get('[data-testid="order-success"]') .should('be.visible') .and('contain', 'Order placed successfully'); cy.get('[data-testid="order-number"]').should('exist'); }); });

// JMeter-like Load Test (Gatling - Scala) import io.gatling.core.Predef._ import io.gatling.http.Predef._ import scala.concurrent.duration._ class LoadTest extends Simulation { val httpProtocol = http .baseUrl("https://api.example.com") .acceptHeader("application/json") .authorizationHeader("Bearer ${token}") val scn = scenario("API Load Test") .exec(http("Get Products") .get("/api/products") .check(status.is(200))) .pause(1) .exec(http("Get Product Details") .get("/api/products/123") .check(status.is(200)) .check(jsonPath("$.name").exists)) .pause(2) setUp( scn.inject( rampUsers(100) during (60 seconds) // Ramp up to 100 users ).protocols(httpProtocol) ).assertions( global.responseTime.max.lt(2000), // Max response time < 2s global.successfulRequests.percent.gt(95) // 95% success rate ) }

// Percy Visual Testing Example describe('Visual Regression Tests', () => { it('should match homepage snapshot', () => { cy.visit('/'); cy.percySnapshot('Homepage'); }); it('should match product page snapshot', () => { cy.visit('/product/123'); cy.wait(2000); // Wait for images to load cy.percySnapshot('Product Page', { widths: [768, 1024, 1280] // Multiple viewport sizes }); }); it('should match modal dialog snapshot', () => { cy.visit('/'); cy.get('[data-testid="open-modal"]').click(); cy.get('.modal').should('be.visible'); cy.percySnapshot('Modal Dialog'); }); });

# Feature file (Gherkin) Feature: User Login As a registered user I want to log into the application So that I can access my account Scenario: Successful login with valid credentials Given I am on the login page When I enter username "user@example.com" And I enter password "validPassword123" And I click the login button Then I should be redirected to the dashboard And I should see a welcome message "Welcome back!" Scenario: Failed login with invalid credentials Given I am on the login page When I enter username "user@example.com" And I enter password "wrongPassword" And I click the login button Then I should see an error message "Invalid credentials" And I should remain on the login page Scenario Outline: Login with multiple users Given I am on the login page When I enter username "<username>" And I enter password "<password>" And I click the login button Then I should see "<result>" Examples: | username | password | result | | user@example.com | valid123 | Welcome back! | | admin@example.com | admin123 | Welcome, Administrator! | | test@example.com | wrong | Invalid credentials |

// Step Definitions (Cucumber.js) const { Given, When, Then } = require('@cucumber/cucumber'); const { expect } = require('chai'); Given('I am on the login page', async function() { await this.page.goto('https://example.com/login'); }); When('I enter username {string}', async function(username) { await this.page.fill('#username', username); }); When('I enter password {string}', async function(password) { await this.page.fill('#password', password); }); When('I click the login button', async function() { await this.page.click('#login-button'); }); Then('I should be redirected to the dashboard', async function() { await this.page.waitForURL('**/dashboard'); expect(this.page.url()).to.include('/dashboard'); }); Then('I should see a welcome message {string}', async function(message) { const welcomeText = await this.page.textContent('.welcome-message'); expect(welcomeText).to.include(message); }); Then('I should see an error message {string}', async function(errorMessage) { const error = await this.page.textContent('.error-message'); expect(error).to.equal(errorMessage); });

from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC class TestLogin: def setup_method(self): self.driver = webdriver.Chrome() self.driver.implicitly_wait(10) def teardown_method(self): self.driver.quit() def test_successful_login(self): driver = self.driver # Navigate to login page driver.get("https://example.com/login") # Wait for and fill username username_field = WebDriverWait(driver, 10).until( EC.presence_of_element_located((By.ID, "username")) ) username_field.send_keys("user@example.com") # Fill password driver.find_element(By.ID, "password").send_keys("password123") # Click login button driver.find_element(By.ID, "login-button").click() # Wait for redirect to dashboard WebDriverWait(driver, 10).until( EC.url_contains("/dashboard") ) # Verify welcome message welcome_msg = driver.find_element(By.CLASS_NAME, "welcome-message") assert "Welcome" in welcome_msg.text # Verify user is logged in assert driver.find_element(By.ID, "user-profile").is_displayed()

const { test, expect } = require('@playwright/test'); test.describe('Login Tests', () => { test.beforeEach(async ({ page }) => { await page.goto('https://example.com/login'); }); test('successful login', async ({ page }) => { // Fill login form await page.fill('#username', 'user@example.com'); await page.fill('#password', 'password123'); // Click login (Playwright auto-waits for element to be actionable) await page.click('#login-button'); // Wait for navigation await page.waitForURL('**/dashboard'); // Assertions await expect(page.locator('.welcome-message')).toContainText('Welcome'); await expect(page.locator('#user-profile')).toBeVisible(); }); test('failed login with invalid credentials', async ({ page }) => { await page.fill('#username', 'user@example.com'); await page.fill('#password', 'wrongpassword'); await page.click('#login-button'); // Should stay on login page await expect(page).toHaveURL(/.*login/); // Error message should be visible await expect(page.locator('.error-message')) .toHaveText('Invalid credentials'); }); test('login with multiple browsers', async ({ browser }) => { // Test in different contexts (like incognito windows) const context1 = await browser.newContext(); const context2 = await browser.newContext(); const page1 = await context1.newPage(); const page2 = await context2.newPage(); // Parallel login await Promise.all([ loginAs(page1, 'user1@example.com'), loginAs(page2, 'user2@example.com') ]); await context1.close(); await context2.close(); }); });

// pages/LoginPage.js class LoginPage { constructor(page) { this.page = page; // Locators this.usernameInput = '#username'; this.passwordInput = '#password'; this.loginButton = '#login-button'; this.errorMessage = '.error-message'; } async navigate() { await this.page.goto('https://example.com/login'); } async login(username, password) { await this.page.fill(this.usernameInput, username); await this.page.fill(this.passwordInput, password); await this.page.click(this.loginButton); } async getErrorMessage() { return await this.page.textContent(this.errorMessage); } async isLoginButtonEnabled() { return await this.page.isEnabled(this.loginButton); } } // pages/DashboardPage.js class DashboardPage { constructor(page) { this.page = page; this.welcomeMessage = '.welcome-message'; this.userProfile = '#user-profile'; } async getWelcomeMessage() { return await this.page.textContent(this.welcomeMessage); } async isUserLoggedIn() { return await this.page.isVisible(this.userProfile); } } // tests/login.test.js const { test, expect } = require('@playwright/test'); const LoginPage = require('../pages/LoginPage'); const DashboardPage = require('../pages/DashboardPage'); test('successful login flow', async ({ page }) => { const loginPage = new LoginPage(page); const dashboardPage = new DashboardPage(page); await loginPage.navigate(); await loginPage.login('user@example.com', 'password123'); await expect(page).toHaveURL(/.*dashboard/); expect(await dashboardPage.getWelcomeMessage()).toContain('Welcome'); expect(await dashboardPage.isUserLoggedIn()).toBeTruthy(); });

// Screenplay Pattern Example class Actor { constructor(name, page) { this.name = name; this.page = page; } async attemptsTo(...tasks) { for (const task of tasks) { await task.performAs(this); } } async asks(question) { return await question.answeredBy(this); } } // Tasks class Navigate { static to(url) { return { performAs: async (actor) => { await actor.page.goto(url); } }; } } class Login { static withCredentials(username, password) { return { performAs: async (actor) => { await actor.page.fill('#username', username); await actor.page.fill('#password', password); await actor.page.click('#login-button'); } }; } } // Questions class WelcomeMessage { static displayed() { return { answeredBy: async (actor) => { return await actor.page.textContent('.welcome-message'); } }; } } // Test test('user logs in successfully', async ({ page }) => { const james = new Actor('James', page); await james.attemptsTo( Navigate.to('https://example.com/login'), Login.withCredentials('james@example.com', 'password123') ); const message = await james.asks(WelcomeMessage.displayed()); expect(message).toContain('Welcome'); });

// Fluent interface for chaining class LoginPage { constructor(page) { this.page = page; } async open() { await this.page.goto('https://example.com/login'); return this; // Enable chaining } async enterUsername(username) { await this.page.fill('#username', username); return this; } async enterPassword(password) { await this.page.fill('#password', password); return this; } async clickLogin() { await this.page.click('#login-button'); return new DashboardPage(this.page); // Return next page } } // Usage - fluent chaining test('login flow with fluent interface', async ({ page }) => { const dashboardPage = await new LoginPage(page) .open() .enterUsername('user@example.com') .enterPassword('password123') .clickLogin(); expect(await dashboardPage.getWelcomeMessage()).toContain('Welcome'); });

// Selenium Explicit Waits WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10)); // Wait for element to be clickable WebElement element = wait.until( ExpectedConditions.elementToBeClickable(By.id("submit-button")) ); // Wait for element to be visible wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("result"))); // Wait for text to be present wait.until(ExpectedConditions.textToBePresentInElementLocated( By.id("status"), "Complete" )); // Wait for URL to contain wait.until(ExpectedConditions.urlContains("/dashboard")); // Custom condition wait.until(driver -> { List rows = driver.findElements(By.cssSelector(".data-row")); return rows.size() > 5; });

// Strategy 1: Use dynamic locators // Instead of: #user-123 // Use: [data-testid="user-row"] // Strategy 2: Wait for stability async function waitForStability(page, selector, timeout = 5000) { const element = await page.locator(selector); let previousPosition = await element.boundingBox(); const startTime = Date.now(); while (Date.now() - startTime < timeout) { await page.waitForTimeout(100); const currentPosition = await element.boundingBox(); if (JSON.stringify(previousPosition) === JSON.stringify(currentPosition)) { return element; } previousPosition = currentPosition; } } // Strategy 3: Retry mechanism async function retryClick(page, selector, maxAttempts = 3) { for (let i = 0; i < maxAttempts; i++) { try { await page.click(selector, { timeout: 2000 }); return; } catch (error) { if (i === maxAttempts - 1) throw error; await page.waitForTimeout(1000); } } }

// Playwright - Handle new window test('handle popup window', async ({ page, context }) => { // Listen for new page const [newPage] = await Promise.all([ context.waitForEvent('page'), page.click('#open-popup') // Triggers new window ]); // Work with new page await newPage.waitForLoadState(); await newPage.fill('#form-field', 'data'); await newPage.click('#submit'); // Close and return to original await newPage.close(); await page.bringToFront(); });

// Switch to iframe and interact test('interact with iframe content', async ({ page }) => { await page.goto('https://example.com'); // Method 1: Using frameLocator (recommended) const frame = page.frameLocator('#payment-iframe'); await frame.locator('#card-number').fill('4111111111111111'); await frame.locator('#submit-payment').click(); // Method 2: Get frame and use it const frameElement = await page.frame({ name: 'payment-frame' }); await frameElement.fill('#card-number', '4111111111111111'); });

# .github/workflows/e2e-tests.yml name: E2E Tests on: push: branches: [ main, develop ] pull_request: branches: [ main ] schedule: - cron: '0 2 * * *' # Run daily at 2 AM jobs: test: runs-on: ubuntu-latest strategy: matrix: browser: [chromium, firefox, webkit] shard: [1, 2, 3, 4] steps: - uses: actions/checkout@v3 - name: Setup Node.js uses: actions/setup-node@v3 with: node-version: '18' cache: 'npm' - name: Install dependencies run: npm ci - name: Install Playwright browsers run: npx playwright install --with-deps ${{ matrix.browser }} - name: Run tests run: npx playwright test --shard=${{ matrix.shard }}/4 --project=${{ matrix.browser }} env: BASE_URL: ${{ secrets.TEST_URL }} API_KEY: ${{ secrets.API_KEY }} - name: Upload test results if: always() uses: actions/upload-artifact@v3 with: name: playwright-results-${{ matrix.browser }}-${{ matrix.shard }} path: test-results/ retention-days: 30 - name: Upload HTML report if: always() uses: actions/upload-artifact@v3 with: name: playwright-report-${{ matrix.browser }}-${{ matrix.shard }} path: playwright-report/ retention-days: 30 - name: Comment PR with results if: github.event_name == 'pull_request' uses: daun/playwright-report-comment@v3 with: report-path: playwright-report/

// Jenkinsfile pipeline { agent any parameters { choice(name: 'BROWSER', choices: ['chrome', 'firefox', 'edge'], description: 'Browser to run tests') choice(name: 'ENVIRONMENT', choices: ['dev', 'staging', 'production'], description: 'Environment to test') } stages { stage('Checkout') { steps { checkout scm } } stage('Install Dependencies') { steps { sh 'npm ci' sh 'npx playwright install' } } stage('Run Tests') { parallel { stage('Smoke Tests') { steps { sh """ npx playwright test --grep @smoke \ --project=${params.BROWSER} """ } } stage('Regression Tests') { when { branch 'main' } steps { sh """ npx playwright test --grep @regression \ --project=${params.BROWSER} """ } } } } stage('Generate Report') { steps { sh 'npx playwright show-report' publishHTML([ reportDir: 'playwright-report', reportFiles: 'index.html', reportName: 'Playwright Test Report' ]) } } } post { always { junit 'test-results/**/*.xml' archiveArtifacts artifacts: 'test-results/**/*', allowEmptyArchive: true } failure { emailext ( subject: "Test Failure: ${env.JOB_NAME} - ${env.BUILD_NUMBER}", body: "Tests failed. Check: ${env.BUILD_URL}", to: "${env.TEAM_EMAIL}" ) } } }

// Playwright with test.describe.parallel and test fixtures const testData = [ { username: 'user1@example.com', password: 'pass1', expectedName: 'User One' }, { username: 'user2@example.com', password: 'pass2', expectedName: 'User Two' }, { username: 'user3@example.com', password: 'pass3', expectedName: 'User Three' } ]; test.describe('Data-driven login tests', () => { for (const data of testData) { test(`login as ${data.username}`, async ({ page }) => { await page.goto('/login'); await page.fill('#username', data.username); await page.fill('#password', data.password); await page.click('#login-button'); await expect(page.locator('.user-name')) .toHaveText(data.expectedName); }); } });

// Load data from CSV/JSON const fs = require('fs'); const csv = require('csv-parse/sync'); // Load from CSV const csvData = fs.readFileSync('test-data/users.csv', 'utf-8'); const users = csv.parse(csvData, { columns: true }); // Load from JSON const jsonData = JSON.parse(fs.readFileSync('test-data/users.json')); test.describe('Login with external data', () => { users.forEach(user => { test(`login as ${user.email}`, async ({ page }) => { await loginPage.login(user.email, user.password); await expect(dashboard.userName).toHaveText(user.expectedName); }); }); });

// helpers/TestDataFactory.js class TestDataFactory { static createUser(overrides = {}) { return { firstName: 'Test', lastName: 'User', email: `testuser${Date.now()}@example.com`, password: 'Test123!@#', role: 'user', ...overrides }; } static createAdmin(overrides = {}) { return this.createUser({ role: 'admin', ...overrides }); } static createProduct(overrides = {}) { return { name: 'Test Product', price: 99.99, stock: 100, category: 'electronics', ...overrides }; } } // Usage in tests test('admin can create products', async ({ page }) => { const admin = TestDataFactory.createAdmin(); const product = TestDataFactory.createProduct({ name: 'New Laptop' }); await loginAs(page, admin); await createProduct(page, product); await expect(page.locator('.success-message')) .toHaveText('Product created successfully'); });

// fixtures/database.js const { Pool } = require('pg'); class DatabaseHelper { constructor() { this.pool = new Pool({ host: process.env.DB_HOST, database: process.env.DB_NAME, user: process.env.DB_USER, password: process.env.DB_PASSWORD }); } async setupTestData() { // Create test users await this.pool.query(` INSERT INTO users (email, password, role) VALUES ($1, $2, $3) `, ['test@example.com', 'hashedPassword', 'user']); // Create test products await this.pool.query(` INSERT INTO products (name, price, stock) VALUES ($1, $2, $3) `, ['Test Product', 99.99, 100]); } async cleanupTestData() { await this.pool.query(`DELETE FROM orders WHERE user_id IN (SELECT id FROM users WHERE email LIKE 'test%')`); await this.pool.query(`DELETE FROM users WHERE email LIKE 'test%'`); await this.pool.query(`DELETE FROM products WHERE name LIKE 'Test%'`); } async close() { await this.pool.end(); } } // test.config.js module.exports = { globalSetup: './fixtures/global-setup.js', globalTeardown: './fixtures/global-teardown.js' }; // fixtures/global-setup.js const DatabaseHelper = require('./database'); module.exports = async () => { const db = new DatabaseHelper(); await db.setupTestData(); await db.close(); }; // fixtures/global-teardown.js module.exports = async () => { const db = new DatabaseHelper(); await db.cleanupTestData(); await db.close(); };

// Retry mechanism for flaky operations test('flaky operation with retry', async ({ page }) => { await page.goto('/dashboard'); // Playwright has built-in retry for assertions await expect(page.locator('.data-loaded')).toBeVisible({ timeout: 10000 }); // Custom retry for complex operations await retryOperation(async () => { await page.click('.refresh-button'); const count = await page.locator('.item-count').textContent(); expect(parseInt(count)).toBeGreaterThan(0); }, 3); }); async function retryOperation(operation, maxAttempts) { for (let attempt = 1; attempt <= maxAttempts; attempt++) { try { await operation(); return; } catch (error) { if (attempt === maxAttempts) throw error; console.log(`Attempt ${attempt} failed, retrying...`); await new Promise(resolve => setTimeout(resolve, 1000)); } } }

// Playwright parallel execution // playwright.config.js module.exports = { workers: 4, // Run 4 tests in parallel fullyParallel: true, retries: 2, // Retry failed tests use: { headless: true, // Faster than headed mode screenshot: 'only-on-failure', video: 'retain-on-failure', trace: 'retain-on-failure' } };

// Good locator strategy // ❌ Bad - fragile locators await page.click('.btn.btn-primary.submit-form'); await page.fill('input[type="text"]:nth-child(2)', 'data'); // ✅ Good - stable, semantic locators await page.click('[data-testid="submit-button"]'); await page.fill('[data-testid="email-input"]', 'user@example.com'); await page.getByRole('button', { name: 'Submit' }).click(); await page.getByLabel('Email').fill('user@example.com');

// Handle dynamic tables test('verify data in dynamic table', async ({ page }) => { await page.goto('/dashboard'); // Wait for table to load await page.waitForSelector('table tbody tr'); // Find specific row by text content const row = page.locator('table tbody tr', { hasText: 'John Doe' }); await expect(row.locator('td:nth-child(2)')).toHaveText('john@example.com'); await expect(row.locator('td:nth-child(3)')).toHaveText('Active'); }); // Handle infinite scroll async function scrollToLoadAll(page, selector) { let previousCount = 0; while (true) { const currentCount = await page.locator(selector).count(); if (currentCount === previousCount) break; previousCount = currentCount; await page.locator(selector).last().scrollIntoViewIfNeeded(); await page.waitForTimeout(500); } }

// Playwright custom reporter class CustomReporter { onBegin(config, suite) { console.log(`Starting test run with ${suite.allTests().length} tests`); } onTestEnd(test, result) { console.log(`${test.title}: ${result.status}`); if (result.status === 'failed') { // Send to monitoring service this.sendToSlack({ title: test.title, error: result.error.message, screenshot: result.attachments.find(a => a.name === 'screenshot')?.path }); } } async onEnd(result) { console.log(`Test run finished: ${result.status}`); console.log(`${result.passed} passed, ${result.failed} failed`); // Generate custom metrics await this.generateMetrics(result); } async sendToSlack(data) { // Send failure notification to Slack } async generateMetrics(result) { // Send metrics to analytics platform } } module.exports = CustomReporter;