Protractor: Cannot read property '$$testability' of undefined

Created on 17 Apr 2017 · 42Comments · Source: angular/protractor

In Protractor 5.1.1 if your Angular app has a root element other than <body>, you'll see the error Cannot read property '$$testability' of undefined. This is because browser.angularAppRoot() is expected to return the current value of app root if a value isn't passed to it, but currently returns undefined.

bug

Source

heathkit

👍2

Most helpful comment

Hi Contributors,

Any updates around this issue . Using protractor version 5.1.2 doesn't resolve this issue.
I have test cases suite that run one after the other and it's quite sporadic... sometimes it works and sometimes they fail because of this issue. So, if you try to run say ~ 30 cases together , you will still get this issue using 5.1.2.

Thank you for your help.

tarunkumbnani on 14 Jun 2017

👍14

All 42 comments

Do we have an ETA on when this will be pushed into the npm package for an easy npm update?

SrWildman on 27 Apr 2017

ooohhhhh....that's why I can't create an issue using the protractor test app (v1 angular)! Because the test app has the ng-app attribute on the html element.

http://www.protractortest.org/testapp/ng1/#/form

I'd think you could add some regression tests in the protractor suite against protractortest.org website, to help avoid issues like these in the future. Good luck!

+1 on getting a 5.1.2 release (so that we can create more issues for you to review! Thanks Protractor team, you're doing a great job!!!!)

keithrz on 28 Apr 2017

Is there any update on implementing this into the next version? Or at least a fix we can make on our end while we wait for it to be pushed?

SrWildman on 8 May 2017

We're planning to do a 5.1.2 tomorrow that should include this fix.

heathkit on 8 May 2017

🎉3

@heathkit Thank you very much!!

SrWildman on 8 May 2017

When is the release of 5.1.2 and why is this issue closed. I keep getting this error all the time.. :(
Can the contributor kindly look into this?

avinashs15 on 15 May 2017

@avinashs15 You can build from source by following these directions. After you run npm install you'll have a binary at bin/protractor that will work with non-body-tag-based AngularJS apps.

benharold on 15 May 2017

👍2

If anyone is still seeing this issue in 5.1.2, could you please reopen with an example that reproduces the problem? Thanks.

heathkit on 3 Jun 2017

👍2

Hi Contributors,

Thank you for your help.

tarunkumbnani on 14 Jun 2017

👍14

Using Protractor 5.1.2 we also have 'Error while waiting for protractor to sync with the page: "Cannot read property $$testability of undefined."'
(We are using ng-upgrade and all our AngularJS tests are now timing out because the inherent wait for Angular seems to be broken.)

Red-3 on 19 Jun 2017

For those of you still seeing this problem, please post your Protractor config. I'm specifically interested in whether you set rootElement. A github repo or plunkr that demonstrates the problem would be very helpful.

heathkit on 19 Jun 2017

Protractor config, as requested:

exports.config = {
    seleniumAddress: 'http://localhost:4444/wd/hub',
    getPageTimeout: 200000,
    allScriptsTimeout: 200000,
    //ng12Hybrid: true,
    rootElement: 'body',
    params: {
        login: {
            url:  'https://localhost:8443/docp/public/LoginContainer.jsp'
        }
    },
    specs: [
       'approveSpec.js'
    ],
    onPrepare: function () {
    },

    multiCapabilities: [
        {
              browserName: 'chrome'
        }
    ]
};

Bootstrapping using upgrade module like this:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { UpgradeModule } from '@angular/upgrade/static';

import { AppModule } from './app.module';

angular.element(document).ready(() => {
    platformBrowserDynamic().bootstrapModule(AppModule).then(platformRef => {
        console.log('Bootstrapping hybrid app with Upgrade Module');
        const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule;

        upgrade.bootstrap(document.body, ['receipt']);
   });
});

Red-3 on 21 Jun 2017

Hi Contributors,
Posting protractor.config file as requested. Just to mention the root element is body so that is not specified in the protractor conf file explicitly.

const port = process.env.SUB_APP_PORT ? ':' + process.env.SUB_APP_PORT : '';
const baseUrl = `${process.env.SUB_APP_BASE_URL}${port}${process.env.SUB_APP_PATH_PREFIX}/`;

 exports.config = {
   allScriptsTimeout: 11000,
   suites: {
    smoke: ['./e2e/uiSpecs/subscriber-login-spec.ts']
  },
   specs: ['./e2e/uiSpecs/*-spec.ts'],
   capabilities: {
    'browserName': 'chrome',
    'acceptSslCerts': true,
    'chromeOptions': {
      'args': ['no-sandbox']
     }
   },
  directConnect: true,
  baseUrl: baseUrl,
  framework: 'jasmine',
   jasmineNodeOpts: {
    showColors: true,
    defaultTimeoutInterval: 30000,
    print: function() {}
   },
  };

Thanks for your help.

tarunkumbnani on 21 Jun 2017

Using Protractor 5.1.2 i have 'Error while waiting for protractor to sync with the page: "Cannot read property $$testability of undefined."'

chiavegatto on 28 Jun 2017

Also facing the same issue.

justtal on 29 Jun 2017

Those who have responded since this issue has been resolved have either:

Had your rootElement defined as body, in which case you have a different problem.
Had your rootElement undefined, meaning it is defaulting to body, in which case you have a different problem.
Have not provided a config.

This issue was specifically related to $$testability being undefined when the rootElement is not the <body> tag, which has been fixed. It is likely you have a different configuration issue.

benharold on 30 Jun 2017

👍1

Hi @benharold

Thank you for your response.
Is there any separate thread that is tracking this issue when root element defaults to body ?
I have posted my protractor.config file in the thread above. There isn't anything fancy field in the config file which could make me believe that i have a configuration issue.

Any thoughts ?Thanks again.

tarunkumbnani on 3 Jul 2017

@tarunkumbnani It looks like this pull request may be related to the issue.

benharold on 6 Jul 2017

Hi @benharold I'm still experiencing this problem while using [email protected].

I have explicitly set the root element in the config and still get the problem. My config is below:

"use strict";
exports.config = {
    allScriptsTimeout: 200000,
    directConnect: true,
    specs: [
        "../flights/**/*.js"
    ],
    rootElement: ".ng-app",

    multiCapabilities: [
        {
            "browserName": "chrome",
            "shardTestFiles": true,
            "maxInstances": 4,
            "commandTimeout": 600,
            "idleTimeout": 500,
            "getPageTimeout": 20000
        }
    ],
    jasmineNodeOpts: {
        defaultTimeoutInterval: 200000,
        print: function() {
        } 
    },
    framework: "jasmine2",
    onPrepare: function() {
        var SpecReporter = require("jasmine-spec-reporter");

        var reporterOptions = {
            displayStacktrace: true, // display stacktrace for each failed assertion
            displayFailuresSummary: true, // display summary of all failures after execution
            displaySuccessfulSpec: true, // display each successful spec
            displayFailedSpec: true, // display each failed spec
            displayPendingSpec: false, // display each pending spec
            displaySpecDuration: false, // display each spec duration
            displaySuiteNumber: false, // display each suite number (hierarchical)
            colors: {
                success: "green",
                failure: "red",
                pending: "cyan"
            },
            prefixes: {
                success: "✓ ",
                failure: "✗ ",
                pending: "- "
            },
            customProcessors: []
        };

        jasmine.getEnv().addReporter(new SpecReporter(reporterOptions));
    }
};

In my suite of 62 tests some pass and some fail. It appears to be random which ones pass and which fail. The error messages are:
Failed: Error while waiting for Protractor to sync with the page: "Cannot read property '$$testability' of undefined"

Any advice?

divercraig on 1 Aug 2017

@divercraig I'm guessing that .ng-app is not a valid root element. You likely need something along the lines of div[ng-app]. It needs to be a CSS selector that exactly matches only the root element of your app.

benharold on 1 Aug 2017

Hi - Is this still an issue for some people?

If you are having issues with Protractor and your hybrid app, can you post the following from Chrome devtools console for your app?

1) window.getAllAngularTestabilities
2) window.getAngularTestability
3) window.angular.version

