Protractor error Angular could not be found on the page

Question

I'm trying to set up End-2-End testing for my Angular (1.4) site using protractor (2.1.0). Jasmine is installed and unit tests are working fine. When I run protractor the index#/login page loads in a browser window but no code runs and protractor reports this error

Failed: Angular could not be found on the page http://localhost/SpectrumGMWeb/index.html#/login : retries looking for angular exceeded

My protractor config looks like this

exports.config = {
    allScriptsTimeout: 11000,
    seleniumAddress: 'http://127.0.0.1:4444/wd/hub',
    specs: [
        '*.js'
    ],
    rootElement:'html',
    capabilities: {
        'browserName': 'chrome'
    },
    baseUrl: 'http://localhost/SpectrumGMWeb/',
    framework: 'jasmine2',
    jasmineNodeOpts: {
        defaultTimeoutInterval: 30000
    },
};

My test file is very simple

describe('my app', function() {

    describe('login', function() {

        beforeEach(function() {
            browser.get('index.html#/login');
        });

        it('should render login page when user navigates to login page', function() {
            expect(true).toBe(true);
        });

    });
});

ng-app="main" is set on the html element of index.html. The website does work.

Any ideas?

Just for the sake of testing and debugging, move `ng-app` to `body` and comment out `rootElement` in the config. Same error? Thanks. — alecxe, Jul 31 '15 at 18:13
also tried... renaming root module, and manually bootstrapping angular — nuander, Jul 31 '15 at 21:53
Do you have the correct login page url in the get method `browser.get('index.html#/login')`? Does the number sign `#` belong there? If it does then you might have some redirection to an intermediate non-angular page going on. — finspin, Aug 01 '15 at 06:28
I tried browser.get('index.html') but same problem. I tried browser.driver.get but then the browser through an error "Cannot navigate to invalid URL" — nuander, Aug 03 '15 at 14:28
Your you are definitely on an angular page, your login form isn't from an external source or something? — Sirk, Aug 05 '15 at 14:04

score 10 · Answer 1 · answered Aug 02 '15 at 17:34

10

Try putting a browser.ignoreSynchronization = true; before you do a browser.get() in your login function.

answered Aug 02 '15 at 17:34

Rahul Vig

716
1
7
24

3

This will get rid of the error but isn't a solution to the problem as this setting will cause problems with tests later on. – Sirk Aug 03 '15 at 10:45
1

The setting can be enabled back after this particular function `browser.ignoreSynchronization = false`. Also, as long as login function is in a different library, ignoring synchronization will not affect the test later on. – Rahul Vig Aug 03 '15 at 12:06
That is true, and this would be a valid answer if the login page wasnt within the angular app, but in the example given the login page is an angular page so ignoreSync shouldn't be necessary there is probably a problem with the way angular is configured, this could potentially mask another problem. – Sirk Aug 04 '15 at 08:56
Yes. I agree it is not a direct answer, but it is the one that can solve the problem. I am sure there can be many plausible explanations as to why the page is behaving this way. I too had the same issue on the login page and this how i solved my problem without side effects on the rest of the test. – Rahul Vig Aug 04 '15 at 09:25
I have the same problem but i couldn't resolve it with your options, any other suggestions? – Emna Ayadi Apr 28 '16 at 13:57
If above option is not working you can try this one : https://stackoverflow.com/questions/31752301/protractor-error-angular-could-not-be-found-on-the-page/48542613#48542613 – Mukesh Rajput Jan 31 '18 at 12:50

score 8 · Answer 2 · answered Jan 31 '18 at 12:48

If you need to navigate to a page which does not use Angular then Add this line of code before browser.get() line there:

browser.waitForAngularEnabled(false);

Reference : https://github.com/angular/protractor/blob/master/docs/timeouts.md#waiting-for-angular-on-page-load

score 6 · Accepted Answer · answered Aug 07 '15 at 22:16

6

Well thanks everyone for your input. I did finally fix this problem by copying all the index.html file contents to a new file. It seems that somehow the file was corrupted in a way that protractor did not like. I know it sounds simple but I wasted 2 full days on this so hope it helps someone.

answered Aug 07 '15 at 22:16

nuander

1,319
1
19
33

4

This actually turned out to be a problem with the file encoding. The index page got Unicode encoded somehow but had the setting – nuander Nov 12 '15 at 23:58

score 1 · Answer 4 · answered May 13 '16 at 16:08

Are you sure you've launched your server at http://localhost/SpectrumGMWeb/?

Protractor is feeding this URL to Selenium and trying to access your application at this address. If it is not running at this address Protractor will get no response from it and will give you the error you are getting.

If you need advice on how to get a local server up and running to serve your project, I recommend grunt-connect, for example like this (which will launch a server at http://localhost:9001)

module.exports = function(grunt) {

    grunt.initConfig({
        connect: {
            server: {
                options: {
                    port: 9001,
                    base: '', // root folder of your app files
                     keepalive: true
                }
            }
        }
    });

    grunt.loadNpmTasks('grunt-contrib-connect');
    grunt.registerTask('default', ['connect:server'])
}

score 0 · Answer 5 · answered Jun 28 '17 at 18:29

I received this error as well, and I fixed it by changing my package.json "scripts" variable from:

"scripts": {
    ...
    "pree2e": "webdriver-manager update --standalone false --gecko false",
    "e2e": "protractor"
  }

to

"scripts": {
    ...
    // REMOVE "pree2e"
    "e2e": "ng e2e"
  }

Protractor error Angular could not be found on the page

5 Answers5

Linked