MSpinner does not remove backdrop on destruction
Opened this issue · 0 comments
Deleted user commented
@ulaval/modul-components
Issue Checklist
- [x ] Provide a description of the issue
Le backdrop n'est pas détruit lorsqu'on utilise un m-spinner (en mode processing) dans un component dont le rendu est conditionnel et que le component se fait détruire.
If submitting a bug
- [x ] Provide a step by step way to reproduce the problem with screenshot or video
parent.html
<div v-if="shouldRenderChild">
<child></child>
</div>
parent.ts
...
get shouldRenderChild() {
return this.$store.state.shouldRenderChild;
}
...
child.html
<div>
<m-spinner v-if="shouldRenderSpinner" :processing="true"></m-spinner>
<button v-on:click="onClick"></button>
</div>
child.ts
shouldRenderSpinner = false;
onClick() {
this.shouldRenderSpinner = true;
setTimeout(() => {
this.$store.commit('HIDE_CHILD');
}, 1000)
}
mutations.ts
const mutations = {
HIDE_CHILD: (state) {
state.shouldRenderChild = false;
}
}
- [x ] Provide the expected behaviour
Le backdrop devrait disparaitre lorsque le component se fait détruire. On peut régler le problème de la manière suivante:
spinner.js
MSpinner.prototype.beforeDestroy = function () {
if (this.processing) {
+ this.removeBackdrop();
var el = document.getElementById(this.spinnerId);
if (el) {
document.body.removeChild(el);
}
}
};
- [x ] I'm not an internal contributor