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

mat-expansion-panel's content hides immediately, outrunning the panel's animation #14075

Closed
jimmyzzxhlh opened this issue Nov 10, 2018 · 1 comment · Fixed by #30119
Closed

mat-expansion-panel's content hides immediately, outrunning the panel's animation #14075

jimmyzzxhlh opened this issue Nov 10, 2018 · 1 comment · Fixed by #30119
Labels
animation This issue is related to Angular animations or CSS animations area: material/expansion G This is is related to a Google internal issue P4 A relatively minor issue that is not relevant to core functions

Comments

@jimmyzzxhlh
Copy link

Bug, feature request, or proposal:

Bug
This is basically another version of issue 10134.

What is the expected behavior?

When hiding the expansion panel using animations, the header and the content of the expansion panel should both respect the animations.

What is the current behavior?

Only the header respects the animation, the body doesn't.
Notice that showing expansion panel using animation does work correctly.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-material2-issue-hmgomu

What is the use-case or motivation for changing an existing behavior?

This is a bug found when we try to define some fade-in/fade-out animation for the expansion panel.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular Material 5.2.6

Is there anything else we should know?

N/A.
@josephperrott josephperrott added the G This is is related to a Google internal issue label Nov 26, 2018
@mmalerba mmalerba added the needs triage This issue needs to be triaged by the team label May 20, 2020
@josephperrott josephperrott added animation This issue is related to Angular animations or CSS animations area: material/expansion P4 A relatively minor issue that is not relevant to core functions and removed needs triage This issue needs to be triaged by the team labels May 26, 2020
crisbeto added a commit to crisbeto/material2 that referenced this issue Dec 5, 2024
@crisbeto
fix(material/expansion): switch away from animations module
bcfd6c3 
Reworks the expansion panel to animate purely with CSS, rather than going through the `@angular/animations` module. This simplifies the setup and allows us to resolve several long-standing bug reports.

Fixes angular#27946.
Fixes angular#22715.
Fixes angular#21434.
Fixes angular#20610.
Fixes angular#20517.
Fixes angular#17177.
Fixes angular#16534.
Fixes angular#16503.
Fixes angular#14952.
Fixes angular#14759.
Fixes angular#14075.
Fixes angular#11765.
@crisbeto crisbeto mentioned this issue Dec 5, 2024
Merged
crisbeto added a commit to crisbeto/material2 that referenced this issue Dec 5, 2024
@crisbeto
fix(material/expansion): switch away from animations module
b35c757 
Reworks the expansion panel to animate purely with CSS, rather than going through the `@angular/animations` module. This simplifies the setup and allows us to resolve several long-standing bug reports.

Fixes angular#27946.
Fixes angular#22715.
Fixes angular#21434.
Fixes angular#20517.
Fixes angular#17177.
Fixes angular#16534.
Fixes angular#16503.
Fixes angular#14952.
Fixes angular#14759.
Fixes angular#14075.
Fixes angular#11765.
crisbeto added a commit that referenced this issue Dec 5, 2024
@crisbeto
fix(material/expansion): switch away from animations module (#30119)
7b64c45 
Reworks the expansion panel to animate purely with CSS, rather than going through the `@angular/animations` module. This simplifies the setup and allows us to resolve several long-standing bug reports.

Fixes #27946.
Fixes #22715.
Fixes #21434.
Fixes #20517.
Fixes #17177.
Fixes #16534.
Fixes #16503.
Fixes #14952.
Fixes #14759.
Fixes #14075.
Fixes #11765.

(cherry picked from commit aafa151)
@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 Jan 5, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
animation This issue is related to Angular animations or CSS animations area: material/expansion G This is is related to a Google internal issue P4 A relatively minor issue that is not relevant to core functions
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(material/expansion): switch away from animations module crisbeto/material2
3 participants
@josephperrott @jimmyzzxhlh @mmalerba