Testing Basics

A comprehensive project for learning and practicing testing fundamentals, including unit tests, integration tests, and Selenium web automation.

Overview

This project is designed to teach testing best practices through hands-on examples. It covers:

• Unit testing with Jest
• Test organization and structure
• Assertions and matchers
• Test fixtures and mocks
• Code coverage analysis
• Integration testing patterns
• Web automation with Selenium WebDriver

Project Structure

testing_basics/
├── src/                           # Source code
│   ├── calculator.js             # Example: Simple calculator
│   ├── stringUtils.js            # Example: String utilities
│   └── index.js                  # Entry point
├── tests/                         # Test files
│   ├── calculator.test.js        # Unit tests for calculator
│   ├── stringUtils.test.js       # Unit tests for string utilities
│   ├── selenium/                 # Selenium automation tests
│   │   ├── basicTest.js          # Basic Selenium example
│   │   ├── googleSearch.js       # Google search automation
│   │   └── pageInteraction.js    # Page interaction examples
│   └── fixtures/                 # Test data and fixtures
├── .github/                       # GitHub configuration
│   └── copilot-instructions.md
└── jest.config.js                # Jest configuration

Getting Started

Prerequisites

• Node.js (v14 or higher)
• npm
• Chrome browser (for Selenium tests)

Installation

1. Navigate to the project directory:

cd testing_basics

2. Install dependencies:

npm install

This will install:

• Jest: JavaScript testing framework
• Selenium WebDriver: Browser automation library
• ChromeDriver: WebDriver for Chrome browser

Running Tests

Unit Tests with Jest

• Run all Jest tests:

npm test

• Run tests in watch mode:

npm run test:watch

• Run tests with coverage report:

npm run test:coverage

Selenium Web Automation Tests

• Run basic Selenium example:

npm run test:selenium

• Run specific Selenium test:

node tests/selenium/googleSearch.js

Learning Path

Module 1: Basic Unit Testing

• Writing simple test cases
• Understanding test structure (Arrange, Act, Assert)
• Using Jest matchers
• Testing pure functions

Module 2: Testing Best Practices

• Naming conventions
• Test organization
• Using test fixtures
• Error handling in tests

Module 3: Advanced Testing

• Mocking functions and modules
• Testing async code
• Code coverage analysis
• Integration testing

Module 4: Web Automation with Selenium

• Browser automation fundamentals
• Locating elements
• Interacting with web pages
• Handling waits and timeouts
• Testing web applications

File Descriptions

Source Files

src/calculator.js

A simple calculator module with basic arithmetic operations.

src/stringUtils.js

Utility functions for string manipulation and validation.

src/index.js

Main entry point demonstrating calculator and string utilities.

Test Files

tests/calculator.test.js

Unit tests for the calculator module demonstrating:

• Testing simple functions
• Using different matchers
• Testing error cases

tests/stringUtils.test.js

Unit tests for string utilities demonstrating:

• String validation
• String transformation testing
• Edge case handling

tests/selenium/basicTest.js

Basic Selenium WebDriver example:

• Opening a browser
• Navigating to a website
• Finding elements
• Performing simple actions

tests/selenium/googleSearch.js

Practical example of searching on Google:

• Using multiple locator strategies
• Interacting with form elements
• Waiting for elements to load
• Capturing results

tests/selenium/pageInteraction.js

Advanced page interaction examples:

• Clicking elements
• Entering text in fields
• Handling alerts
• Managing browser windows

Testing Commands Reference

Command	Description
npm test	Run all Jest tests
npm run test:watch	Run tests in watch mode
npm run test:coverage	Generate coverage report
npm run test:selenium	Run basic Selenium example
npm run dev	Run the application

Best Practices Demonstrated

Unit Testing

1. Test Names: Clear, descriptive test names that explain what is being tested
2. Arrange-Act-Assert: Proper test structure for readability
3. DRY Principle: Using beforeEach and afterEach to reduce duplication
4. Error Testing: Testing both success and failure cases
5. Coverage: Aiming for high code coverage (70%+ threshold)

Selenium Testing

1. Wait Strategies: Using explicit waits instead of hard waits
2. Element Locators: Using reliable locator strategies
3. Error Handling: Properly handling exceptions during test execution
4. Browser Management: Opening and closing browsers cleanly
5. Page Objects: Organizing tests with page object pattern (optional)

Selenium WebDriver Setup

Supported Browsers

• Chrome (via ChromeDriver)
• Firefox (via GeckoDriver)
• Safari (native support)

Browser Configuration Example

const { Builder } = require('selenium-webdriver');
const chrome = require('selenium-webdriver/chrome');

let driver = new Builder()
  .forBrowser('chrome')
  .setChromeOptions(new chrome.Options().headless())
  .build();

Locating Elements

const { By } = require('selenium-webdriver');

// Find by ID
driver.findElement(By.id('elementId'));

// Find by CSS selector
driver.findElement(By.css('.classname'));

// Find by XPath
driver.findElement(By.xpath('//button[@type="submit"]'));

// Find by class name
driver.findElement(By.className('classname'));

// Find by name
driver.findElement(By.name('fieldname'));

Common Interactions

const { Key } = require('selenium-webdriver');

// Click element
element.click();

// Type text
element.sendKeys('text');

// Press keys
element.sendKeys(Key.ENTER);

// Get text
element.getText();

// Get attribute
element.getAttribute('href');

// Submit form
element.submit();

Waiting for Elements

const { until, WebDriverWait } = require('selenium-webdriver');

// Wait up to 10 seconds
const element = await new WebDriverWait(driver, 10000)
  .until(until.elementLocated(By.id('myElement')));

// Wait for element to be visible
await new WebDriverWait(driver, 10000)
  .until(until.elementIsVisible(element));

Contributing

When adding new features:

1. Create the feature in src/
2. Write unit tests in tests/
3. Add Selenium tests in tests/selenium/ if testing web interactions
4. Ensure all tests pass: npm test and npm run test:selenium
5. Verify coverage: npm run test:coverage

Troubleshooting

ChromeDriver Not Found

If you get a ChromeDriver error, reinstall dependencies:

npm install

Browser Won't Close

Always call driver.quit() in your tests:

await driver.quit();

Element Not Found

Use explicit waits instead of implicit waits:

const wait = new WebDriverWait(driver, 10000);
const element = await wait.until(until.elementLocated(By.id('id')));

Resources

• Jest Documentation
• Selenium WebDriver Documentation
• Selenium JavaScript API
• Testing Best Practices

License

MIT