Angular-auth-oidc-client: OidcConfigService -> ConfigValidationService

[cvbc2010]

Prod build failing with version 11.2.0

export function configureAuth(oidcConfigService: OidcConfigService, httpClient: HttpClient) {
  const setupAction$ = httpClient.get<any>(`${window.location.origin}/api/ClientAppSettings`).pipe(
    map((customConfig) => {
      return {
        stsServer: customConfig.stsServer,
        authWellknownEndpoint: 'https://login.microsoftonline.com/common/v2.0',
        redirectUrl: customConfig.redirect_url,
        clientId: customConfig.client_id,
        scope: customConfig.scope,
        responseType: customConfig.response_type,
        silentRenew: true,
        maxIdTokenIatOffsetAllowedInSeconds: 600,
        issValidationOff: true,
        autoUserinfo: false,
        silentRenewUrl: window.location.origin + '/silent-renew.html',
        // autoUserinfo: false,
      };
    }),
    switchMap((config) => oidcConfigService.withConfig(config))
  );

  return () => setupAction$.toPromise();
}

@NgModule({
    declarations: [
        AppComponent,
        HomeComponent,
        AutoLoginComponent,
        ForbiddenComponent,
        ProtectedComponent,
        UnauthorizedComponent,
    ],
    imports: [
        BrowserModule,
        BrowserAnimationsModule,
        MaterialModule,
        AppRoutingModule,
        HttpClientModule,
        AuthModule.forRoot(),
        FlexLayoutModule,
        AppStoreModule,

    ],
    providers: [
      OidcConfigService,
        {
            provide: APP_INITIALIZER,
            useFactory: configureAuth,
            deps: [OidcConfigService, HttpClient],
            multi: true,
        },
        AuthorizationGuard,
        { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true },
    ],

    bootstrap: [AppComponent],
    entryComponents: [ LogoutComponent],
})
export class AppModule {}

Error: StaticInjectorError(AppModule)[OidcConfigService -> ConfigValidationService]: 
  StaticInjectorError(Platform: core)[OidcConfigService -> ConfigValidationService]: 
    NullInjectorError: No provider for ConfigValidationService!

[damienbod]

Thanks for reporting!

Greetings Damien

[damienbod]

closing this now

moved the problem to a branch were we can fix this. Thanks for reporting

[JoanGil]

Hey @damienbod! I am experiencing the same exact error. Did you have time to take a look at it? If so, at what brach are you solving the issue? Thanks in advance!

[polo070770]

@cvbc2010, We have the same problem! Did you find any workaround? Do we have to wait for a fix from @damienbod?
Thanks!

[damienbod]

Hi @polo070770 @JoanGil This is not in the master anymore. The bug has been removed to a branch which still fails. The master branch no longer has this problem.

Greetings Damien

[laroblesaguilar]

@damienbod what version of npm package has this bug been removed? I have tried 11.2.0, and 11.1.4 and still running into same error.

[damienbod]

I will try to reproduce using this example

https://github.com/damienbod/angular-auth-oidc-client/blob/master/projects/sample-code-flow-http-config/src/app/app.module.ts

[JoanGil]

@damienbod what version of npm package has this bug been removed? I have tried 11.2.0, and 11.1.4 and still running into same error.

Me too.

[damienbod]

we seem to have 2 issues here in this issue. The production build failed due to a PR which was merged. This is fixed and no npm was ever released with the bug.

The other issue is from the last release which was 2 months ago.

[FabianGosebrink]

Hey, thanks for reporting the issue. I tried to reproduce with no success. Can you please tell us what you did to reproduce the issue? Help us to help you a bit :)

What I did was:

1) Creating a new project with Angular 9 ng new testApp
2) ng build --prod which worked fine
3) installed the package with npm install angular-auth-oidc-client
4) ng build --prod which worked fine
5) copied the code in the issue into the app.module.ts
6) ng build --prod which worked fine

7) Creating a new project with Angular 10 ng new testAppAngular10
8) ng build --prod which worked fine
9) installed the package with npm install angular-auth-oidc-client
10) ng build --prod which worked fine
11) copied the code in the issue into the app.module.ts
12) ng build --prod which worked fine

Find my code with the different angular versions here https://github.com/FabianGosebrink/angular-auth-oidc-client-858-repro

Please check out the repo _without modifications_ and let run the ng build --prod to see if it works on your machine and _then_ do a PR with your changes to reproduce the issue.

[cvbc2010]

@cvbc2010, We have the same problem! Did you find any workaround? Do we have to wait for a fix from @damienbod?
Thanks!

as temporary fix i just disabled "buildOptimizer" in angular.json for prod build configuration. it was working from then.

