CODEWITHSUNDEEP
angularprotractorcucumbere2e-testingangular-e2e
mc.suchecki
mc.suchecki

Reputation: 1898

Protractor can't detect Angular 5 on deployed application

I am trying to create a repository with E2E tests for my web application using Protractor and Cucumber. I have started with this repository: https://github.com/spektrakel-blog/angular-protractor-cucumber

When I am forcing Protractor to treat the application as a regular webpage, the tests run fine. Test runner is interacting with the application and expecting some outcome. The thing is, that I would like to make Protractor detect Angular in order to wait for zones to be stable before checking 'Then' asserts.

Here is my protractor.conf.js:

exports.config = {
  allScriptsTimeout: 30000,
  capabilities: {
    browserName: 'chrome',
    chromeOptions: {
      args: ['--no-sandbox']
    }
  },
  directConnect: true,
  baseUrl: 'http://<ci-server-address>/',

  specs: [
    './e2e/features/*.feature'
  ],

  framework: 'custom',
  frameworkPath: require.resolve('protractor-cucumber-framework'),

  cucumberOpts: {
    require: ['./e2e/steps/**/*.ts'],
    strict: true,
    format: [
      'json:reports/summary.json'
    ],
    dryRun: false,
    compiler: []
  },

  onPrepare() {
    browser.ignoreSynchronization = true;
    require('ts-node').register({
      project: 'e2e/tsconfig.e2e.json'
    });
  }
};

In short - the tests run with the following config, but when I remove browser.ignoreSynchronization = true;, I get the following error: Timed out waiting for asynchronous Angular tasks to finish after 30 seconds. This may be because the current page is not an Angular application..

Things I have tried so far (with no improvement):

I am using the latest versions of Protractor, Cucumber, Chai and TypeScript. Any help would be much appreciated. Thank you very much in advance!

Upvotes: 8

Views: 1365

Answers (5)

konda lakshmi
konda lakshmi

Reputation: 1

protractor/globals have been removed from v4.0.9 , now we can simply import protractor helpers directly from protractor namespace which is much cleaner.

Example:

import {browser} from 'protractor';

Upvotes: 0

kemsky
kemsky

Reputation: 15271

Verify that your app actually gets stable:

  constructor(zone:NgZone)
  {
    zone.onStable.subscribe(()=> window.console.info('onStable'));
    zone.onUnstable.subscribe(()=> window.console.info('onUnstable'));
    zone.onMicrotaskEmpty.subscribe(()=> window.console.info('onMicrotaskEmpty'));
  }

Upvotes: 1

Madhan Raj
Madhan Raj

Reputation: 1442

Try below options

// CSS Selector for the element housing the angular app - this defaults to
// body, but is necessary if ng-app is on a descendant of <body>.
rootElement: 'body',

// The timeout in milliseconds for each script run on the browser. This should
// be longer than the maximum time your application needs to stabilize between
// tasks.
allScriptsTimeout: 3600 * 1000,

// How long to wait for a page to load.
getPageTimeout: 3600 * 1000,

and if your angular page take more time to load the page try to disable the animations with below code

    var disableNgAnimate = function () {
        angular.module('disableNgAnimate', []).run(['$animate', function ($animate) {
            $animate.enabled(false);
        }]);
    };
    browser.addMockModule('disableNgAnimate', disableNgAnimate);

Hope the above solutions helps you. browser.ignoreSynchronization = true; is deprecated try using browser.waitForAngularEnabled(true); refer here for more inputs

Upvotes: 0

Narm
Narm

Reputation: 10844

This sounds like a potential Zone issue to me. Angular depends on ZoneJS (ngZone). It is not that uncommon to run into this error when using any asynchronous javaScript functions such as setTimeout(), setInterval(), etc...

The reason being is that ZoneJS monkey patches those functions and it does so out of the context of the Angular zone. At which point when Protractor is trying to connect to your application it no longer is running in the Angular Zone and therefor Protractor will hang and eventually timeout with the error you're getting.

If I were you I would take a look at your application for any asynchronous functions that ZoneJS monkey patches. Also in general, look for anything in your code that is running outside the context of your applications zone.

Here is a good article on ZoneJS that not only helps you understand ZoneJS, but also lists the functions that are monkey patched Understanding ZoneJS

Upvotes: 6

yong
yong

Reputation: 13712

trying remove baseUrl: 'http://<ci-server-address>/', in protractor conf.js

Upvotes: -1

Related Questions