Go to Testlio
All Collections
Testlio Processes
Javascript Installation Guide

Javascript Installation Guide

Joao Santos avatar
Written by Joao Santos
Updated over a week ago

Index

  1. Node Installation

  2. Framework Installation

  3. Test case management

  4. Locator management

  5. Page classes

  6. Package for the Platform

Node Installation

If you don’t have homebrew then install homebrew first.

Steps to install homebrew:

Step to install Node

  • Open terminal

  • Run the following command: `brew install node`

  • To check node has been installed properly, use the following command: `node -v`, it should display the version of node

Environment Setup:

  • Android Setup

TBD

  • IOS Setup

TBD

Framework Installation:

Please download the framework from GitHub URL provided by your co-ordinator

Check that your X-Code is downloaded and active in /Applications folder, if it is installed in some other location, use the following command to switch: `sudo xcode-select -switch Path/to/Xcode.app`

If Python 3.x is not installed, then install it using: `brew install python@3.9`

Run the following command: `brew install pkg-config cairo pango libpng jpeg giflib librsvg`

Now, run the following command to install the framework:

  • Open Terminal

  • Change your directory path to the folder in which the framework has been downloaded: `cd path/to/framework`

  • run the following command `npm install`

To run a sample desktop web test:

  • Open a terminal tab in the same folder, run the following command: `npm install selenium-standalone --save-devnpx selenium-standalone install && npx selenium-standalone start`

  • When the terminal prompts `Selenium start` you are good to go with desktop web test

  • Now, come to the second terminal tab in the same folder, run the following command `npm test -- --executiontype=web --provider=local --browser=chrome –allureResults='./allure-results`

  • The same command can be used to run any test Desktop web test

To run the sample Android run

  • Install appium, if not installed, using command `npm install -g appium`

  • Open a terminal tab, run appium

  • Open a different terminal tab in the folder, where the framework is present, and run the following command: `npm test -- --executiontype=mobile-native --provider=local --mobileDevicePlatform=android --mobileDevicePlatformVersion=10 --appPackage="com.grewon.testlio" --appLaunchActivity="com.grewon.testlio.splash.SplashActivity" --deviceId="your_android_device_id" --allureResults='./allure-results' –appiumScreenshotPath=screenshot`

  • The same command can be used to run Android mobile Test

To run the sample iOS run

  • TBD

TESTCASE MANAGEMENT

Tests need to be put in the `tests` folder relative to the `MasterSuite.ts` class, if the test is meant for Mobile, then make a folder `mobile` under the `tests` folder, put the test there, if they belong to ‘Desktop-Web`, then make a `web` folder under `tests`, then put it there.

Then you have maintained it in the `suite.xlsx` file like the following:

  • If it belongs to a specific project, already mentioned in the `Project` sheet, then there should be a Sheet named on that project, open that sheet, make the entries like this:

  • Then, in the `Test Case Description` column, give the test case description to the test case, then in the `Test Case` column put the relative path of the test case with respect to MasterSuite.ts, Give `Status` to the test case, if you want to run it, then make `Status` to `RUN`, otherwise put `NO`, If you want to add `Username’ and `Password`, then put the Values.

  • In a test case, you need to initialize the driver, as follows before block:

  • Then, after the block, delete the session as follow:

  • You can add multiple it blocks if test case is long

  • If testcase belongs to a project, which is not been added to the `Project` suite yet,

  • Put the Project name in the `Project Name` column, Give the `Run Mode`, as `RUN`, if you want to run the project, or `NO` if you don’t want to run it. Mention `Platform` as `WEB` or `MOBILE`, depending project is for Web or Mobile

  • Add a sheet in `suites.xlsx` with the exact name of a project created above, suppose you have mentioned a project above as `ABCTest`, then add a sheet named `ABCTest`

  • In the newly added sheet, you can add your test, as detailed above

LOCATOR MANAGEMENT

  • We have two excel sheets i.e. AppObjectRepository.xlsx (for Web) and AppObjsRepository_mobile.xlsx (for Mobile), managing locators/selectors for apps

  • The first, start with Web locators. They will be in AppObjectRepository.xlsx, you need to Add ElementName under the `ElementName` column and locator under the `Locators` column (How to create a selector for WDIO, please see here: Create selectors

  • If the page name is not already there, please add a separate excel sheet with that page name

  • For mobile, locators will be in AppObjsRepository_mobile.xlsx, we need to have separate locators for iOS and Android as follows:

  • If a locator for any element on a particular platform is not required, mark that column `not_applied`

PAGE CLASSES

  • For each page in Web App, or for each screen in the Mobile app, there should be one corresponding page/screen class in the codebase

  • Page class for the Web app should extend the Webpage class, whereas Screen class for the Mobile app should extend the Mobile screen class as follow:

  • Chunks for the Web app and Widgets for the Mobile app should be defined in chunks and Widgets folders respectively

  • Page and Screen classes should have all the elements defined in the appObjsRepository excel sheet as follow:

Whereas variable name and key for getting locator, should be same as element name as the corresponding ElementName in appObjsReposatory

  • Page and Screen classes should have all the methods operating on those elements

Package for the Platform

  • Run the command `npm run package`

  • A zip file like the following will be generated in the root folder:

Did this answer your question?