[FabianGosebrink]

Hey @cvbc2010 , please check the sample repo. The buildOptimizer is set to true both times. I doubt that this is the issue.

[laroblesaguilar]

@cvbc2010, We have the same problem! Did you find any workaround? Do we have to wait for a fix from @damienbod?
Thanks!

as temporary fix i just disabled "buildOptimizer" in angular.json for prod build configuration. it was working from then.

This is what worked for me as well. Thank you for posting your fix.

[FabianGosebrink]

Closing this as it works on the repo I provided. If anybody wants to add a repro for the bug in the given repo I would be glad to fix this. Would be really interested in where the problem really is. Thanks everybody.

[dbk-fkoller]

A piece of relevant information could be:
The production build does not fail actually. When you run the production build (build with "buildOptimizer" set to true) you get the aforementioned error when you access the application.

[FabianGosebrink]

Hey @dbk-fkoller , thanks for your answer but I doubt that. My example repo given above has set the buildOptimizer to true and builds in production just fine.
Thanks.

[dbk-fkoller]

Building works! Running does not ;-)

[FabianGosebrink]

Ahhhhhh, thanks!!!! So this is how I can reproduce! Thanks facepalm. Thanks for the hint!! When I can reproduce I can (hopefully) fix it :)

[dbk-fkoller]

Thanks for your responses - glad I could help a little.
I will stick to the workaround mentioned before for now. Best Regards!

[FabianGosebrink]

You could totally. I will reproduce and hopefully see the error then. Until then please stick with the workaround.

[FabianGosebrink]

Sorry, guys, but I can not reproduce the issue. What I did was:

1. Taking this repo https://github.com/FabianGosebrink/angular-auth-oidc-client-858-repro --> testApp
2. npm install angular-auth-oidc-client
3. npm start -- --prod --> works
4. npm run build -- --prod --> works
5. Entering the dist folder, serving the distribution,
6. entering it on the browser --> works

No error in console.

I really need your help to reproduce the issue. I am asking again: Can you please please provide a minimal sample repository that we can fix this? You can fork and my repro repo add a PR if you want.

The first comment here says, that the error is on build.

Prod build failing with version 11.2.0

Then we saw that the error is on executing?

you get the aforementioned error when you access the application.

What is access the application? Access on ng serve? Access on ng serve --prod? Access on the built one in a browser with an html server?

Please help us to help you.

Thanks

[dbk-fkoller]

Hey,
sorry for getting back so late - I had a busy week :-)

I can confirm your test repository not producing the mentioned issue. I will try to setup a minimal demo project reproducing the issue.

My guess right now: Versioning
We were working on a prototype project (garbage bin here we come). Due to time frame we did not upgrade the project to Angular 9/10 and are stuck on Angular 8.3 and Typescript 3.5.3.

If this really is the case you can probably ignore this issue.
An upgrade to the current version of Angular and Typescript is necessary anyway and the sensible way to fix this. A workaround, albeit an awkward one, is already documented (set "buildOptimizer": false).

I will check if my guess is correct and prepare something. Could be 1-2 weeks, some days off work incoming :-)

Thanks alot for your effort and patience in trying to help us! :rocket:

[FabianGosebrink]

Hey @dbk-fkoller , thanks for the answer and the feedback. Sure, just let us know here if you find something new :) Appreciate your help! let me know if I can help you. Cheers and take care.

[dbk-fkoller]

Hey,
you can find a reproduction repository at https://github.com/dbk-fkoller/angular-auth-oidc-client-858-repro

reproduce issue

1. git clone repository https://github.com/dbk-fkoller/angular-auth-oidc-client-858-repro
2. npm install
3. add valid stsServer and oidcClientId keys in environment.ts and environment.prod.ts
4. ng serve --configuration=production --> http://localhost:4200/ not working and results in the following error when accessing

Uncaught NullInjectorError: StaticInjectorError(AppModule)[OidcConfigService -> ConfigValidationService]: StaticInjectorError(Platform: core)[OidcConfigService -> ConfigValidationService]: NullInjectorError: No provider for ConfigValidationService!

1. ng serve --> http://localhost:4200/ does work, since it uses a different configuration
2. set "buildOptimizer": false in "configurations":"production" key in angular.json
3. ng serve --configuration=production --> http://localhost:4200/ does work

resolve issue via an update to at least Angular 9.1.12 && Typescript 3.8.3

1. ng update @angular/core@9 @angular/cli@9
2. set "buildOptmizer": true again in angular.json
3. ng serve --configuration=production does work now when accessing http://localhost:4200/

Since this seems to be a versioning issue I feel stupid for refiring this. My apologies.

Best Regards and keep up the good work!