Could not find Angular on page with headless chrome

Bug report

• 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

• Protractor configuration file

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,
  seleniumAddress: 'http://localhost:4444/wd/hub',
  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'
    }));
  }
};

I can run my e2e test with chrome and it works just fine, but when I try to use headless chrome it can’t seem to find the page. I’ve tried using directConnect:true and also starting the selenium server with webdriver-manager first but both ways fail the same.

yarn run v1.3.2 $ protractor protractor.conf.js [10:51:34] I/launcher - Running 1 instances of WebDriver [10:51:34] I/hosted - Using the selenium server at http://localhost:4444/wd/hub Jasmine started [10:51:48] E/protractor - Could not find Angular on page https://localhost:4200/ : retries looking for angular exceeded

Here’s the browser capabilities: Capabilities { map_: Map { ‘applicationCacheEnabled’ => false, ‘rotatable’ => false, ‘mobileEmulationEnabled’ => false, ‘networkConnectionEnabled’ => false, ‘chrome’ => { chromedriverVersion: ‘2.33.506120 (e3e53437346286c0bc2d2dc9aa4915ba81d9023f)’, userDataDir: ‘C:\Users\MyUser\AppData\Local\Temp\scoped_dir1488_23350’ }, ‘takesHeapSnapshot’ => true, ‘pageLoadStrategy’ => ‘normal’, ‘databaseEnabled’ => false, ‘handlesAlerts’ => true, ‘hasTouchScreen’ => false, ‘version’ => ‘60.0.3112.113’, ‘platform’ => ‘Windows NT’, ‘browserConnectionEnabled’ => false, ‘nativeEvents’ => true, ‘acceptSslCerts’ => true, ‘locationContextEnabled’ => true, ‘webStorageEnabled’ => true, ‘browserName’ => ‘chrome’, ‘takesScreenshot’ => true, ‘javascriptEnabled’ => true, ‘cssSelectorsEnabled’ => true, ‘setWindowRect’ => true, ‘unexpectedAlertBehaviour’ => ‘’ } }

[willwsharp]

I think your problem might stem from a headless chrome/chrome-driver issue where headless chrome isn’t accepting the cert; by adding 'acceptInsecureCerts': true, to the capabilities object found in your protractor config file, it should be fixed. It worked for me.

Edit: You could also try passing the --allow-insecure-localhost arg via chromeOptions.args array.

[093shivani]

Hi! I’m still running into this issue. I tried adding ‘acceptInsecureCerts’: true, to the capabilities, object in protractor.config. It worked for the first time but then again this issue started coming up. I’m using chrome driver 79 and off course, my application is an angular application.