Integrating Protractor with Yeoman via Grunt

Question

I want to integrate Protractor with a scaffold produced by Yeoman. I followed a tutorial and therein, the older scenario-runner was used for setting up e2e testing (via grunt).

I would like to upgrade my scaffold and use Protractor instead.
Any thoughts?

Answer 1

1. Install protractor and grunt-protractor-runner from npm:

   npm install protractor grunt-protractor-runner --save-dev
   

2. Create a config file for protractor (protractor.conf.js), change specs and baseUrl to your test files and test server:

   exports.config = {
     seleniumAddress: 'http://localhost:4444/wd/hub',
     specs: ['test/e2e/*_test.js'],
     baseUrl: 'http://localhost:9001' //default test port with Yeoman
   }
   

3. Update your Gruntfile.js, add the following after the karma task:

   protractor: {
     options: {
       keepAlive: true,
       configFile: "protractor.conf.js"
     },
     run: {}
   }
   

4. Add the protractor task under test

   grunt.registerTask('test', [
     'clean:server',
     'concurrent:test',
     'autoprefixer',
     'connect:test',
     'karma',
     'protractor:run'
   ]);
   

5. Download and start the selenium server:

   node_modules/protractor/bin/webdriver-manager update
   node_modules/protractor/bin/webdriver-manager start
   

   (In Windows:)

   node node_modules/protractor/bin/webdriver-manager update
   node node_modules/protractor/bin/webdriver-manager start
   

6. Update your package.json, add the following after "devDependencies". This will run the command after npm install so you don't need to remember every time.

   "scripts": {
     "install": "node node_modules/protractor/bin/webdriver-manager update"
   }
   

7. Run the test using grunt

   grunt test
   

If you want protractor to start the server for you, remove

seleniumAddress: 'http://localhost:4444/wd/hub',

from protractor.conf.js, then running grunt test will start a standalone selenium instance during the test and quit it after running the test suite.

Answer 2

One thing to add to the existing answer; if you want to start up the Selenium server automatically you have to also specify the location of your seleniumServerJar and chromeDriver (if using Chrome) like so otherwise the tests will not work until you manually start the Selenium server (make sure to run "webdriver-manager update" from the command line first):

protractor: {
        options: {
            keepAlive: false,
            configFile: "test/config/protractor.conf.js",
            noColor: true, // If true, protractor will not use colors in its output.

            args: {
                seleniumServerJar: 'node_modules/protractor/selenium/selenium-server-standalone-2.39.0.jar',
                chromeDriver: 'node_modules/protractor/selenium/chromedriver.exe'
            }
        },
        run: {

        }
    },

Answer 3

As @user2172816 mentions in their answer - leaving out seleniumAddress: 'http://localhost:4444/wd/hub' from your protractor config will usually cause Protractor to start a Selenium instance for you.

As an alternative, you could use grunt-protractor-webdriver to start Selenium:

1) Install and save grunt-protractor-webdriver

npm install grunt-protractor-webdriver --save-dev

2) Add the following into your Grunt definition function:

grunt.loadNpmTasks('grunt-protractor-webdriver');

3) Add the following example protractor webdriver task:

protractor_webdriver: {
        start: {
            options: {
                path: 'node_modules/protractor/bin/',
                command: 'webdriver-manager start'
            }
        }
    }

4) Add protractor_webdriver to your test task before running protractor e.g.

grunt.registerTask('test', [
    'clean:server',
    'concurrent:test',
    'autoprefixer',
    'connect:test',
    'karma',
    'protractor_webdriver',
    'protractor:run'
]);