vikerman on 3 Aug 2017

👍1

window.getAllAngularTestabilities
undefined
window.getAngularTestability
undefined
window.angular.version
{full: "1.5.9", major: 1, minor: 5, dot: 9, codeName: "timeturning-lockdown"}

divercraig on 9 Aug 2017

Running protractor 5.1.2. I am getting error
Error while waiting for Protractor to sync with the page: "Cannot read property '$$testability' of undefined"

// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/lib/config.ts

const { SpecReporter } = require('jasmine-spec-reporter');
var TfsReporter = require('jasmine-tfs-reporter');

exports.config = {
    jvmArgs: ["-Dwebdriver.ie.driver=" + __dirname + "\\node_modules\\protractor\\node_modules\\webdriver-manager\\selenium\\IEDriverServer3.4.0.exe"],
    allScriptsTimeout: 300000,
    getPageTimeout: 300000,
    specs: [
        './e2e/**/*.e2e-spec.ts'
    ],
    multiCapabilities: [
        {
             'browserName': 'chrome'
        },
        {
            'browserName': 'internet explorer',
            'version': 11,
            'nativeEvents': true,
            'unexpectedAlertBehaviour': 'accept',
            'enablePersistentHover': false,
            'disable-popup-blocking': true,
            'ignoreZoomSetting': true
        }
    ],
    directConnect: false,
    baseUrl: process.env.BASE_URL,
    framework: 'jasmine',
    jasmineNodeOpts: {
        defaultTimeoutInterval: 300000,
        includeStackTrace: true
    },
    beforeLaunch: function () {

    },
    onPrepare() {
        jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
        browser.ignoreSynchronization = false;
        jasmine.getEnv().addReporter(new TfsReporter());
        require('ts-node').register({
            project: 'e2e/tsconfig.e2e.json'
        });
    },
    useAllAngular2AppRoots: true
};

