FIX: more efficient and resilient widget-dropdown body (#10458)

This commit is contained in:
Joffrey JAFFEUX 2020-08-18 13:39:08 +02:00 committed by GitHub
parent 7e414da0d9
commit 93a370863f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 39 additions and 37 deletions

View File

@ -157,43 +157,6 @@ export const WidgetDropdownBodyClass = {
return `widget-dropdown-body ${attrs.class || ""}`;
},
init(attrs) {
schedule("afterRender", () => {
const dropdownHeader = document.querySelector(
`#${attrs.id} .widget-dropdown-header`
);
const dropdownBody = document.querySelector(
`#${attrs.id} .widget-dropdown-body`
);
if (dropdownHeader && dropdownBody) {
/* global Popper:true */
this._popper = Popper.createPopper(dropdownHeader, dropdownBody, {
strategy: "fixed",
placement: "bottom-start",
modifiers: [
{
name: "preventOverflow"
},
{
name: "offset",
options: {
offset: [0, 5]
}
}
]
});
}
});
},
destroy() {
if (this._popper) {
this._popper.destroy();
this._popper = null;
}
},
clickOutside() {
this.sendWidgetAction("hideBody");
},
@ -269,8 +232,47 @@ export const WidgetDropdownClass = {
}
},
destroy() {
if (this._popper) {
this._popper.destroy();
this._popper = null;
}
},
_onTrigger() {
this.state.opened = !this.state.opened;
schedule("afterRender", () => {
const dropdownHeader = document.querySelector(
`#${this.attrs.id} .widget-dropdown-header`
);
const dropdownBody = document.querySelector(
`#${this.attrs.id} .widget-dropdown-body`
);
if (this.state.opened && dropdownHeader && dropdownBody) {
if (this.state.popper) {
this.state.popper.destroy();
}
/* global Popper:true */
this.state.popper = Popper.createPopper(dropdownHeader, dropdownBody, {
strategy: "fixed",
placement: "bottom-start",
modifiers: [
{
name: "preventOverflow"
},
{
name: "offset",
options: {
offset: [0, 5]
}
}
]
});
}
});
},
template: hbs`