Protractor Notes
Protractor Installation
- Some of these notes were made while I went through the examples of the AngularJS Test-driven Development book, which I highly recommend reading.
Install Protractor Globally
npm install -g protractor
- In MacOSX, this should install protractor in: /usr/local/lib/modules/node_modules/protractor
Install Selenium Webdriver for Chrome
webdriver-manager update
Start the server
There are really 2 ways that we can run protractor. We can either run it throught the default Selenium server which is configured out of the box. Or we can use the Chrome Only Driver and run it via the http-client.
The Selenium Server Way
Start the Selenium server
webdriver-manager start
- You will now be able to access it here: http://localhost:4444/wd/hub/static/resource/hub.html
The Chrome Only Way
Create a file called chromeOnlyConfig.js
Create a file called chromeOnlyConfig.js and place it inside your projects root folder. Below is a sample that use the Chrome Driver. Note that the chromeDriver: location points to your global installation of the chrome driver node module, which you installed previously.
exports.config = {
chromeOnly: true,
chromeDriver: '/usr/local/lib/node_modules/protractor/selenium/chromedriver',
capabilities: {
'browserName': 'chrome'
},
baseUrl: 'http://localhost:8080/',
specs: ['spec/e2e/**/*.js'],
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000
}
};
- The Protractor Chrome Only configuration can then be started by running the command:
protractor chromeOnlyConf.js
Start Chrome Only via the HTTP Server
- Install the http-server
npm install http-server -g
- start the http-server by going into your projects root folder and running the following command:
http-server -p 8080
- Browsing to http://localhost:8080 should now work.
- In order to run the Protractor tests in a ChromeOnly configuration, you must have the http-server running. Once it's running, you can run the 'protractor chromeOnlyConf.js' command from your projects root folder.
Quick Recap of Chrome Protractor and Karam Setup on a new project
These are the steps that need to be executed on a new project.
bower install angular
bower install angular-mocks
bower install karma (note - we just do this to get karam intelisense)
mkdir app
mkdir spec
mkdir spec/unit
mkdir spec/e2e
npm install protractor
webdriver-manager update
populate the chromeOnlyConf.js
populate the karma.config.js
npm install http-server
http-server -p 8080
Protractor Locators
Protractor Github page
- The protractor github page also includes setup instructions.