Skip to content

Expansion panel headers inside a dialog jump size upon dialog open #22785

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

Closed
jelbourn opened this issue May 24, 2021 · 4 comments
Closed

Expansion panel headers inside a dialog jump size upon dialog open #22785

jelbourn opened this issue May 24, 2021 · 4 comments
Labels
animation This issue is related to Angular animations or CSS animations area: material/dialog area: material/expansion G This is is related to a Google internal issue P2 The issue is important to a large percentage of users, with a workaround

Comments

@jelbourn
Copy link
Member

Reproduction: https://stackblitz.com/edit/angular-pfrqah?file=src%2Fapp%2Fdialog-overview-example-dialog.html

The expansion panel headers start off with their expanded state height, and then quickly jump to their collapsed height. I suspect this has something to do with angular's animations, but it needs further investigation.

@jelbourn jelbourn added P2 The issue is important to a large percentage of users, with a workaround G This is is related to a Google internal issue animation This issue is related to Angular animations or CSS animations area: material/dialog area: material/expansion labels May 24, 2021
@jelbourn
Copy link
Member Author

Yeah, disabling animations does eliminate the issue (setting [@.disabled]="true")
https://stackblitz.com/edit/angular-pfrqah-s61yu8?file=src%2Fapp%2Fdialog-overview-example-dialog.html

@crisbeto
Copy link
Member

crisbeto commented May 31, 2021

This is a long-standing issue and I'm pretty sure that we have other similar issue reports open. It happens, because of the behavior in @angular/animations where parent animations block all descendant animations.

I have a PR that tries to tackle it, but we never managed to land it and it might not be perfect, based on Andrew's comment. #11778

@crisbeto
Copy link
Member

crisbeto commented Mar 6, 2022

Closing this as a duplicate of #13870 which has been open for longer.

@crisbeto crisbeto closed this as completed Mar 6, 2022
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Apr 6, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
animation This issue is related to Angular animations or CSS animations area: material/dialog area: material/expansion G This is is related to a Google internal issue P2 The issue is important to a large percentage of users, with a workaround
Projects
None yet
Development

No branches or pull requests

2 participants