prat3ik/demo-selenium-nodejs

UI automation of Juice shop website using Selenium test automation framework

UI API automation for Juice shop website (demo app) using Selenium.

Why use Selenium based UI test automation framework

• Selenium is one of the best and matured automation tool out there for over a decade.
• It supports various browsers like Chrome, Mozilla, Firefox, Safari
• It also supports all major languages like Java, Python, JavaScript, C#, Ruby, and Perl
• Using selenium we can create custom automation framework with some great capabilities.
• The framework used in this project has below capabilities:
  • Cloud platform execution support (BrowserStack)
  • CI integration
  • Screenshot capture on test failures
  • Different test environment support (prod/stage)

What is Juice shop website?

• It is demo website and ideal candidate for automation testing.
• Official website: https://juice-shop.herokuapp.com/#/

Dependencies

Please ensure you have stable version of Node installed (Recommanded : v12.1.0): https://nodejs.org/en/download/ and also check npm is installed.

node -v // should return valid node version

npm -v // should return valid npm version

Libraries and plugins used

• chromedriver: NPM wrapper for Selenium ChromeDriver
• dotenv: Env variable management library
• chai: Test assertions library
• mocha: Test runner library
• mochawesome: Test reporting library
• selenium-webdriver: UI automation library

Description of Automation tests

There are 5 tests autoamted and detailed test cases can be found here: https://docs.google.com/spreadsheets/d/1lcHxbokzVWC4_wpxxFPVebBidG1wBZTfBKeWHaNbpjw/

Bug report

There is one bug found and logged the details here: https://docs.google.com/spreadsheets/d/1KXMoSVISg9dfRq-KWd9IoIfsKgXcma38we06L4B874E/edit#gid=2088996798

How to run

---

Setup:

Clone the repo and Install the project dependencies: npm install or npm ci

Execution:

1. Local

1) To run the tests on your local normal chrome browser:

• Open testconfig.json and set the below parameters:

  "browserStackEnabled": false
  "isHeadless": false
  

• npm test
• The HTML/JSON reports would be generated inside /TestResults

2) To run the tests on your local chrome browser but with headless mode(browser will not open here, but work in backend)

• On testconfig.json do set the below parameters:

  "browserStackEnabled": false
  "isHeadless": true
  

• npm test
• And HTML/JSON reports can be found inside: /TestResults

NOTE: If there are any test failures, then the screenshot of the failure can be found inside: /TestResults/screenshots

2. Browserstack (Remote):

• To run the tests on Chrome on MacOS X OS

  • Set below parameters on testconfig.json

    "isHeadless": false,
    "browserStackEnabled": true,
    "browserStackOS": "OS X",
    "browserStackOSVersion": "Big sur"
    

  • npm test
  • Go to your browserstack ac. and you can observe the output

• To run the tests on Chrome on Windows 10

  • Set below parameters

    "isHeadless": false,
    "browserStackEnabled": true,
    "browserStackOS": "Windows",
    "browserStackOSVersion": "10"
    

  • npm test
  • Go to your browserstack ac. and you can observe the output

HTML/JSON Reports

HTML & JSON reports will be generated under path: /TestResults at the end of the execution.

• Execute tests: npm test
• Move to: /TestResults
• Open HTML reporttest-report.html
• OR open JSON report test-report.json

---

Video of setup and successful local execution:

https://drive.google.com/file/d/1NYN4uZOiG-4FkdFgdeGtzgcgL8p9JFmn/