giphy: Use MutationObserver to check when popover is visible.

setTimeout doesn't work all the time especially when trying to
hide and display the popover at once, like when you press
to open giphy popover in message edit form while another giphy
popover is open from the compose box.

MutationObserver works reliably, hence we choose to use it
instead.
This commit is contained in:
Aman Agrawal 2021-04-27 20:54:15 +00:00 committed by Tim Abbott
parent fe982e4105
commit 61975c3e8f
1 changed files with 11 additions and 9 deletions

View File

@ -237,15 +237,17 @@ export function initialize() {
}); });
active_popover_element.popover("show"); active_popover_element.popover("show");
// Allow simplebar to render, then fetch and // It takes about 1s for the popover to show; So,
// render GIFs. otherwise simplebar replaces // we wait for popover to display before rendering GIFs
// the `.gipihy-content` element when trying // in it, otherwise popover is rendered with empty content.
// to wrap it and hence, our jquery reference const popover_observer = new MutationObserver(() => {
// to `.giphy-content` is lost. Thus, no GIF if ($("#giphy_grid_in_popover .giphy-content").is(":visible")) {
// is rendered.
setTimeout(() => {
gifs_grid = renderGIPHYGrid($("#giphy_grid_in_popover .giphy-content")[0]); gifs_grid = renderGIPHYGrid($("#giphy_grid_in_popover .giphy-content")[0]);
}, 0); popover_observer.disconnect();
}
});
const opts = {attributes: false, childList: true, characterData: false, subtree: true};
popover_observer.observe(document, opts);
$("body").on( $("body").on(
"keyup", "keyup",