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.

Sign up for GitHub

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

Jump to bottom

Bubbling and propagation problem in nested dialog #342

Closed
DamlaDemir opened this issue Dec 15, 2022 · 4 comments · Fixed by #847
Closed

Bubbling and propagation problem in nested dialog #342

DamlaDemir opened this issue Dec 15, 2022 · 4 comments · Fixed by #847
Assignees
@BaharYilmaz
Labels
bl-dialog Issues related with Dialog component bug Something isn't working released on @beta released

Comments

@DamlaDemir
Copy link
Contributor

DamlaDemir commented Dec 15, 2022 •
edited
Loading

Describe the bug
When using nested dialog in the Vue 2 project, we noticed that every dialog closes when we click the close button of the child dialog or press the esc key.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://codesandbox.io/s/vue-2-playground-forked-wrxmzy?file=/src/App.vue
  2. Click on open parent dialog button
  3. Click on open child dialog button
  4. Click on close button
  5. You will see the every dialog is closed

Expected behavior
When we click the close button of child dialog or esc key we should only see it close.

Desktop (please complete the following information):

  • OS: Macos
  • Browser Chrome

Additional context
This problem probably occur because of bubbling and propagation. When I add the stop (it is equal event.stopPropagation()) like this:

<bl-dialog
 :open="openChildDialog"
 @bl-dialog-close.stop="openChildDialog = false">
   Child Dialog
</bl-dialog>

The stop fixes the close button problem but esc problem is going on.
@muratcorlu
Copy link
Contributor

@DamlaDemir Codesandbox link shows a pagination example now. Did you change it, or wrong link?

@DamlaDemir
Copy link
Contributor Author

Sorry, i added wrong link. I fixed 👍

@muratcorlu muratcorlu added bl-dialog Issues related with Dialog component bug Something isn't working labels Jan 6, 2023
@muratcorlu muratcorlu added this to the 2023 Q2 milestone Mar 28, 2023
@muratcorlu muratcorlu modified the milestones: 2023 Q2, 2023 Q3 Jul 14, 2023
@leventozen leventozen removed this from the 2023 Q3 milestone Nov 30, 2023
@BaharYilmaz BaharYilmaz self-assigned this Mar 26, 2024
@BaharYilmaz BaharYilmaz mentioned this issue Apr 29, 2024
Merged
AykutSarac pushed a commit that referenced this issue Apr 29, 2024
@BaharYilmaz
fix(dialog): fix nested dialog propagation problem (#847)
8309185 
This PR fixes the propagation issue during close in nested dialogs

Closes #342

Co-authored-by: Bahar Yılmaz <bahar.yilmaz@trendyol.com>
@github-actions GitHub Actions
Copy link

🎉 This issue has been resolved in version 3.0.0-beta.16 🎉

The release is available on:

Your semantic-release bot 📦🚀

@github-actions GitHub Actions
Copy link

github-actions bot commented May 2, 2024

🎉 This issue has been resolved in version 3.1.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@BaharYilmaz BaharYilmaz

Labels
bl-dialog Issues related with Dialog component bug Something isn't working released on @beta released
Projects
Baklava Design System
Archived in project
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(dialog): fix nested dialog propagation problem Trendyol/baklava
4 participants
@muratcorlu @leventozen @DamlaDemir @BaharYilmaz