popup_theme_islands: visible-mod event fires before block's animation ends
- Dominant language
- JavaScript
- Stars
- 330
- Forks
- 88
- PR merge metrics
- No merged PRs in 30d
Description
We use CSS animation to visualise the process of setting / removing `visible` modifier of the block. This brings some sort of inconsistency in block's behaviour: modifier based events are always synchronous, while CSS animation is asynchronous.
In cases when you need to remove `popup` (or `modal`) after it was hidden, you can't just add `{ modName: 'visible', modVal: '' }` event listener and remove blocks from DOM. You need to do weird things such as add additional listener to `animationend` event and remove block after it would be fired from CSS.
Here is an example which illustrate the problem (and the solution):
``` js
BEMDOM.decl('some-block', {
onSetMod : {
'js' : {
'inited' : function() {
this._popup.on({ modName : 'visible', modVal : '' }, this._onPopupHide, this);
}
}
_onPopupHide() {
this._popup.domElem.one('animationend', this._onPopupHideFinaly);
}
_onPopupHideFinaly() {
BEMDOM.descturct(this._popup.domElem);
}
});
```
We definitely need to do something here, as such API looks ridiculous.
Contributor guide
Assessment
This issue has not been assessed yet.