single-spa / single-spa-angular

Helpers for building single-spa applications which use Angular
Apache License 2.0
203 stars 78 forks source link

Second navigation in same app is always ignored #529

Open kentora opened 1 month ago

kentora commented 1 month ago

Demonstration

I have a single-spa setup with a nav-app, app1and app2. When i click a link for app1 in my nav-app, and then another link for another component in app1 from nav-app the navigation is ignored. This happens consitently, and only for the second navigation.

It seems to be releated to #113 as i can see that upon mounting app1 the first time, replaceState in extra-provider.ts is called, setting the flag skipNextPopState, which then causes the second navigation event to be ignored.

I'm unsure if the fix is needed with newer versions of single-spa, or the root cause has been fixed. I have not had any problems in commenting out the line setting the flag.

Expected Behavior

Navigation occurs

Actual Behavior

Navigation is ignored.

Arjun99 commented 1 week ago

Is this happening only for your app1 ? Have you setup emptyroutecomponent in your angular applications?

kentora commented 1 week ago

It seems to be pretty consistent, when navigation occurs within the active app. EmptyRouteComponent is correctly setup.

Arjun99 commented 1 week ago

Can you share your layout.html in the root-config file that you have created for the configuring the routes.

sandeep-dxc commented 2 days ago

I have created a repo to reproduce this issue, thanks to @kfrederix for the base repo.

https://github.com/user-attachments/assets/c54a3e9b-a70f-426a-8f9f-73949a83bacd

https://github.com/sandeep-dxc/single-spa-angular-esm

pnpm i
pnpm dev
http://localhost:4300/

@joeldenning @arturovt Would you have any suggestions on how to resolve this.

Thanks.

Arjun99 commented 2 days ago

Hi Sandeep,

Let me check that and get back to you.

kfrederix commented 2 days ago

Hello @sandeep-dxc , I took a look at your repo => you can solve this issue by setting urlRerouteOnly to false in the host main.ts. E.g.

start({ urlRerouteOnly: false });

(I will add that also on my repo, because it's usually recommended to do that for Angular applications)

sandeep-dxc commented 1 day ago

Thanks @kfrederix, its working now 👍