@divercraig did you resolve the issue?

webdeveloperninja on 9 Aug 2017

@webdeveloperninja no I haven't resolved this problem. I'm only seeing it intermittently on my tests which is very annoying

divercraig on 9 Aug 2017

ha get that. @vikerman I am still struggling with this. bellow are those 3 commands outputs

window.getAllAngularTestabilities()
[t]0: t_callbacks: Array(0)_didWork: false_isZoneStable: true_ngZone: t_pendingCount: 0__proto__: Objectlength: 1__proto__: Array(0)

window.getAngularTestability()
vendor.2553bff….bundle.js:1 Uncaught Error: Could not find testability for element.
    at j.ɵglobal.getAngularTestability (vendor.2553bff….bundle.js:1)
    at <anonymous>:1:8

angular version 4.3.3

webdeveloperninja on 9 Aug 2017

@webdeveloperninja

Can you provide us with an example project in which you also have the scripts to reproduce this issue? I'm working with Protractor 5.1.2 and Angular 4.x and don't have any problems

wswebcreation on 10 Aug 2017

Hi there,
I'm also seeing similar issue with in my tests: Error while waiting for Protractor to sync with the page: "Cannot read property '$$testability' of undefined"

protractor version: 5.1.2

Config file:

exports.config = {
  seleniumServerJar: 'seleniumServer/selenium-server-standalone-3.5.0.jar',
  getPageTimeout: 15000,
  allScriptsTimeout: 50000,
  defaultTimeoutInterval: 15000,
  includeStackTrace: true,
  rootElement: 'body',
  framework: 'custom',
  frameworkPath: require.resolve('protractor-cucumber-framework'),
  specs: [
    'Tests/Features/*.feature'
  ],
  cucumberOpts: {
    require: [
      'Tests/Steps/*.js' // accepts a glob
    ],
    format: ['json:reports/results.json', 'pretty'],
    profile: false,
    'no-source': true
  },
  capabilities: {
    'browserName': 'Chrome'/*,
    chromeOptions: {
      args: ["--headless", "--disable-gpu", "--window-size=800x600"]
    }*/
  },
  params:{
    environment: 'test',
    environments:{
      dev:{
        mainPage: 'http://google.com',
        dashboardPage: 'https://angular.io/'
      },
      test:{
        mainPage: 'http://google.com',
        myITpage: 'https://angularjs.org/',
        dashboardPage: 'https://angular.io/'
      },
      prod:{
        mainPage: 'http://google.com',
        myITpage: 'https://angularjs.org/',
        dashboardPage: 'https://angular.io/'
      }
    }
  }
};

window.getAllAngularTestabilities
undefined
window.getAngularTestability
undefined
window.angular.version
{full: "1.6.4", major: 1, minor: 6, dot: 4, codeName: "phenomenal-footnote"}

Is there anything else I need to provide?

PE-test on 23 Aug 2017

@PE-test

You are using rootElement: 'body' in your config. I thought that wasn't needed when you use AngularJS. Can you please remove it and check again?

wswebcreation on 23 Aug 2017

@wswebcreation, I'm getting the same error with removed rootElement: 'body'.

