Master the foundations of software testing and take your first steps into test automation
Think of software testing like a quality inspector in a car factory. Just as the inspector checks every part of the car before it leaves the factory, testers verify that software works correctly before users get it.
Key Goals of Testing:
Functional Testing
Does the feature work? (Login, checkout, search)
Non-Functional Testing
How well does it work? (Speed, security, usability)
Regression Testing
Did new changes break old features?
Imagine testing a login page. Manual testing is like you personally typing username and password every time. Automation is like having a robot do it for you - faster and never gets tired!
Human tester performs tests
Best For:
Scripts perform tests automatically
Best For:
The test pyramid shows how to balance different types of tests. Think of it like a food pyramid - you need more of some things (unit tests) and less of others (E2E tests).
🔴 E2E Tests (Few)
Test entire user flows. Slow but comprehensive.
Example: Complete checkout process
🟡 Integration Tests (Some)
Test how components work together.
Example: API + Database interaction
🟢 Unit Tests (Many)
Test individual functions. Fast and reliable.
Example: Test a single function
// Variables - containers for data
const username = "testuser@email.com"; // String (text)
const age = 25; // Number
const isLoggedIn = true; // Boolean (true/false)
// Arrays - lists of items
const browsers = ["Chrome", "Firefox", "Safari"];
// Objects - grouped data
const user = {
name: "John Doe",
email: "john@test.com",
age: 30
}
// Function - reusable block of code
function login(username, password) {
// Code to perform login
console.log(`Logging in as ${username} `);
return true;
}
// Using the function
login("test@email.com", "password123");
// Arrow function (modern way)
const logout = () => {
console.log("User logged out");
}
// Async - wait for operations to complete
async function testLogin() {
// Wait for page to load
await page.goto('https://example.com/login');
// Wait for typing
await page.fill('#username', 'test@email.com');
await page.fill('#password', 'password123');
// Wait for button click
await page.click('#login-button');
}
Let's write your first automated test using Playwright! This test will open a website and verify the title.
# Create a new project
npm init playwright@latest
# This will:
# - Install Playwright
# - Create example tests
# - Set up configuration
import { test, expect } from '@playwright/test';
// Test suite - group of related tests
test.describe('My First Test Suite', () => {
// Individual test case
test('should verify page title', async ({ page }) => {
// Step 1: Navigate to website
await page.goto('https://playwright.dev');
// Step 2: Verify the title
await expect(page).toHaveTitle(/Playwright/);
// Step 3: Take a screenshot
await page.screenshot({ path: 'homepage.png' });
});
});
# Run all tests
npx playwright test
# Run in headed mode (see browser)
npx playwright test --headed
# Run specific test file
npx playwright test my-first-test.spec.ts
Git is like a time machine for your code. It saves versions of your work so you can go back if needed.
# Initialize a new repository
git init
# Check status of files
git status
# Add files to staging
git add .
# Commit changes with message
git commit -m "Add first automation test"
# Push to GitHub
git push origin main
Create a test suite for a login page with multiple test scenarios.
import { test, expect } from '@playwright/test';
test.describe('Login Page Tests', () => {
test('successful login with valid credentials', async ({ page }) => {
await page.goto('https://example.com/login');
await page.fill('#username', 'testuser');
await page.fill('#password', 'password123');
await page.click('button[type="submit"]');
// Verify successful login
await expect(page).toHaveURL(/dashboard/);
});
test('show error with invalid credentials', async ({ page }) => {
await page.goto('https://example.com/login');
await page.fill('#username', 'wrong');
await page.fill('#password', 'wrong');
await page.click('button[type="submit"]');
// Verify error message
const error = page.locator('.error-message');
await expect(error).toBeVisible();
});
test('show validation for empty fields', async ({ page }) => {
await page.goto('https://example.com/login');
await page.click('button[type="submit"]');
// Verify validation messages
await expect(page.locator('#username-error')).toBeVisible();
await expect(page.locator('#password-error')).toBeVisible();
});
});
Congratulations! You've learned the fundamentals of testing and automation:
Next: Master web automation with Playwright in Module 2!