diff --git a/gui/admin-gui/src/frontend/js/midpoint-theme.js b/gui/admin-gui/src/frontend/js/midpoint-theme.js index 03311f016bc..3289016794b 100644 --- a/gui/admin-gui/src/frontend/js/midpoint-theme.js +++ b/gui/admin-gui/src/frontend/js/midpoint-theme.js @@ -302,11 +302,11 @@ export default class MidPointTheme { if (parentMorePopup && parentMorePopup.length !== 0) { setTimeout(function() { isHovered = false; - checkHide($(this)); + checkHide($el); }, 300); } else { isHovered = false; - checkHide($(this)); + checkHide($el); } }); @@ -364,13 +364,21 @@ export default class MidPointTheme { const tooltipId = 'tooltip-' + Math.random().toString(16).substr(2, 6); $el.attr('data-tooltip-id', tooltipId); - $el.tooltip({ + const tooltipOptions = { html: true, title: $el.attr('data-tooltip-content') || '', whiteList: wl, container: container, trigger: 'manual' - }); + }; + + if ($el.closest('.search-popover').length !== 0) { + tooltipOptions.placement = 'left'; + tooltipOptions.boundary = 'window'; + tooltipOptions.offset = '0, 2'; + } + + $el.tooltip(tooltipOptions); // "tooltipShowDelayTimer" is used to prevent tooltip from showing when user quickly moves mouse // over multiple icons with tooltips or quickly tabs through them. Tooltip will be shown only for @@ -379,13 +387,13 @@ export default class MidPointTheme { $el.data("tooltipShowDelayTimer", setTimeout(() => { $el.tooltip("show"); $el.removeAttr("aria-describedby"); - }, 1000)); - - setTimeout(() => { - const $tooltip = $('.tooltip:visible').last(); - $tooltip.removeAttr('role'); + const $tooltip = $('.tooltip:visible').last() + .attr('id', tooltipId) + .removeAttr('role'); + if (!setFocus) { + $tooltip.css('pointer-events', 'none'); + } const $tooltipInner = $tooltip.find('.tooltip-inner'); - $tooltip.attr('id', tooltipId); $tooltipInner .attr('tabindex', '0') @@ -428,7 +436,7 @@ export default class MidPointTheme { $tooltipInner.focus(); lastTooltipTrigger = $el; } - }, 100); + }, 1000)); } }; @@ -1389,6 +1397,9 @@ export default class MidPointTheme { if (!show) { if (popup.is(':visible')) { + popup.find("[data-toggle='tooltip']").each(function () { + $(this).tooltip('hide').tooltip('dispose').removeAttr('data-tooltip-id aria-describedby'); + }); popup.fadeOut(200); ref.attr('aria-expanded', 'false'); ref.focus(); diff --git a/release-notes.adoc b/release-notes.adoc index bb633f21744..b01b9fb5383 100644 --- a/release-notes.adoc +++ b/release-notes.adoc @@ -142,6 +142,7 @@ Overall, midPoint 4.10 opens up the world of identity management and governance * Fixed missing input variable in resource activation existence mappings. See bug:MID-10905[] * Fixed stale page recovery after viewing page source causing internal server error. See bug:MID-9998[] * Hided conflict warning on Shopping cart panel of the Request Access wizard in case of prune action. See bug:MID-11250[] and xref:#_behavior_changes_since_4_10[behavior changes since 4.10]. +* Fixed tooltip lifecycle in search popovers to prevent blinking, stuck, and duplicate tooltips. See bug:MID-10908[] === Releases Of Other Components