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

ConfirmDialog | keeps raising z-index in whole application #11523

Closed
Hapcy opened this issue May 16, 2022 · 3 comments · Fixed by #11524
Closed

ConfirmDialog | keeps raising z-index in whole application #11523

Hapcy opened this issue May 16, 2022 · 3 comments · Fixed by #11524
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@Hapcy
Copy link

Hapcy commented May 16, 2022

I'm submitting a ... (check one with "x")

[x] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports)
https://stackblitz.com/edit/github-sq8br6?file=src/app/app.component.html

Current behavior
ConfirmDialog z-index keeps infinitely rising when autoZIndex is true. This causes problems when for some reason you can't turn it off (stacking dialogs in my case) but something else has a set zIndex and has to stay above the confirmdialog. In the attached stackblitz there is a red square above the confirmDialog but after a few clicks it sinks under it. If the confirm dialog is stacking and there are tooltips involved as well then the z-index keeps rising in steps of 1000.

Expected behavior
It should work like a normal dialog and only raise the z-index while it's visible.

Minimal reproduction of the problem with instructions
https://stackblitz.com/edit/github-sq8br6?file=src/app/app.component.html
Press the button and accept the confirmdialog a few times. Observe as the red square initially appears above the dialog then after a few confirmations appears below it.

What is the motivation / use case for changing the behavior?
Dialog works differently. Fixed in #6857.

Please tell us about your environment:

  • Angular version: 13
  • PrimeNG version: 13
  • Browser: all
  • Language: all
@cetincakiroglu
Copy link
Contributor

Hi @Hapcy,

Please correct me if I'm wrong, you want to use stacking dialogs with autoZIndex is true?

@Hapcy
Copy link
Author

Hapcy commented May 17, 2022

Yes, exactly, I want to use stacking dialogs.

I think the root of the issue is that when the confirmdialog opens it uses ZIndexUtils.set which generates an entry into the zIndexes. This is fine, but when I try to close the confirmDialog it calls ZIndexUtils.set once again and generates a new entry. When the ConfirmDialog.onOverlayHide tries to use ZIndexUtils.clear it only clears one of the entries. So the next ZIndexUtils.set starts from one zIndex higher (or more if there are other keys involved eg. tooltips).

For me this means that after some confirmations the new confirmations appear above an element which has a fixed z-index and I don't want to get that element involved with the autoZIndex system of primeng.

Thanks for the quick follow-up :)

Side note: While trying to reproduce the issue I found that something similiar happens in the case of toasts. If multiple toasts appear at the same time then the ZIndexUtils.clear only clears the last entry from ZIndexUtils' zIndexes.

@cetincakiroglu cetincakiroglu added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Status: Pending Review Issue or pull request is being reviewed by Core Team labels May 23, 2022
@cetincakiroglu cetincakiroglu added this to the 13.Future milestone May 23, 2022
@cetincakiroglu
Copy link
Contributor

Hi @Hapcy,

Thanks for your report, we'll review your pull request.

Regard.

@cetincakiroglu cetincakiroglu modified the milestones: 13.Future, 13.4.2 May 24, 2022
@cetincakiroglu cetincakiroglu changed the title ConfirmDialog keeps raising z-index in whole application ConfirmDialog | keeps raising z-index in whole application May 25, 2022
@cetincakiroglu cetincakiroglu removed their assignment Jun 7, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants