[Bug]: Library not compiling v14.1.3, map not found on rxjs

[fdellasoppa]

What Version of the library are you using?
14.1.3

Describe the bug
A clear and concise description of what the bug is.
My project won't compile as the library angular-auth-oidc-client is throwing an error:

./node_modules/angular-auth-oidc-client/fesm2020/angular-auth-oidc-client.mjs:5286:36-41 -
Error: export 'map' (imported as 'map$1') was not found in 'rxjs' (possible exports: ArgumentOutOfRangeError, AsyncSubject, BehaviorSubject, ConnectableObservable, EMPTY, EmptyError, GroupedObservable, NEVER, Notification, NotificationKind, ObjectUnsubscribedError, Observable, ReplaySubject, Scheduler, Subject, Subscriber, Subscription, TimeoutError, UnsubscriptionError, VirtualAction, VirtualTimeScheduler, animationFrame, animationFrameScheduler, asap, asapScheduler, async, asyncScheduler, bindCallback, bindNodeCallback, combineLatest, concat, config, defer, empty, forkJoin, from, fromEvent, fromEventPattern, generate, identity, iif, interval, isObservable, merge, never, noop, observable, of, onErrorResumeNext, pairs, partition, pipe, queue, queueScheduler, race, range, scheduled, throwError, timer, us...

To Reproduce
Steps to reproduce the behavior:

1. Add "angular-auth-oidc-client": "14.1.3" to your packages.json in the dependencies section or install the package with npm install.
2. You might need to configure and use the package
3. Build your project: ng build
4. You will receive the error

Expected behavior
A clear and concise description of what you expected to happen.
Project compiles and runs.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: Windows 10
• Browser: N/A, but Chrome
• Version 103.0.5060.134

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

[fdellasoppa]

I reverted to version 14.1.2 and everything started to work again.

[timdeschryver]

Hi, if it's OK I can add an extra step in the CI to verify that this library works with RxJS v6 (and fix the "bad" imports)

[fdellasoppa]

Hi, ok, I'm receiving this error using rxjs 6.6.7.

[damienbod]

We use 7.4.0, can you update the rxjs?

@timdeschryver @FabianGosebrink

Do you think we need to support V6 versions?

Greetings Damien

[timdeschryver]

I could be wrong here, but I think the (only?) breaking change that affects us is how the operators are imported. RxJs 7 exports their operators from rxjs/operators but also from rxjs, while RxJS 6 only exports it from rxjs/operators. For example, #1491 fixes the imports from rxjs to rxjs/imports, but in recent commits we made the same "mistake" (probably because the IDE auto imports it from rxjs).

If it's only that, I think we should try to keep supporting v6.
Reason is that Angular also supports v6, and a lot of projects (from what I've seen) haven't made the upgrade to v7.

Instead of introducing an extra build step, we could also add some ESLint rule (if it exists), or create or own script to fix these imports.

[FabianGosebrink]

Hey Tim, thanks for this. It might be that my IDE fixes that imports and so V6 is not supported anymore! That's me to blame in this case. I just checked if there is an ESLint rule, but did not find a one that fits. We had a build step which installs everything like normal but uses RxJs 6 in addition and installs the library then. I will add that build step and fix the imports now.

      - name: Create new Angular Project (RxJs 6) and use the schematics to add a module
        run: |
          cd ..
          echo '=== Current Directory ==='
          ls
          sudo npm install -g @angular/cli
          echo 'Creating new angular project'
          sudo ng new testProjectSchematicRxJs6 --skip-git --skip-install
          cd testProjectSchematicRxJs6
          echo '=== Current Directory ==='
          ls
          sudo npm install --unsafe-perm=true
          sudo npm install [email protected]
          sudo ng add ../angular-auth-oidc-client/dist/angular-auth-oidc-client --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using iframe silent renew" --use-local-package=true --skip-confirmation
          npm test -- --watch=false --browsers=ChromeHeadless
          sudo npm run build

I will add this build rule again and fix the bad imports. But it would be nice, like @timdeschryver said, to have a lint rule for this.

[FabianGosebrink]

I can not reproduce the error locally and the build step also run through fine.

[FabianGosebrink]

Hey @fdellasoppa, can you provide a sample repo to reproduce the issue? Thanks!

[timdeschryver]

I suppose the error comes from here.
Maybe that that code isn't included by just adding the oidc client to an Angular app?

Or we should build the whole app against RxJS 6 🤔, but a linter should be easier 😅.

[FabianGosebrink]

Thanks for the hint! Just fixed that in the related PR. Yes, it might be that you need to explicitly use the StsConfigHttpLoader.

[FabianGosebrink]

@fdellasoppa should be fixed in the next release.

[fdellasoppa]

Wonderful! Thanks!

[FabianGosebrink]

Thanks. Do you, @timdeschryver, know a linting rule to check against rxjs 6 Imports? Otherwise I would try to write one. I searched for it but did not find one.

[timdeschryver]

@FabianGosebrink I haven't find one either.
But I created an issue.

[FabianGosebrink]

Ah nice! Thank you very much!