Angular CLI E2E Testing Wrong ChromeDriver

Question

I am using the angular CLI. I created it with:

ng new MyFirstApp

I then tried to run the end to end tests with:

ng e2e

I got the following error message:

E/launcher - session not created: This version of ChromeDriver only supports Chrome version 79
Driver info: chromedriver=79.0.3945.16

at Object.checkLegacyResponse (C:\TestProj\Angular\MyFirstApp\node_modules\selenium-webdriver\lib\error.js:546:15)
    at parseHttpResponse (C:\TestProj\Angular\MyFirstApp\node_modules\selenium-webdriver\lib\http.js:509:13)
    at C:\TestProj\Angular\MyFirstApp\node_modules\selenium-webdriver\lib\http.js:441:30
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
From: Task: WebDriver.createSession()
    at Function.createSession (C:\TestProj\Angular\MyFirstApp\node_modules\selenium-webdriver\lib\webdriver.js:769:24)
    at Function.createSession (C:\TestProj\Angular\MyFirstApp\node_modules\selenium-webdriver\chrome.js:761:15)
    at Direct.getNewDriver (C:\TestProj\Angular\MyFirstApp\node_modules\protractor\built\driverProviders\direct.js:77:33)
    at Runner.createBrowser (C:\TestProj\Angular\MyFirstApp\node_modules\protractor\built\runner.js:195:43)
    at C:\TestProj\Angular\MyFirstApp\node_modules\protractor\built\runner.js:339:29
    at _fulfilled (C:\TestProj\Angular\MyFirstApp\node_modules\q\q.js:834:54)
    at C:\TestProj\Angular\MyFirstApp\node_modules\q\q.js:863:30
    at Promise.promise.promiseDispatch (C:\TestProj\Angular\MyFirstApp\node_modules\q\q.js:796:13)
    at C:\TestProj\Angular\MyFirstApp\node_modules\q\q.js:556:49
    at runSingle (C:\TestProj\Angular\MyFirstApp\node_modules\q\q.js:137:13)

The problem seems to be that I am on a computer where the chrome version is restricted and is at chrome 78 while angular is using chrome 79. I need some way of telling angular to use the driver for chrome 78. I tried doing this with setting the version with webdriver-manager but that didn't work. This module isn't even in my packages.json anyway.

See what I tried:

npm install webdriver-manager -g
webdriver-manager update --version.chrome=78.0.3904.108
ng e2e --webdriver-update=false

How do I make this error go away? Thanks for any help you can provide.

Here is my versioning information:

Operating System: Windows 10
Node: 12.13.1
NPM: 6.13.2
Angular: 8.2.14
Angular CLI: 8.3.21

Here is my packages.json:

{
  "name": "my-first-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.14",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.21",
    "@angular/cli": "~8.3.21",
    "@angular/compiler-cli": "~8.2.14",
    "@angular/language-service": "~8.2.14",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3"
  }
}

Lars Gyrup Brink Nielsen · Answer 1 · 2020-01-02T07:00:14.813

3

I experienced this issue recently. I ended up using a specific version of Puppeteer since every version of it corresponds to a specific major version of Chromium.

Here's what you do:

In Puppeteer's API docs, find the version that is compatible with the version of Chromium you want to use. In your case, we're looking for the version that uses Chrome 78, so we see that we need Puppeteer v1.20.x.
Install that version of Puppeteer as a devDependency in package.json, for example execute npm install --save-dev puppeteer@1.20.x. This will install Puppeteer v1.20 and Chromium 78.

In your project's protractor.conf.js file, first add this import to the top:

const puppeteer = require('puppeteer');

then find these lines

capabilities: {
  'browserName': 'chrome'
},

and replace them with

capabilities: {
  browserName: 'chrome',
  chromeOptions: {
    args: ['--headless', '--disable-gpu', '--window-size=1024,768'],
    binary: puppeteer.executablePath(),
  },
},

Your Protractor end-to-end tests now run with the version of Chromium you wish and will only use a newer Chromium version when you upgrade Puppeteer to a newer version.

Alternatively, you can add and set config.chromeDriver to the executable path of a specific Chrome version in protractor.conf.js.

edited Jan 02 '20 at 07:00

answered Dec 29 '19 at 00:48

Lars Gyrup Brink Nielsen

3,939
2
34
35

I tried the suggestions you gave. I then tried the ng e2e command, but its still trying to use ChromeDriver 79. – user3739190 Dec 29 '19 at 01:15
You said that with puppeteer, it will work with the version of Chrome I wish. How do I specify this? I also tried specifying the path of my chrome binary directly, but that didn't work either. Do I need some option when I run ng e2e? – user3739190 Dec 29 '19 at 01:30
Make sure to follow Steps (1) and (2) to select the right version of Puppeteer. Every version of Puppeteer uses a specific version of Chromium. For example, Puppeteer v1.20 uses Chromium v78. – Lars Gyrup Brink Nielsen Dec 30 '19 at 03:34
I updated the answer with an overview of Chromium/Puppeteer versions: https://github.com/puppeteer/puppeteer/blob/master/docs/api.md – Lars Gyrup Brink Nielsen Jan 02 '20 at 07:00
I have implemented your answer. It has over came my error but it won't opening crome for me. @LarsGyrupBrinkNielsen – Pushprajsinh Chudasama Sep 14 '20 at 06:38
Remove the --headless parameter flag to use regular Chromium with UI. – Lars Gyrup Brink Nielsen Sep 19 '20 at 11:42
Really works, thanks. For me works with npm install --save-dev puppeteer@5.4.x only, for update chromedriver version in tests. – Philip Developer Nov 19 '20 at 17:08

score 2 · Answer 2 · answered Dec 29 '19 at 01:44

2

I was able to get this to work with:

node ./node_modules/protractor/bin/webdriver-manager update --gecko=false --versions.chrome '78.0.3904.108'
ng e2e --webdriver-update=false

However, where do I put the first command above so I don't need to do it manually?

answered Dec 29 '19 at 01:44

user3739190

111
2
9

1

just add a `pree2e` script in your package,json and it will run before `e2e`. – tehbeardedone Jan 03 '20 at 15:17

score 1 · Answer 3 · answered Dec 29 '19 at 04:15

For the first command you can add script command in package.json file.

"script": { 
"firstCommand": "node ./node_modules/protractor/bin/webdriver-manager update --gecko=false --versions.chrome '78.0.3904.108'"
"start-e2e": "firstCommand && ng e2e ---webdriver-update=false"
}

On terminal run npm run start-e2e It will execute firstCommand first and than ng e2e ---webdriver-update=false

You may need to change ng e2e depending on script configuration in package.json file.

Change "firstCommand" to "pree2e" and "start-e2e" to "e2e" to respond to OP's request. — Lars Gyrup Brink Nielsen, Dec 30 '19 at 03:37

Angular CLI E2E Testing Wrong ChromeDriver

3 Answers3