chai-jay/protractor-typescript-example

This project is an example of what a Typescript Protractor project could look like.

Typescript Protractor Project Example

This project is an example of what a Typescript Protractor project could look like. I couldn't find very fleshed out examples so decided to put up what I have written for work, in case it helps anyone. All sensitive information (eg logins and URLs) have been removed/replaced with dummy data.

Feel free to modify and use it for your own purposes with no restrictions.

Based on Protractor team's example Typescript project, Angular-CLI generated project, and qualityshepherd's example page object project.

Project Description:

• Project initially setup with Protractor version 5.1.2.
• Makes use of Page Objects.
• Written in Typescript, compiled to ES5 Javascript.
• Page Object classes are in the ./pages directory and should inherit from basePage.po.
• Specs scripts are in the ./specs directory, grouped into directory by page or functionality.
• Mock data (eg usernames and pws) are in ./data directory.
• Utility functions are in ./utils directory.
• If changing file names or deleting files, delete the tmp directory, which contains previously compiled Typescript files. It only updates existing files/adds new ones and doesn't delete ones that don't exist in Typescript anymore.

Setup:

• Install Node (v6.x.x or later)
• Follow setup steps described here
• npm install to install the project dependencies
• In a separate command line window, run webdriver-manager start and keep it running.

Run tests:

• npm run test or npm run test-qa - Run QA env tests. Defaults to using Chrome browser.
• npm run test-prod - Run Production env tests.
• npm run test-qa-cross - Runs cross-browser (Chrome and Firefox) QA env tests.
• npm run test-prod-cross - Run cross-browser (Chrome and Firefox) Production env tests.
• tsc then protractor tmp/conf.js --params.baseUrl=http://localhost - For developers Run local env tests. Make sure local environment is up and running.

Troubleshooting

• run node -v and make sure your node version is 6.x.x or greater
• run java -version and make sure you have Java Development Kit (JDK) installed.
• run npm ls -g --depth=0 and make sure [email protected] or later is installed as a global NPM package.
• Make sure you have a local instance of Selenium Server started. If not, run webdriver-manager start.
• run webdriver-manager update to make sure you have the latest Selenium webdrivers.
• Delete the ./tmp directory before running tests to ensure files are fresh.
• On Windows machines, sometimes Chrome browser will hang and seemingly not do anything when starting e2e scripts. Close it and rerun e2e tests.

TODO:

• Setup screenshotting on spec failures and console logging/reporting.
• Automatically delete files in tsconfig.json's outDir before running tsc.

protractor-typescript-example's Issues

Problem running the command "npm run test".

Problem running the command "npm run test", details follow:

PS C:\Protractor-Typescript\protractor-typescript-example-master> npm run test

[email protected] pretest C:\Protractor-Typescript\protractor-typescript-example-master
tsc

node_modules/@types/selenium-webdriver/http.d.ts(24,14): error TS2304: Cannot find name 'Map'.
node_modules/@types/selenium-webdriver/http.d.ts(48,14): error TS2304: Cannot find name 'Map'.
node_modules/@types/selenium-webdriver/remote.d.ts(139,29): error TS2304: Cannot find name 'Map'.
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] pretest: tsc
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] pretest script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\BSI93387\AppData\Roaming\npm-cache_logs\2021-07-27T19_31_27_407Z-debug.log