MSAL Angular support Angular 13 and RxJS v7

[byunru]

Core Library

MSAL.js v2 (@azure/msal-browser)

Wrapper Library

MSAL Angular (@azure/msal-angular)

Description

Expecting MSAL.ja can support RxJS v7
The Roadmap of RxJS is already from 7 to 8

Source

External (Customer)

[sameerag]

@byunru Let us evaluate this and reach out. cc @jo-arroyo @jasonnutter

[michaelmairegger]

Any news on this? Angular 13 has RxJS ~7.4.0 dependency

[jo-arroyo]

@byunru @michaelmairegger We are aware of this dependency and this upgrade is currently being prioritized. We will post an update when it is addressed in the library.

[janpereira-dev]

@byunru @michaelmaireggerWe are aware of this dependency and this upgrade is currently being prioritized. We will post an update when it is addressed in the library.

Thanks for the reply,

But just to know, do you have a deadline? can it be in another week? or two weeks? or more time? Just to know and prepare about it with my new projects, and what version of angular should I implement

[chrisls121]

@byunru @michaelmairegger Somos conscientes de esta dependencia y esta actualización se está priorizando actualmente. Publicaremos una actualización cuando se aborde en la biblioteca.

Thanks for the reply,

But just to know, do you have a deadline? can it be in another week? or two weeks? or more time? Just to know and prepare about it with my new projects, and what version of angular should I implement

Would be great to know a timeline as well for starting new projects with v13.

[peterzenz]

Thanks for asking, folks. Planning is done quarterly on our end, we should have better visibility into what plans/roadmap will look like in January. @EmLauber

[michaelmairegger]

@peterzenz That means we can excpect that feature not before February?

[peterzenz]

No date planned at this time but it is in our queue. January is the next planning cycle and the work, if prioritized for the quarter, would come after that.

[fgoulet]

I hope it will be prioritized because it's a big issue for us. msal angular is the only dependency that prevent us to upgrade our project to Angular 13 right now. I was kind of expecting that being compatible with the latest angular released version would be a de facto priority. It concern me a little bit for the future I must say.

[rojones94]

@peterzenz Would you be willing to consider an update from the community?

[jitendraP-ashutec]

@peterzenz , I have upgraded my Angular project from 12 to 13. now after updating when I am logginghandleRedirectObservable returns null each time so that it goes into infinite looping.

this.msal.handleRedirectObservable().subscribe({
      next: (result: AuthenticationResult) => {
       console.log(result)
   }
});

Could you please help me?

[michaelmairegger]

@jitendraP-ashutec you should not upgrade to Angular 13 if you use msal. This is because Angular 13 requires RxJS 7.4 and msal 6.5.5

[mbarzda]

@jitendraP-ashutec you should not upgrade to Angular 13 if you use msal. This is because Angular 13 requires RxJS 7.4 and msal 6.5.5

Angular 13 supports both rxjs v6 and v7 https://github.com/angular/angular/blob/13.0.0/packages/core/package.json#L19 . So, it is safe to upgrade to Angular 13.

[michaelmairegger]

@mbarzda thanks for the information. Thats indeed true. I have updated one of my projects using msal to Angular 13 without any issues.
In order that npm dedupe works I needed to specify the version for rxjs like in Angular's package.json does: "rxjs": "^6.5.3 || ^7.4.0"

[vpetrusevici]

I hope it will be prioritized because it's a big issue for us. msal angular is the only dependency that prevent us to upgrade our project to Angular 13 right now. I was kind of expecting that being compatible with the latest angular released version would be a de facto priority. It concern me a little bit for the future I must say.

looks like it wasn't :(

[EmLauber]

Thank you for your feedback and patience. This was evaluated for the current quarter (CY22Q1), but Angular 13 was not committed to. We had to prioritize other developments for security & resiliency above Angular 13: https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/roadmap.md

As called out by others in this thread, there is a workaround to using Angular 13 with MSAL.js and RxJS v6 while the MSAL.js team evaluates support for RxJS v7 and Angular 13.

[robertopc1]

Thank you for your feedback and patience. This was evaluated for the current quarter (CY22Q1), but Angular 13 was not committed to. We had to prioritize other developments for security & resiliency above Angular 13: https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/roadmap.md

As called out by others in this thread, there is a workaround to using Angular 13 with MSAL.js and RxJS v6 while the MSAL.js team evaluates support for RxJS v7 and Angular 13.

Thanks @EmLauber for letting us know. The problem is that some themes will only support rxjs 7 and if you want to use also MSAL it will not work as you will have to downgrade to rxjs 6. It's not schedule for Q1 of 22 hopefully it can be schedule for Q2.

[EmLauber]

