TestAutomationFramework_YT_Rajat_Web_Playwright_JS

This repository contains a Test Automation Framework built using Playwright and Javascript for automated testing of web applications.

Stars
9

💻 Test Automation Framework | WEB

📑 Table of Contents

📖 Introduction

This repository contains a Test Automation Framework built using Playwright and Javascript for automated testing of web applications.

🛠️ Prerequisites

  • Node.js (v18.16.1 or higher recommended)
  • npm (v9.5.1 or higher recommended)

▶️ Getting Started

  1. Clone the repository:

    git clone https://github.com/rajatt95/TestAutomationFramework_YT_Rajat_Web_Playwright_JS.git
    
  2. Navigate to the project directory:

    cd TestAutomationFramework_YT_Rajat_Web_Playwright_JS
    
  3. Install dependencies:

    npm install
    

🚀 Running Tests

  • Playwright UI mode:

    npm run tests:ui-mode
    
  • Execution in different browsers:

    • Chrome
      EdgeFirefox
      WebKit
      Chromium
    npm run tests:CHROME
    
    npm run tests:EDGE
    
    npm run tests:FIREFOX
    
    npm run tests:WEBKIT
    
    npm run tests:CHROMIUM
    
  • Execution in Headless mode:

    npm run tests:CHROME:HEADLESS
    

📁 Project Structure

The tests follow a modular and maintainable structure:

|-- .github
|     |-- workflows
|          |-- 01_ui_tests_chrome.yml
|          |-- 02_ui_tests_select_one.yml.yml
|          |-- 03_ui_tests_ALL.yml
|-- pages
|     |-- BasePage.js
|     |-- CartPage.js
|     |-- Components.js
|     |-- LoginPage.js
|     |-- ProductsPage.js
|-- test-data
|     |-- login_credentials.json
|-- tests-saucedemo
|     |-- components.spec.js
|     |-- login.spec.js
|-- utils
|     |-- VerificationUtils.js
|     |-- WaitUtils.js
|-- .gitignore
|-- package.json
|-- playwright.config.js
  • pages: Contains the Page Object Model (POM) classes representing web pages and their elements.
  • playwright-report: Contains the HTML report for tests (Logs, Screenshots, Traces and Videos are attached).
  • test-data: Contains external files (example: login credentials data) that can be used to mock data during tests.
  • tests-saucedemo: Contains the actual test files. You can organize your tests into subdirectories as needed.
  • utils: Contains the Utilities that provides methods for asserting different conditions on web elements, waits.

⚙️ Configuration

  • Modify playwright.config.js for playwright configuration settings such as
    • baseURL
    • testDir
    • reporter
    • fullyParallel
    • video
    • screenshot
    • trace

🔄 Continuous Integration

This project is configured for CI using Github Actions. Check the configurations in .github/workflows/*.yml.

  • 01_ui_tests_chrome.yml: This workflow executes tests in Chrome browser.

  • 02_ui_tests_select_one.yml: This workflow will first ask User to select the browser for tests execution.

  • 03_ui_tests_ALL.yml: This workflow executes the tests in all browsers

📊 Reporting

Playwright HTML report (Logs, Screenshots, Traces and Videos are attached) is stored in the playwright-report directory.

🔭 Other Projects

  • -

  • -

  • -

📄 Technical Documents

  • Google Drive
  • GitHub Repository

📧 Contacts

  • Email
  • GitHub Profile
  • GitHub Page
  • LinkedIn
  • Topmate
  • Telegram
  • Instagram
  • YouTube
  • WhatsApp Community
  • WhatsApp Channel

Feel free to reach out if you have any questions, or suggestions, or just want to chat!

Thanks for visiting my GitHub profile! 😊