search

B-3PO / angular-material-expansion-panel

Material Design Expansion Panels for Angular Material
MIT License
71 stars 25 forks source link

expansion panel disappears if you click quickly on something triggering a collapse #33

Open sschick-prognos opened 7 years ago

sschick-prognos commented 7 years ago

Noticed this in my own code where I'd done something a little goofy to make the panel collapse if it was clicked on when it was open. However, the plunkr that @iamempty put together in a different bug also replicates the problem. I've reduced it a little bit for clarity below. The bug only triggers when clicking quickly on an element that will trigger the panel collapsing with a touchpad (a mouse does not trigger the issue). It looks to me like it is triggered when there is a close and then open event in very quick succession.

http://plnkr.co/edit/lmzkgzQKVNfdGh6uswrx?p=preview

sschick-prognos commented 7 years ago

After a little fiddling with my own code, I found that running panel.collapse().then(panel.collapse) successfully masks the problem (with a little bit of an odd flash of the element). It would still be great if this could be addressed more elegantly.

B-3PO commented 7 years ago

I am not exactly clear on how to reproduce this error, can you give me some more info.

  1. steps to reproduce
  2. browsers you are seeing the issue in
  3. os
mrs-eload commented 6 years ago

Happened to me too when toggle collapsing/expanding from the header. Looks like css has difficulties to be updated when quickly expanding and collapsing. Animations are probably overlapping.

@B-3PO ng-click="$panel.collapse()" on md-expansion-panel-header then massive clicks on panel header. Sometimes panels disappear, sometimes one or more elements are staying. @sschick-prognos code is exactly like mine but can't reproduce the bug on plunker though. Oh and the workaround is working, thank you :)