Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug: dismissing controller modal doesn't unmount inner component #26665

Closed
4 of 7 tasks
a-Leong opened this issue Jan 23, 2023 · 3 comments
Closed
4 of 7 tasks

bug: dismissing controller modal doesn't unmount inner component #26665

a-Leong opened this issue Jan 23, 2023 · 3 comments
Assignees
Labels

Comments

@a-Leong
Copy link

a-Leong commented Jan 23, 2023

Prerequisites

Ionic Framework Version

  • v4.x
  • v5.x
  • v6.x
  • Nightly

Current Behavior

Dismissing a controller modal does not trigger onUnmounted Vue lifecycle hook on the inner component. In my case there is init/deinit logic that occurs in modal inner component lifecycle hooks which isn't running as expected.

In reproduction repo you will notice opening a message mounts the first message, but subsequent modal presentations use the first component with its initalized data as opposed to remounting and reinitializing.

Expected Behavior

As described in ion-modal docs, controller modals should not persist the inner component across presentations. The inner component should unmount when the modal is dismissed.

Steps to Reproduce

  1. Present component in modal and dismiss modal.
  2. Present modal again with the same component and different componentProps
  3. Initial values from first modal presentation persist

Note the componentProps update as expected, however any initialization that occurs in setup script or lifecycle hooks fails to run.

Code Reproduction URL

https://github.com/a-Leong/vue-modal-behavior

Ionic Info

Ionic:

Ionic CLI : 6.20.6 (/Users/****/.nvm/versions/node/v16.15.0/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/vue 6.5.0

Capacitor:

Capacitor CLI : 4.6.2
@capacitor/android : not installed
@capacitor/core : 4.6.2
@capacitor/ios : not installed

Utility:

cordova-res : not installed globally
native-run : 1.7.1

System:

NodeJS : v16.15.0 (/Users/****/.nvm/versions/node/v16.15.0/bin/node)
npm : 9.1.2
OS : macOS

Additional Information

It's not clear to me whether this is expected behavior, however it contradicts my expectations based on the controller modal documentation. Is there a way to force the inner component to unmount on modal dismiss?

@ionitron-bot ionitron-bot bot added the triage label Jan 23, 2023
@liamdebeasi liamdebeasi self-assigned this Jan 23, 2023
@liamdebeasi
Copy link
Contributor

Thanks for the report. This appears to be the same as #26644. The modal contents should unmount when dismissing the modal.

There is a dev build with a fix here: #26644 (comment). This fix should be available in the next patch release later this week.

I am going to close this since the code required to fix the issue has been completed, but let me know if you have any questions.

@liamdebeasi liamdebeasi closed this as not planned Won't fix, can't repro, duplicate, stale Jan 23, 2023
@a-Leong
Copy link
Author

a-Leong commented Jan 23, 2023

Perfect, thank you. I'll make a note to check closed issues in the future.

@ionitron-bot
Copy link

ionitron-bot bot commented Feb 22, 2023

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.

@ionitron-bot ionitron-bot bot locked and limited conversation to collaborators Feb 22, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

No branches or pull requests

2 participants