diff options
3 files changed, 40 insertions, 1 deletions
diff --git a/app/assets/javascripts/mr_popover/index.js b/app/assets/javascripts/mr_popover/index.js index cc686b401d2..9a97e98f9db 100644 --- a/app/assets/javascripts/mr_popover/index.js +++ b/app/assets/javascripts/mr_popover/index.js @@ -54,9 +54,13 @@ export default elements => { const apolloProvider = new VueApollo({ defaultClient: createDefaultClient(), }); + const listenerAddedAttr = 'data-mr-listener-added'; mrLinks.forEach(el => { - el.addEventListener('mouseenter', handleMRPopoverMount(apolloProvider)); + if (!el.getAttribute(listenerAddedAttr)) { + el.addEventListener('mouseenter', handleMRPopoverMount(apolloProvider)); + el.setAttribute(listenerAddedAttr, true); + } }); } }; diff --git a/changelogs/unreleased/60241-merge-request-popover-doesn-t-go-away-on-mouse-leave.yml b/changelogs/unreleased/60241-merge-request-popover-doesn-t-go-away-on-mouse-leave.yml new file mode 100644 index 00000000000..ce942777dca --- /dev/null +++ b/changelogs/unreleased/60241-merge-request-popover-doesn-t-go-away-on-mouse-leave.yml @@ -0,0 +1,5 @@ +--- +title: Fix bug where MR popover doesn't go away on mouse leave +merge_request: +author: +type: fixed diff --git a/spec/frontend/mr_popover/index_spec.js b/spec/frontend/mr_popover/index_spec.js new file mode 100644 index 00000000000..8c33e52a04b --- /dev/null +++ b/spec/frontend/mr_popover/index_spec.js @@ -0,0 +1,30 @@ +import * as createDefaultClient from '~/lib/graphql'; +import { setHTMLFixture } from '../helpers/fixtures'; +import initMRPopovers from '~/mr_popover/index'; + +createDefaultClient.default = jest.fn(); + +describe('initMRPopovers', () => { + let mr1; + let mr2; + + beforeEach(() => { + setHTMLFixture(` + <div id="one" class="gfm-merge_request">MR1</div> + <div id="two" class="gfm-merge_request">MR2</div> + `); + + mr1 = document.querySelector('#one'); + mr2 = document.querySelector('#two'); + + mr1.addEventListener = jest.fn(); + mr2.addEventListener = jest.fn(); + }); + + it('does not add the same event listener twice', () => { + initMRPopovers([mr1, mr1, mr2]); + + expect(mr1.addEventListener).toHaveBeenCalledTimes(1); + expect(mr2.addEventListener).toHaveBeenCalledTimes(1); + }); +}); |