diff --git a/backend/app/assets/javascripts/spree/backend/components/tooltips.js b/backend/app/assets/javascripts/spree/backend/components/tooltips.js index afc373aa440..600007621a7 100644 --- a/backend/app/assets/javascripts/spree/backend/components/tooltips.js +++ b/backend/app/assets/javascripts/spree/backend/components/tooltips.js @@ -3,26 +3,30 @@ Spree.ready(function(){ $('body').tooltip({selector: '.with-tip'}); + /* + * Poll tooltips to hide them if they are no longer being hovered. + * + * This is necessary to fix tooltips hanging around after their attached + * element has been removed from the DOM (and will therefore receive no + * mouseleave event). This may be unnecessary in a future version of + * bootstrap, which intends to solve this using MutationObserver. + */ + var removeDesyncedTooltip = function(tooltip) { + var interval = setInterval(function(){ + if(!$(tooltip.element).is(":hover")) { + tooltip.dispose(); + clearInterval(interval); + } + }, 200); + $(tooltip.element).on('hidden.bs.tooltip', function(){ + clearInterval(interval); + }); + }; + $('body').on('inserted.bs.tooltip', function(e){ var $target = $(e.target); var tooltip = $target.data('bs.tooltip'); - - /* - * Observe target changes to understand if we need to remove tooltips. - * - * This is necessary to fix tooltips hanging around after their attached - * element has been removed from the DOM (and will therefore receive no - * mouseleave event). - */ - var observer = new MutationObserver(function(mutations) { - // disconnect itself when content is changed, a new observer will - // be attached to this element when the new tooltip is created. - this.disconnect(); - - tooltip.hide(); - }); - observer.observe($target.get(0), { attributes: true }); - + removeDesyncedTooltip(tooltip); var $tooltip = $("#" + $target.attr("aria-describedby")); $tooltip.addClass("action-" + $target.data("action")); });