Thanks @titopc for calling out where the RxJS v6 workaround does not work. Angular 13 & RxJS v7 support is in our backlog for evaluation for Q2 but I won't have an update on priority till closer to our planning period at the end of March / beginning of April.

[Trapulo]

I have an Angular 13 project running rxjs 7.4 and I'd like to switch to Azure Identity for authentication. So I need to abort it, really bad :(

[rdogmartin]

I was able to get MSAL running in Angular 13 using the new overrides feature in npm, introduced in 8.3.0.

"overrides": { "rxjs": "~7.5.2" },

[zsoltlengyelit]

I have done the same as @rdogmartin , except with versions reference. Works well so far.

{
  "dependencies": {
    "rxjs": "~7.5.2"
  },
  "overrides": {
    "rxjs": "$rxjs"
  }
}

read more here: https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides

[michaelmairegger]

@zsoltlengyelit @Trapulo I currently have lot of projects using msal in conjunction angular 13, all of them are working without any problems if the reference is

"rxjs": "^6.5.3 || ^7.4.0"

[fgoulet]

@zsoltlengyelit @Trapulo I currently have lot of projects using msal in conjunction angular 13, all of them are working without any problems if the reference is

"rxjs": "^6.5.3 || ^7.4.0"

I tried that but when I started to update deprecated rxjs 6 code with their replacement in 7, the new code would not compile.

The overrides look like a better option. Will try that.

[gaweCodes]

I use the workarounds. Bit I am really unhappy about the roadmap. Is it so hard to find a good solution?!

[harrisonbs]

It has been almost 6 months since the issue was raised. I just ran into the same issue. Why is this so hard to address?

[jasonnutter]

Apologies again for the delay on this issue, and thank you everyone for your patience. @Robbie-Microsoft from our team will be working now to get Angular 13/rxjs 7 compat resolved.

Furthermore, we're having discussions internally to make sure going forward we don't continue to be the blocker for Angular upgrades, given the documented and predictable release cadence of the Angular project.

[gadour97]

I was able to get MSAL running in Angular 13 using the new overrides feature in npm, introduced in 8.3.0.

"overrides": { "rxjs": "~7.5.2" },

How to do that ? I'm having some issues. @rdogmartin

[siddarthapal]

@jasonnutter Is there any date for releasing the Angular 13 compatible package?

[siddarthapal]

I was able to get MSAL running in Angular 13 using the new overrides feature in npm, introduced in 8.3.0.
"overrides": { "rxjs": "~7.5.2" },

How to do that ? I'm having some issues. @rdogmartin

I would also like to know the same.

[jasonnutter]

@jasonnutter Jason Nutter FTE Is there any date for releasing the Angular 13 compatible package?

Not yet. We'll follow up when we know more.

[siddarthapal]

@rdogmartin just in case you need it...
it worked me as well....

Add the following to your package.json file...
"overrides": {
"rxjs": "~7.4.0"
}

[jasonnutter]

Thank you everyone for your patience, and apologies again the delay in addressing this. #4605 has updated the peer dependency for rxjs to indicate support for rxjs@7, and we have included a couple of samples applications for Angular 13 (rxjs 6 and 7). This will be available in our release of MSAL Angular this coming Monday. We'll address any further enhancements (e.g. Ivy distribution) incrementally. Furthermore, we'll also proactively start looking at Angular 14 (starting with #4642).

Closing this issue. Please open a new issue if you encounter any further issues with Angular 13/rxjs v7.

[jasonnutter]

@siddarthapal Can you please open a new issue with your question? Thanks!

[siddarthapal]

@siddarthapal Can you please open a new issue with your question? Thanks!

Link for the issue created
#4685

[siddarthapal]

@jasonnutter I raised the issue.

#4685

But not sure, if someone would be looking into that or not. I raised the query because it appears that the documentation is not complete.
Could you please respond?

[jasonnutter]

@siddarthapal Thank you, and yes, we read and respond to all issues.

[siddarthapal]

@siddarthapal Thank you, and yes, we read and respond to all issues.
I am pretty new to this so I asked. thanks for the quick response.

[siddarthapal]

@jasonnutter One quick question. We are using MSAL for Angular 13. Instead of access token, we need to pass ID Token. I don't see any method in "MsalService" for the same. We have different methods.

Could you please arrange to answer the following:-
1: Does MSAL npm package somehow allows to get access to "ID Token"?
2: If Yes, any pointers you can provide?( I have raised this already to stack over flow. Also I don't see anything in FAQ also)

I asked question here as part of the dev team, you would be able to reply "Yes" or "No" quickly. :)

[jasonnutter]

@siddarthapal Again, please open a new issue, thanks.