Protractor and headless chrome: Could not find Angular on page

Question

I can run my e2e test on my Angular2 app with chrome and it works just fine. When I try to use headless chrome with just the additional chromeOptions it fails to find the angular app. I've tried with directConnect:true and also starting the selenium server with webdriver-manager first but both fail the same.

The first thing the test does is call browser().get('/');

yarn run v1.3.2
$ protractor protractor.conf.js
[10:51:34] I/launcher - Running 1 instances of WebDriver
[10:51:34] I/direct - Using ChromeDriver directly...
Jasmine started
[10:51:48] E/protractor - Could not find Angular on page https://localhost:4200/ : retries looking for angular exceeded

Here's my versions
Node Version: 6.11.0
Protractor Version: 5.2.0
Angular Version: 1.4.4
Browser(s): chrome headless
Operating System and Version Windows 7

This is my protractor.conf.js

var SpecReporter = require('jasmine-spec-reporter').SpecReporter;
var Jasmine2HtmlReporter = require('protractor-jasmine2-html-reporter');

exports.config = {
  allScriptsTimeout: 11000,
  specs: [
    './e2e/**/*.e2e-spec.ts'
  ],
  capabilities: {
    'browserName': 'chrome',
    chromeOptions: {
      args: ["--headless", "--disable-gpu", "--window-size=800,600"]
    }
  },
  directConnect: true,
  baseUrl: 'https://localhost:4200/',
  framework: 'jasmine2',
  useAllAngular2AppRoots: true,
  jasmineNodeOpts: {
    showColors: true,
   defaultTimeoutInterval: 30000,
    print: function () { }
  },
  onPrepare() {
    require('ts-node').register({
      project: 'e2e/tsconfig.json'
    });
    jasmine.getEnv().addReporter(new SpecReporter({
      spec: { displayStacktrace: true }
    }));
    jasmine.getEnv().addReporter(new Jasmine2HtmlReporter({
      savePath: './protractor-results/e2e'
    }));
  }
};

score 2 · Accepted Answer · answered Apr 05 '18 at 09:25

You are probably running into the chrome sandbox security error. Add --no-sandbox as a Chrome option as below in your protractor config file and it will hopefully work. :-)

exports.config = {
  allScriptsTimeout: 11000,
  specs: ["./e2e/**/*.e2e-spec.ts"],
  capabilities: {
    browserName: "chrome",
    chromeOptions: {
      binary: process.env.CHROME_BIN,
      args: ['--no-sandbox']
    }
  },

score -1 · Answer 2 · answered Nov 17 '17 at 07:11

Did you check this Issue on Protractor here and this Chrome-Bug here?

Did you check, if there is angular present on the page?

See this answer to know, what to look after. Basically check, if your browser console returns anything on either window.angular.version (AngularJS) or window.getAllAngularRootElements (Angular).

If one of the two returns results, but your tests still don't work, I'd suggest to open an Issue on Protractor Github.

Protractor and headless chrome: Could not find Angular on page

2 Answers2