alavijay / playwright-typescipt-playwright-test

This is Boilerplate/Template for Playwright with Playwright Test using Typescript

Table of Contents

1. About the Project
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. Usage
4. Reports

About the Project

Playwright Demo - This project is based on Microsoft Playwright which enables reliable end-to-end testing for modern web apps.

Top Features:

• Easy to Configure.
• Auto-waits for all the relevant checks to pass and only then performs the requested action.
• Records videos for Test Cases.
• Records the test script and every action on the target page is turned into generated script.
• Generates trace file, which gives in-depth details of Test Case execution.
• Execution of test case is faster when compared with other competitive framework in market.
• Supports Headful/Headless mode execution for Firefox/Webkit/Google Chrome/Chromium/MS Edge on Windows/Linux/Mac machines.
• It can be used to simulate browser behaviour on mobile devices, and supports over 100+ devices.
• It has ability to produce and visually compare screenshots.
• To slow down execution slowMo option is available.
• Supports 'download' event monitoring, so there is no need for user to actually wait for downloads to finish.
• Supports Serial and Parallel execution.
• Allure Reports are generated after execution with an option to capture screenshot/video/trace file on failure.
• Nonetheless Support from Microsoft so FREQUENT RELEASES and turn arounf time for any queries is 48 hours.

Bonus:

• Supports API testing using 'supertest' module.
• Supports PostgresSQL using 'pg' module.
• Supports Excel File Read/Write using 'excel-js' module.

Built With

• Playwright
• Typescript
• Supertest
• node-postgres
• excel-js
• ESLint

Getting Started

Prerequisites

The following software are required:

• nodejs : Download and Install Node JS from

  https://nodejs.org/en/download/

• Install Java 8 or above, Allure Reports require Java 8 or higher.

• allure commandline : Install allure command line for generating Allure Reports using

  npm install -g allure-commandline

Installation

1. Clone the repo using below URL

https://github.com/akshayp7/playwright-typescipt-playwright-test.git

2. Navigate to folder and install npm packages using:

npm install

Usage

1. For Browser Configuration, change required parameters in playwright.config.ts.
2. For execution entire test suite on all available browsers simultaneously execute, Test Cases are present in "tests" folder:

npm run test

3. For executing single test case on Chrome browser execute the below command, you can change the browser for execution e.g. if you want to run test cases on Firefox, you can change --project=Firefox against test:single in package.json, just make sure the browser name given matches the name given in playwright.config.ts.

npm run test:single

4. For executing test cases in parallel, provide a suitable tag @SmokeTest at the start of your test case name, then in package.json against test:parallel give the tag value and execute :

npm run test:parallel

5. For executing test cases in sequence, provide a suitable tag @SmokeTest at the start of your test case name, then in package.json against test:serial give the tag value and execute, workers parameter correspond to test cases you want to execute simultaneously e.g. --workers=3, executes 3 test cases simultaneously :

npm run test:serial

6. For executing API test cases :

npm run test:api

7. For recording test scripts :

npm run test:record

8. To produce and visually compare screenshots execute below command. On first execution reference screenshot will be generated for comparision with subsequent runs.

npm run test:visual

9. For emulating test cases on any device, in playwright.config.ts, under device section provide desired device name and execute :

npm run test:device

10. For Report generation execute :

npm run test:report

11. For debugging test cases add debug points, the press CNTRL+SHIFT+P and type "debug:debug npm script", on the edit box select desired script.
12. Screenshots, Videos and Trace files will be generated in test-results folder.
13. To change your username go to testData.json and provide value against username
14. To change password, go to lib/WebActions in decipherPassword() uncomment ENCRYPT code block and replace password with your password, execute the test case, Encrypted password will be printed on your console . Copy Encrypted password in testData.json against password field. You can comment Encrypt bloack ater this.
15. For executing Postgres DB test case, navigate to testData.json and provide values for dbUsername, dbPassword, dbServerName, dbPort, dbName. Refer to tests/DB.test.ts for connecting to DB and Firing a Query.
16. For viewing trace files, go to folder where trace.zip is generated and execute :

npx playwright show-trace trace.zip

Reports

• Overall Report

• Detailed Report

• Failure Report