Add latest changes from gitlab-org/gitlab@master

1 files changed, 24 insertions, 2 deletions

diff --git a/app/assets/javascripts/user_popovers.js b/app/assets/javascripts/user_popovers.js
index c18f4fb46cc..682932f6750 100644
--- a/app/assets/javascripts/user_popovers.js
+++ b/app/assets/javascripts/user_popovers.js
@@ -59,11 +59,33 @@ const populateUserInfo = (user) => {
 };
 
 const initializedPopovers = new Map();
+let domObservedForChanges = false;
 
-export default (elements = document.querySelectorAll('.js-user-link')) => {
+const addPopoversToModifiedTree = new MutationObserver(() => {
+  const userLinks = document?.querySelectorAll('.js-user-link, .gfm-project_member');
+
+  if (userLinks) {
+    addPopovers(userLinks); /* eslint-disable-line no-use-before-define */
+  }
+});
+
+function observeBody() {
+  if (!domObservedForChanges) {
+    addPopoversToModifiedTree.observe(document.body, {
+      subtree: true,
+      childList: true,
+    });
+
+    domObservedForChanges = true;
+  }
+}
+
+export default function addPopovers(elements = document.querySelectorAll('.js-user-link')) {
   const userLinks = Array.from(elements);
   const UserPopoverComponent = Vue.extend(UserPopover);
 
+  observeBody();
+
   return userLinks
     .filter(({ dataset }) => dataset.user || dataset.userId)
     .map((el) => {
@@ -105,4 +127,4 @@ export default (elements = document.querySelectorAll('.js-user-link')) => {
 
       return renderedPopover;
     });
-};
+}