A comprehensive, enterprise-grade TypeScript-based Selenium automation testing framework implementing industry best practices for scalable and maintainable test automation.

This professional-grade automation framework is designed to test various functionalities of the-internet.herokuapp.com using modern testing approaches. Built with TypeScript, Selenium WebDriver 4.0, and Mocha/Chai, it demonstrates enterprise-level test automation practices including:

• ✅ Page Object Model (POM) architecture
• ✅ Behavior-Driven Development (BDD) approach
• ✅ Cross-browser compatibility testing
• ✅ Comprehensive logging and reporting
• ✅ CI/CD ready configuration
• ✅ Code quality enforcement

• TypeScript: Strongly-typed JavaScript for better code quality and IDE support
• Page Object Model (POM): Separation of page elements and test logic for better maintainability
• BDD Testing: Behavior-Driven Development approach using Mocha + Chai
• Cross-browser Support: Configurable browser testing (Chrome, Firefox, Safari, Edge)
• Comprehensive Logging: Detailed test execution logs for debugging and reporting
• 5-second Static Waits: Manual verification pauses for visual confirmation during test execution
• Modular Architecture: Reusable components and utilities

• Human-readable tests: Tests written in natural language describing user behavior
• Stakeholder collaboration: Tests that business users can understand
• Given-When-Then structure: Clear test organization

• before(): Browser setup and configuration
• beforeEach(): Navigate to test pages and prepare test data
• afterEach(): Clean up cookies and session data
• after(): Browser teardown and resource cleanup

• Maintainability: Changes to UI require updates in only one place
• Reusability: Page objects can be shared across multiple tests
• Readability: Tests focus on business logic rather than technical details

selenium-test-project/
├── 📄 package.json                 # Node.js dependencies and scripts
├── 📄 tsconfig.json               # TypeScript configuration
├── 📄 README.md                   # Project documentation
└── 📂 src/                        # Source code directory
    ├── 📂 pages/                  # Page Object Models (POM)
    │   ├── 🏠 BasePage.ts          # Base class for all page objects
    │   ├── 🔐 LoginPage.ts         # Login functionality page object
    │   ├── 📋 DropdownPage.ts      # Dropdown selection page object
    │   ├── ☑️ CheckboxesPage.ts     # Checkbox interaction page object
    │   ├── 🖱️ DragAndDropPage.ts   # Drag & drop functionality page object
    │   ├── 📤 FileUploadPage.ts    # File upload functionality page object
    │   ├── 🎯 HoversPage.ts        # Mouse hover interactions page object
    │   └── 📝 LoggingPage.ts       # Console logging page object
    ├── 📂 tests/                  # Test specifications
    │   ├── 🧪 LoginTest.ts         # Login functionality tests
    │   ├── 🧪 DropdownTest.ts      # Dropdown selection tests
    │   ├── 🧪 CheckboxesTest.ts    # Checkbox interaction tests
    │   ├── 🧪 DragAndDropTest.ts   # Drag & drop tests
    │   ├── 🧪 FileUploadTest.ts    # File upload tests
    │   ├── 🧪 HoversTest.ts        # Mouse hover tests
    │   └── 🧪 LoggingTest.ts       # Console logging tests
    ├── 📂 utils/                  # Utility classes and helpers
    │   ├── 🌐 WebDriverManager.ts  # Browser driver management
    │   └── 📊 Logger.ts            # Logging utility for test execution
    └── 📂 config/                 # Configuration files
        └── ⚙️ TestConfig.ts        # Test environment configuration

This framework covers the following test scenarios from the-internet.herokuapp.com:

• Node.js (v14+ recommended)
• npm or yarn package manager
• Chrome Browser (or other supported browsers)
• Git for version control

1. Clone the repository:

   git clone <repository-url>
   cd selenium-test-project

2. Install dependencies:

   npm install

3. Verify installation:

   npm run --version
   npx tsc --version

npm test

# Run only login tests
npx mocha -r ts-node/register src/tests/LoginTest.ts

# Run only dropdown tests
npx mocha -r ts-node/register src/tests/DropdownTest.ts

