Keycloak-angular: Protractor test failed when I switch between 1.3.0 and 3.0.1

[jderuere]

Versions.

Works with 1.3.0 and fail with 3.0.1

Repro steps.

I have E2E Protractor tests that connect through Keycloak and then test our features. It works well for weeks.
When I switch to keycloak-angular 3.0.1, the connection through keycloak still work but when it comes to test our features I got this error :

Failed: Timed out waiting for asynchronous Angular tasks to finish after 11 seconds. This may be because the current page is not an Angular application. Please see the FAQ for more details: https://github.com/angular/protractor/blob/master/docs/timeouts.md#waiting-for-angular
While waiting for element with locator - Locator:

When I switch back to 1.3.0 it works as usual.

Also, switching to 3.0.1 didn't cause any problem in our application, everything works fine, only our Protractor tests are all broken.

[jderuere]

I succeeded to make it works by running keycloak.init outside of angular zone:

```
async isLoggedIn(realm): Promise {
const loggedIn = await this.keycloak.isLoggedIn();
if (loggedIn) {
return Promise.resolve(loggedIn);
} else {
return new Promise((resolve, reject) => {
this.ngZone.runOutsideAngular(() => {
resolve(this.keycloak.init({
config: {
url: environment.authentication, // .ie: http://localhost:8080/auth/
realm, // .ie: master
clientId: 'app-ui' // .ie: account
},
initOptions: {
onLoad: 'login-required',
checkLoginIframe: false
},
bearerExcludedUrls: [
'/assets',
'/clients/public'
]
}));
});
});
}
}
````

As you can see, my need is a little different since I need to be multi-tenant, so the initialization is not done at the App init but later.

I'm interesting in understanding what change was introduce in 3.0.1 that made me do that.
Thanks

[mauriciovigolo]

Hi @jderuere, sad to hear you are having problems in your tests, let's solve it!

So, the main change in version 3.0.0 and above is that this is a new project generated by the angular cli v6. In this version, the angular cli introduced a new schematic that incorporates the nice ng-packgr library. So now, we do have a more standardized way to create a library for angular applications.

What version of angular are you using in your app? Version 3.x.x of keycloak-angular is compatible with angular 6 and keycloak 3. For more information about the correct version to use you may take a look on choosing the appropriate version of keycloak angular.

Besides this, there were improvements and bugfixes in the HttpBearerInterceptor and the KeycloakService.

Did you try to run your tests on v1.4.0? This version includes all bug fixes and enhancements from the newer versions, but its compatible with angular 4 and 5 and keycloak 3.x.

[jderuere]

Hi @mauriciovigolo, I upgraded to version 3.0.1 because I also upgraded Angular to version 6.x.x.
I managed to make my Protractor tests working by running Keycloak.init() function out of Angular zone. It means that there is something in this function that makes Protractor think that the application is not loaded.
(see: https://christianliebel.com/2016/11/angular-2-protractor-timeout-heres-fix/)

It doesn't mean it's a bug, but it's just something to keep in mind for keycloak-angular users :)

[mauriciovigolo]

@jderuere, great to know it! Also, thanks for sharing and for contributing to the project!