diff --git a/cypress/integration/origin-visits.spec.js b/cypress/integration/origin-visits.spec.js --- a/cypress/integration/origin-visits.spec.js +++ b/cypress/integration/origin-visits.spec.js @@ -75,4 +75,20 @@ searchInCalendar(getTime($el.text())); }); }); + + it('should close calendar popover when leaving day', function() { + cy.get('#swh-last-visit > .swh-visit-full') + .then(($el) => { + const date = getTime($el.text()); + searchInCalendar(date); + cy.contains('.month', date.monthName) + .find('.day-content') + .eq(date.date - 1) + .trigger('mouseout'); + + cy.get('.popover') + .should('not.be.visible'); + }); + }); + }); diff --git a/swh/web/assets/src/bundles/origin/visits-calendar.js b/swh/web/assets/src/bundles/origin/visits-calendar.js --- a/swh/web/assets/src/bundles/origin/visits-calendar.js +++ b/swh/web/assets/src/bundles/origin/visits-calendar.js @@ -15,7 +15,7 @@ function closePopover() { if (currentPopover) { - $(currentPopover).popover('hide'); + $(currentPopover).popover('dispose'); currentPopover = null; } } @@ -121,6 +121,19 @@ container: 'body', html: true, content: content + }).on('mouseleave', () => { + if (!$('.popover:hover').length) { + // close popover when leaving day in calendar + // except if the pointer is hovering it + closePopover(); + } + }); + + $(e.element).on('shown.bs.popover', () => { + $('.popover').mouseleave(() => { + // close popover when pointer leaves it + closePopover(); + }); }); $(e.element).popover('show'); @@ -128,12 +141,6 @@ } } }); - $('#swh-visits-timeline').mouseenter(() => { - closePopover(); - }); - $('#swh-visits-list').mouseenter(() => { - closePopover(); - }); $('#swh-visits-calendar.calendar table td').css('width', maxSize + 'px'); $('#swh-visits-calendar.calendar table td').css('height', maxSize + 'px'); $('#swh-visits-calendar.calendar table td').css('padding', '0px');