title: Angular Protactor e2e tests CI for Azure Devops
body: <p>After I finished my e2e tests and test them if they work. I wanted to change the Azure Devops CI to run the e2e tests. So I added these settings to the YAML file:</p>
  
  <pre><code>pool:
    vmImage: 'ubuntu-latest'
  
  steps:
  
  - task: DeleteFiles@1
    displayName: 'Delete JUnit files'
    inputs:
      SourceFolder: /junit
      Contents: 'TESTS*.xml'
  
  - task: NodeTool@0
    inputs:
      versionSpec: '10.x'
    displayName: 'Install Node.js'
  
  - script:
      npm install -g @angular/cli
      npm install
      ng build --prod
    displayName: 'npm install and build'
  
  - task: Npm@1
    displayName: 'npm install node_modules'
  
  - task: Npm@1
    displayName: 'Build Angular'
    inputs:
      command: custom
      customCommand: run build
  
  - task: Npm@1
    displayName: 'Test Angular'
    inputs:
      command: custom
      customCommand: run test -- --watch=false --code-coverage
  
  - task: Npm@1
    displayName: 'Test e2e Angular'
    inputs:
      command: custom
      customCommand: run e2e
  
  - task: PublishCodeCoverageResults@1
    displayName: 'Publish code coverage Angular results'
    condition: succeededOrFailed()
    inputs:
      codeCoverageTool: Cobertura
      summaryFileLocation: 'coverage/front-end/cobertura-coverage.xml'
      reportDirectory: coverage/front-end
      failIfCoverageEmpty: true
  
  - task: PublishTestResults@2
    displayName: 'Publish Angular test results'
    condition: succeededOrFailed()
    inputs:
      searchFolder: $(System.DefaultWorkingDirectory)/junit
      testRunTitle: Angular
      testResultsFormat: JUnit
      testResultsFiles: "**/TESTS*.xml"
  </code></pre>
  
  <p>When running this build I get the next error in:</p>
  
  <pre><code>npm ERR! errno 1
  npm ERR! front-end@0.0.0 e2e: `ng e2e --configuration=mock`
  &gt; front-end@0.0.0 e2e /home/vsts/work/1/s
  npm ERR! Exit status 1
  &gt; ng e2e --configuration=mock
  npm ERR! 
  
  npm ERR! Failed at the front-end@0.0.0 e2e script.
  [09:41:05] I/file_manager - creating folder /home/vsts/work/1/s/node_modules/protractor/node_modules/webdriver-manager/selenium
  npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
  [09:41:05] I/config_source - curl -o/home/vsts/work/1/s/node_modules/protractor/node_modules/webdriver-manager/selenium/chrome-response.xml https://chromedriver.storage.googleapis.com/
  
  [09:41:06] I/downloader - curl -o/home/vsts/work/1/s/node_modules/protractor/node_modules/webdriver-manager/selenium/chromedriver_78.0.3904.70.zip https://chromedriver.storage.googleapis.com/78.0.3904.70/chromedriver_linux64.zip
  npm ERR! A complete log of this run can be found in:
  [09:41:06] I/update - chromedriver: unzipping chromedriver_78.0.3904.70.zip
  npm ERR!     /home/vsts/.npm/_logs/2019-11-06T09_41_31_069Z-debug.log
  [09:41:06] I/update - chromedriver: setting permissions to 0755 for /home/vsts/work/1/s/node_modules/protractor/node_modules/webdriver-manager/selenium/chromedriver_78.0.3904.70
  [34mℹ[39m [90m｢wds｣[39m: Project is running at http://localhost:4200/webpack-dev-server/
  [34mℹ[39m [90m｢wds｣[39m: webpack output is served from /
  [34mℹ[39m [90m｢wds｣[39m: 404s will fallback to //index.html
  
  chunk {main} main.js, main.js.map (main) 161 kB [initial] [rendered]
  chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 264 kB [initial] [rendered]
  chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
  chunk {styles} styles.js, styles.js.map (styles) 565 kB [initial] [rendered]
  chunk {vendor} vendor.js, vendor.js.map (vendor) 7.57 MB [initial] [rendered]
  Da- Hash: ef1865e27a0ba930b45d - Time: 18647ms
  ** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
  [34mℹ[39m [90m｢wdm｣[39m: Compiled successfully.
  [09:41:27] I/launcher - Running 1 instances of WebDriver
  [09:41:27] I/direct - Using ChromeDriver directly...
  [09:41:30] E/launcher - session not created: This version of ChromeDriver only supports Chrome version 78
    (Driver info: chromedriver=78.0.3904.70 (edb9c9f3de0247fd912a77b7f6cae7447f6d3ad5-refs/branch-heads/3904@{#800}),platform=Linux 4.15.0-1059-azure x86_64)
  [09:41:30] E/launcher - SessionNotCreatedError: session not created: This version of ChromeDriver only supports Chrome version 78
    (Driver info: chromedriver=78.0.3904.70 (edb9c9f3de0247fd912a77b7f6cae7447f6d3ad5-refs/branch-heads/3904@{#800}),platform=Linux 4.15.0-1059-azure x86_64)
      at Object.checkLegacyResponse (/home/vsts/work/1/s/node_modules/selenium-webdriver/lib/error.js:546:15)
      at parseHttpResponse (/home/vsts/work/1/s/node_modules/selenium-webdriver/lib/http.js:509:13)
      at doSend.then.response (/home/vsts/work/1/s/node_modules/selenium-webdriver/lib/http.js:441:30)
      at process._tickCallback (internal/process/next_tick.js:68:7)
  From: Task: WebDriver.createSession()
      at Function.createSession (/home/vsts/work/1/s/node_modules/selenium-webdriver/lib/webdriver.js:769:24)
      at Function.createSession (/home/vsts/work/1/s/node_modules/selenium-webdriver/chrome.js:761:15)
      at Direct.getNewDriver (/home/vsts/work/1/s/node_modules/protractor/built/driverProviders/direct.js:77:33)
      at Runner.createBrowser (/home/vsts/work/1/s/node_modules/protractor/built/runner.js:195:43)
      at q.then.then (/home/vsts/work/1/s/node_modules/protractor/built/runner.js:339:29)
      at _fulfilled (/home/vsts/work/1/s/node_modules/q/q.js:834:54)
      at /home/vsts/work/1/s/node_modules/q/q.js:863:30
      at Promise.promise.promiseDispatch (/home/vsts/work/1/s/node_modules/q/q.js:796:13)
      at /home/vsts/work/1/s/node_modules/q/q.js:556:49
      at runSingle (/home/vsts/work/1/s/node_modules/q/q.js:137:13)
  [09:41:30] E/launcher - Process exited with error code 199
  Found npm debug log, make sure the path matches with the one in npm's output: /home/vsts/.npm/_logs/2019-11-06T09_41_31_069Z-debug.log
  0 info it worked if it ends with ok
  1 verbose cli [ '/opt/hostedtoolcache/node/10.17.0/x64/bin/node',
  1 verbose cli   '/opt/hostedtoolcache/node/10.17.0/x64/bin/npm',
  1 verbose cli   'run',
  1 verbose cli   'e2e' ]
  2 info using npm@6.13.0
  3 info using node@v10.17.0
  4 verbose run-script [ 'pree2e', 'e2e', 'poste2e' ]
  5 info lifecycle front-end@0.0.0~pree2e: front-end@0.0.0
  6 info lifecycle front-end@0.0.0~e2e: front-end@0.0.0
  7 verbose lifecycle front-end@0.0.0~e2e: unsafe-perm in lifecycle true
  8 verbose lifecycle front-end@0.0.0~e2e: PATH: /opt/hostedtoolcache/node/10.17.0/x64/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/home/vsts/work/1/s/node_modules/.bin:/opt/hostedtoolcache/node/10.17.0/x64/bin:/usr/share/rust/.cargo/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/snap/bin
  9 verbose lifecycle front-end@0.0.0~e2e: CWD: /home/vsts/work/1/s
  10 silly lifecycle front-end@0.0.0~e2e: Args: [ '-c', 'ng e2e --configuration=mock' ]
  11 silly lifecycle front-end@0.0.0~e2e: Returned: code: 1  signal: null
  12 info lifecycle front-end@0.0.0~e2e: Failed to exec e2e script
  13 verbose stack Error: front-end@0.0.0 e2e: `ng e2e --configuration=mock`
  13 verbose stack Exit status 1
  13 verbose stack     at EventEmitter.&lt;anonymous&gt; (/opt/hostedtoolcache/node/10.17.0/x64/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:332:16)
  13 verbose stack     at EventEmitter.emit (events.js:198:13)
  13 verbose stack     at ChildProcess.&lt;anonymous&gt; (/opt/hostedtoolcache/node/10.17.0/x64/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
  13 verbose stack     at ChildProcess.emit (events.js:198:13)
  13 verbose stack     at maybeClose (internal/child_process.js:982:16)
  13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)
  14 verbose pkgid front-end@0.0.0
  15 verbose cwd /home/vsts/work/1/s
  16 verbose Linux 4.15.0-1059-azure
  17 verbose argv "/opt/hostedtoolcache/node/10.17.0/x64/bin/node" "/opt/hostedtoolcache/node/10.17.0/x64/bin/npm" "run" "e2e"
  18 verbose node v10.17.0
  19 verbose npm  v6.13.0
  20 error code ELIFECYCLE
  21 error errno 1
  22 error front-end@0.0.0 e2e: `ng e2e --configuration=mock`
  22 error Exit status 1
  23 error Failed at the front-end@0.0.0 e2e script.
  23 error This is probably not a problem with npm. There is likely additional logging output above.
  24 verbose exit [ 1, true ]
  </code></pre>
  
  <p>It indicates that it only supports ChromeDriver 78 but in the logs above it, it says that it installed the ChromeDriver 78. Maybe that there is another instance of ChromeDriver but I can't locate it. I also tried running the tests locally without any Chrome installed and it worked perfectly.</p>
  
  <p>The last piece of code is the protractor config file. Maybe that there is something wrong with it.</p>
  
  <pre><code>const { SpecReporter } = require('jasmine-spec-reporter');
  
  process.env.CHROME_BIN = process.env.CHROME_BIN || require("puppeteer").executablePath();
  
  const testResultsPath = process.cwd() + '/junit/';
  
  /**
   * @type { import("protractor").Config }
   */
  exports.config = {
    allScriptsTimeout: 11000,
    specs: [
      './src/**/*.e2e-spec.ts'
    ],
    capabilities: {
      'browserName': 'chrome',
  
      chromeOptions: {
        args: ["--headless", "--disable-gpu", "--window-size=1280x1024"],
        binary: process.env.CHROME_BIN
      }
    },
    directConnect: true,
    baseUrl: 'http://localhost:4200/',
    framework: 'jasmine',
    jasmineNodeOpts: {
      showColors: true,
      defaultTimeoutInterval: 30000,
      print: function() {}
    },
    onPrepare() {
      require('ts-node').register({
        project: require('path').join(__dirname, './tsconfig.json')
      });
  
      const jasmineReporters = require('jasmine-reporters');
      jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
      jasmine.getEnv().addReporter(new jasmineReporters.JUnitXmlReporter({
        consolidateAll: true,
        savePath: testResultsPath,
        filePrefix: 'TESTS-E2E'
      }));
    }
  }
  </code></pre>
  
  <p>;</p>