PE-test on 24 Aug 2017

@PE-test
Can you past a demo project with your config and specs? The pages you mention in your config are no-angular, angularJS and angular. Which one is failing?

wswebcreation on 24 Aug 2017

@wswebcreation, it is failing on https://angularjs.org/, when trying to get the page for the second time.
You can find project here.

PE-test on 24 Aug 2017

@PE-test

Tnx, Will check it later today. What's the command you use to run Protractor in this project

wswebcreation on 24 Aug 2017

@wswebcreation
protractor conf.js
Plus you may need to add selenium server standalone (please check conf.js).

PE-test on 24 Aug 2017

@PE-test

Got half of it working on my machine (Mac OSX 10.12.6) but my internet connection is not that good (not at home). Will take look at it again next week when I'm home. The first tests, on the angularJS site works.

Only difference what I can see now (not that it is the core of the problem) is that I have Protractor as a project dependency and based on your provided project it is a global dependency.

wswebcreation on 24 Aug 2017

@PE-test

There are a few errors in your script. You log and return promises before they are resolved, and there are some undefined errors in your script.

Example:
In your angularJS.js-PO, this breaks, see the comments

  getPlaceholderText: function(){
    var angular = this.angularHomepage;
    var placeholderText;
    // angular.inputField => is undefined
    angular.inputField.getAttribute('placeholder').then(function (placeholder){
      placeholderText = placeholder;
    });
    console.log("Debug: "+placeholderText);
    // Already returned before the Promise is resolved
    return placeholderText;
  }

I get the error you have with Error while waiting for Protractor to sync with the page: "Cannot read property '$$testability' of undefined", but when I run the tests 1 by one there is not issue.
My guess is that your script is causing the errors, and would advice you to recheck and fix all the errors in your script. Start at the beginning and first place all the code you have in in your steps files and remove the usage of the PO's, because there the most errors are.
I don't have enough time to debug the complete script but I hope it helps you

wswebcreation on 27 Aug 2017

Hi, having the same problem with version 5.1.2. My config:

exports.config = {
  specs: [
    './scenarios/**/*'
  ],
  capabilities: {
    'browserName': 'chrome'
  },
  baseUrl: 'http://127.0.0.1:8080',
  framework: 'jasmine',
  directConnect: true
};

I found that changing specs to single files instead of a glob, the error goes away:

  specs: [
    './scenarios/spec1.js',
    './scenarios/spec2.js'
  ],

Hope this helps!

peterpoe on 4 Sep 2017

I had to add the following code to get rid of

Error: Error while waiting for Protractor to sync with the page: "window.angular is undefined.

browser.ignoreSynchronization = true;
browser.waitForAngular();
browser.sleep(500);
browser.ignoreSynchronization = false;

then had to increase browser.sleep

browser.sleep(5000);

in order to fix

"Cannot read property '$$testability' of undefined"

So it seems like Angular isn't initialised properly yet

victor-geere on 6 Sep 2017

👎1 👍1

Facing the issue with version 5.1.2

Here is my config File:

exports.config = {
framework: 'jasmine',
rootElement: 'body',

seleniumAddress: 'http://localhost:4444/wd/hub',

specs: ['test_protractor3.js'],
jasmineNodeOpts: {
defaultTimeoutInterval: 500000
}
};

CrReddy846 on 20 Sep 2017

Hi All,
Am using protractor 5.1.2 version, bit still getting the error * Failed: Error while waiting for Protractor to sync with the page: "Cannot read property '$$testability' of undefined"*. Could any one please let me know how to reslve. My Config is very simple and basic .

gourishankarmuvvala on 30 Nov 2017

Hey, how to solve this problem?
Thx!

uLucasFraga on 16 Jul 2018

We are experiencing similar kind of problems that we think they are related with testability api.

In previous version of our app, for the elements in pages it is like;
_window.getAngularTestability(document.querySelector('#name')).isStable();
true_

But after latest versions we are getting a "false" for the method above and protractor somehow lose the interactions with objects.

We can operate on pages via using _"browser.ignoreSynchronization = true;"_ on those pages. But we dont want to use this because of it is aganist control flow and async approach. So we try to figure out which changes one test enviroment result to this.

If you have any idea i glad to hear. Thanks in advance.

ahmetya on 24 Sep 2018

some times i am facing error of 'cannot read property click of undefined' while executing protractor scripts .can someone please guide that what is the cause of this error?