🧪 QA Automation Testing

Registration Form - End-to-End Test Suite

📋 Project Overview

Cypress JavaScript E2E Testing Page Object Model

This test checks if users can create accounts on a website. It fills out a form automatically and makes sure everything works correctly. The code uses the Page Object Model pattern, which means we keep our test steps organized and easy to update.

View Tested Application →
Page Object Class RegistrationPage.js
What this does: This file contains all the actions we can do on the registration page. It's like a recipe that tells Cypress how to fill forms and click buttons. 
// This class handles all actions on the registration page
class RegistrationPage {
    
    // Opens the registration page in the browser
    visit() {
        // Goes to the test website
        cy.visit('/dummy-page-for-qa-software-testing2.html');
    }
    
    // Fills all the form fields with test data
    fillForm({
        firstName,
        lastName,
        email,
        phone,
        password,
        confirmPassword = password,  // Uses same password if not specified
        country,
        terms = true,        // Checks terms checkbox by default
        newsletter = true,   // Checks newsletter checkbox by default
    }) {
        // Clear old text and type new text in each field
        cy.get('#firstName').clear().type(firstName);
        cy.get('#lastName').clear().type(lastName);
        cy.get('#email').clear().type(email);
        cy.get('#phone').clear().type(phone);
        cy.get('#password').clear().type(password);
        cy.get('#confirmPassword').clear().type(confirmPassword);
        
        // Select country from dropdown menu
        cy.get('#country').select(country);
        
        // Check the checkboxes if needed
        if (terms) cy.get('#terms').check();
        if (newsletter) cy.get('#newsletter').check();
    }
    
    // Clicks the submit button to create account
    submit() {
        cy.get('[class*="submit-btn"]')
            .contains('Create Account')
            .click();
    }
    
    // Checks if success message appears
    assertSuccess() {
        cy.get('#successMessage')
            .should('be.visible')           // Makes sure message shows up
            .and('contain', '🎉 Account created successfully!');
    }
}

export default RegistrationPage;
Test Specification registration.spec.js
What this does: This is the actual test that runs. It uses the Page Object to test if a user can successfully create an account with valid information. 
// Import the page object we created
import RegistrationPage from './RegistrationPage';

// Group of tests for registration page
describe('QA Testing App - Registration page E2E testing', () => {
    
    // Create a new page object to use in tests
    const page = new RegistrationPage();
    
    // Before each test, go to the registration page
    beforeEach(() => {
        page.visit();
    });
    
    // Test case: Check if account creation works
    it('creates an account successfully', () => {
        
        // Fill the form with test data
        page.fillForm({
            firstName: 'First',
            lastName: 'Last',
            email: 'test@qaautomationresume.com',
            phone: '1234567890',
            password: '1QaTest#12aa',
            country: 'Canada',
            terms: true,        // Accept terms
            newsletter: true,   // Subscribe to newsletter
        });
        
        // Click the submit button
        page.submit();
        
        // Check if success message appears
        page.assertSuccess();
    });
});

✅ What This Test Checks

✓
Form Fields Work: Makes sure all input fields accept text correctly
✓
Dropdown Menu: Checks that country selection works properly
✓
Checkboxes: Tests that terms and newsletter options can be selected
✓
Submit Button: Verifies the form submits when clicked
✓
Success Message: Confirms the right message appears after account creation