Resolve "Merge Request Popover is not working on the To Do page"

2 files changed, 10 insertions, 8 deletions

diff --git a/app/assets/javascripts/mr_popover/index.js b/app/assets/javascripts/mr_popover/index.js
index 9a97e98f9db..18c0e201300 100644
--- a/app/assets/javascripts/mr_popover/index.js
+++ b/app/assets/javascripts/mr_popover/index.js
@@ -22,13 +22,10 @@ const handleUserPopoverMouseOut = ({ target }) => {
  * Adds a MergeRequestPopover component to the body, hands over as much data as the target element has in data attributes.
  * loads based on data-project-path and data-iid more data about an MR from the API and sets it on the popover
  */
-const handleMRPopoverMount = apolloProvider => ({ target }) => {
+const handleMRPopoverMount = ({ apolloProvider, projectPath, mrTitle, iid }) => ({ target }) => {
   // Add listener to actually remove it again
   target.addEventListener('mouseleave', handleUserPopoverMouseOut);
 
-  const { projectPath, mrTitle, iid } = target.dataset;
-  const mergeRequest = {};
-
   renderFn = setTimeout(() => {
     const MRPopoverComponent = Vue.extend(MRPopover);
     renderedPopover = new MRPopoverComponent({
@@ -36,7 +33,6 @@ const handleMRPopoverMount = apolloProvider => ({ target }) => {
         target,
         projectPath,
         mergeRequestIID: iid,
-        mergeRequest,
         mergeRequestTitle: mrTitle,
       },
       apolloProvider,
@@ -57,8 +53,13 @@ export default elements => {
     const listenerAddedAttr = 'data-mr-listener-added';
 
     mrLinks.forEach(el => {
-      if (!el.getAttribute(listenerAddedAttr)) {
-        el.addEventListener('mouseenter', handleMRPopoverMount(apolloProvider));
+      const { projectPath, mrTitle, iid } = el.dataset;
+
+      if (!el.getAttribute(listenerAddedAttr) && projectPath && mrTitle && iid) {
+        el.addEventListener(
+          'mouseenter',
+          handleMRPopoverMount({ apolloProvider, projectPath, mrTitle, iid }),
+        );
         el.setAttribute(listenerAddedAttr, true);
       }
     });
diff --git a/app/helpers/markup_helper.rb b/app/helpers/markup_helper.rb
index be4fc2531ae..ad77f99fe44 100644
--- a/app/helpers/markup_helper.rb
+++ b/app/helpers/markup_helper.rb
@@ -83,7 +83,8 @@ module MarkupHelper
     text = sanitize(
       text,
       tags: tags,
-      attributes: Rails::Html::WhiteListSanitizer.allowed_attributes + ['style', 'data-src', 'data-name', 'data-unicode-version']
+      attributes: Rails::Html::WhiteListSanitizer.allowed_attributes +
+          %w(style data-src data-name data-unicode-version data-iid data-project-path data-mr-title)
     )
 
     # since <img> tags are stripped, this can leave empty <a> tags hanging around