Ionic-framework: bug:

[ivanov84]

Bug Report

Ionic version:


[x] 4.8.1

Current behavior:
When I use command this.router.navigateByUrl(url) or this.router.navigate([url]) component where I call this command destroyed with all rendered data

Expected behavior:
As before in ionic v3 I expect to save rendered data

Steps to reproduce:
call command from typescript: this.router.navigateByUrl(url)
P.S.: if I use <a routerLink="/discussion" (click)="openPost(post)">{{post.PostId}}</a>
I meant routerLink - then data saved

Related code:

this.router.navigateByUrl(url)

Other information:
this bug was already mentioned here:
https://github.com/ionic-team/ionic/issues/18942

Ionic info:

Component destroyed

[ivanov84]

Please answer something...

[liamdebeasi]

Thanks for the issue. Are you seeing page A get destroyed when navigating forward from page A to page B? Also, which version of Ionic are you seeing this on?

[ivanov84]

@liamdebeasi Yes, I see in logs that page A destroyed when navigating forward from page A to page B.
Ionic vervion 4.8.1 - it's written in the header of my issue.

Do I need to compose emulator with this bug to force resolving my problem or this issue is obviuos?

[liamdebeasi]

Thanks for the follow up. It would be great if you could provide a repo with the code required to reproduce this issue. Page A should not be getting destroyed as it's still in the navigation stack.

[ivanov84]

@liamdebeasi I cannot get how to post to codepen.io but I just made a rar archive with a test example project with "Sub-page" additional.

link to download example: https://olympapp.club/myapp.rar

This issue appears not every time.

To emulate this issue please:

1. run comman ionic serve
2. after app is loaded - select tab2
3. then go to tab1
4. and press on button "Open Sub-Page" on the top on the first screen
5. in console you can find that the first screen is destroyed

P.S.: it could be a good idea to create standard example with actual ionic v4 on codepen so every user can modify it and attached modification example to bug issues here

[liamdebeasi]

Thanks for the follow up. I am doing the following steps:

1. Run ionic serve. This opens the app on tab 1.
2. Select Tab 2
3. Select Tab 1
4. Click "Open Sub-Page"

At this point, app-tab1, app-tab2, and app-sub-page all exist in the DOM. I am not seeing app-tab1 being removed from the DOM at all.

Can you clarify what I should be seeing?

[ivanov84]

@liamdebeasi please do exactly what is shown on screencapture
https://olympapp.club/ScreenRecorderProject1.mp4

[liamdebeasi]

Thank you! I was able to reproduce the issue.

For anyone else reading, here are the steps to reproduce (I was actually able to reproduce this in fewer steps):

1. Start the app, you will be on tab 1.
2. Click Tab 1 (you are already on tab 1, but click it anyways).
3. Click "Open Sub-Page".

The sub page should be added to the DOM, and the entire app-tabs component should be removed from DOM.

We will investigate this issue and will post here when we have more to share. Thanks!

[ivanov84]

@liamdebeasi thank you very much

[ivanov84]

@liamdebeasi It took a month and a half but the problem is not solved. Maybe I will solve it myself? Tell me what to do?

[liamdebeasi]

I haven't been able to take a look at this quite yet. Please feel free to take a look at the issue if you are interested -- we love community contributions!

You can follow this contributing guide for how to get started: https://github.com/ionic-team/ionic/blob/master/.github/CONTRIBUTING.md.

I will try to take a look soon, but otherwise let me know if you have any questions about the contributing guide 🙂.

[ivanov84]

@liamdebeasi Ok, I will look at contributing guide. Anyway when I found out real reason I will text here back.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.