# Chrome (default)
BROWSER=chrome npm test

# Firefox
BROWSER=firefox npm test

# Safari
BROWSER=safari npm test

HEADLESS=true npm test

• 🕐 5-Second Static Waits: Each test includes manual verification pauses
• 📝 Detailed Logging: Comprehensive test execution logs
• 🔄 Automatic Cleanup: Browser sessions and cookies cleaned after each test
• ⚡ Parallel Execution: Run multiple test suites simultaneously (coming soon)

Edit src/config/TestConfig.ts to customize:

export const TestConfig = {
  baseUrl: 'http://the-internet.herokuapp.com',
  browser: 'chrome',          // chrome, firefox, safari, edge
  headless: false,            // true for headless mode
  timeout: 30000,             // Element wait timeout
  implicitWait: 10000,        // Implicit wait time
  windowSize: '1920,1080'     // Browser window size
};

• Test data stored in page objects
• Environment-specific configurations supported
• Sensitive data can be stored in environment variables

The project includes a comprehensive logging utility (src/utils/Logger.ts) that captures:

• ✅ Test execution steps
• ⚠️ Warnings and errors
• 🐛 Debug information
• 📊 Performance metrics
• 🌐 Browser console logs

Logger.info('Test step completed');
Logger.warn('Element not found, retrying...');
Logger.error('Test failed with exception');
Logger.debug('Variable value: ' + value);

• Console output with colored formatting
• Detailed error messages with stack traces
• Test execution time tracking
• Browser console error capture

// Example: LoginPage.ts
export class LoginPage extends BasePage {
  private usernameField = By.id('username');
  private passwordField = By.id('password');
  private loginButton = By.css('button[type="submit"]');

  async login(username: string, password: string): Promise<void> {
    await this.enterText(this.usernameField, username);
    await this.enterText(this.passwordField, password);
    await this.click(this.loginButton);
    
    // 5-second wait for manual verification
    await this.wait(5000);
  }
}

// Example: LoginTest.ts
describe('Login Functionality', () => {
  describe('When user provides valid credentials', () => {
    it('should successfully log in and redirect to secure area', async () => {
      // Given: User is on login page
      await loginPage.navigate();
      
      // When: User enters valid credentials
      await loginPage.login('tomsmith', 'SuperSecretPassword!');
      
      // Then: User should be on secure page
      expect(await securePage.isDisplayed()).to.be.true;
      expect(await securePage.getWelcomeMessage())
        .to.contain('You logged into a secure area!');
    });
  });
});

We welcome contributions! Please follow these guidelines:

1. Fork the repository
2. Create a feature branch: git checkout -b feature/new-test-case
3. Make your changes following TypeScript and testing best practices
4. Add tests for new functionality
5. Run the test suite: npm test
6. Commit your changes: git commit -m "Add new test case for XYZ"
7. Push to the branch: git push origin feature/new-test-case
8. Create a Pull Request

• Follow TypeScript best practices
• Use meaningful variable and function names
• Add JSDoc comments for public methods
• Maintain consistent indentation (2 spaces)
• Write descriptive test names using BDD format

1. Create page object in src/pages/
2. Create test file in src/tests/
3. Follow existing naming conventions
4. Include 5-second static waits for manual verification
5. Add comprehensive assertions

• BDD (Behavior-Driven Development): Write tests in natural language describing user behavior
• TDD (Test-Driven Development): Write tests before implementing functionality
• Page Object Model: Encapsulate page elements and actions in reusable classes
• Hooks: Setup and teardown functions for test lifecycle management

• Selenium WebDriver - Browser automation
• Mocha - Test framework and runner
• Chai - Assertion library
• TypeScript - Language documentation

This project is licensed under the ISC License. See the LICENSE file for more details.

If you encounter any issues or have questions:

1. Check the existing issues in the repository
2. Create a new issue with detailed description
3. Include error logs and environment information
4. Tag the issue with appropriate labels

Happy Testing! 🎉

Built with ❤️ using TypeScript, Selenium WebDriver, Mocha, and Chai