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! 😊

Badges
Extracted from project README's
Playwright JavaScript VS Code Playwright HTML Reporter GitHub Actions Node.js npm Chrome Edge Firefox WebKit Chromium Chrome Edge Firefox WebKit Chromium Java Selenium Appium Rest Assured JavaScript Cypress Playwright Python Requests Google Drive GitHub Repository Email GitHub Profile GitHub Page LinkedIn Topmate Telegram Instagram YouTube WhatsApp Community WhatsApp Channel
Related Projects