1 files changed, 18 insertions, 3 deletions
diff --git a/app/assets/javascripts/behaviors/markdown/render_gfm.js b/app/assets/javascripts/behaviors/markdown/render_gfm.js
index 01627b7206d..5e9d80e1529 100644
--- a/app/assets/javascripts/behaviors/markdown/render_gfm.js
+++ b/app/assets/javascripts/behaviors/markdown/render_gfm.js
@@ -5,7 +5,6 @@ import renderMermaid from './render_mermaid';
 import renderMetrics from './render_metrics';
 import highlightCurrentUser from './highlight_current_user';
 import initUserPopovers from '../../user_popovers';
-import initMRPopovers from '../../mr_popover';
 
 // Render GitLab flavoured Markdown
 //
@@ -17,9 +16,25 @@ $.fn.renderGFM = function renderGFM() {
   renderMermaid(this.find('.js-render-mermaid'));
   highlightCurrentUser(this.find('.gfm-project_member').get());
   initUserPopovers(this.find('.js-user-link').get());
-  initMRPopovers(this.find('.gfm-merge_request').get());
+
+  const mrPopoverElements = this.find('.gfm-merge_request').get();
+  if (mrPopoverElements.length) {
+    import(/* webpackChunkName: 'MrPopoverBundle' */ '../../mr_popover')
+      .then(({ default: initMRPopovers }) => {
+        initMRPopovers(mrPopoverElements);
+      })
+      .catch(() => {});
+  }
+
   renderMetrics(this.find('.js-render-metrics').get());
   return this;
 };
 
-$(() => $('body').renderGFM());
+$(() => {
+  window.requestIdleCallback(
+    () => {
+      $('body').renderGFM();
+    },
+    { timeout: 500 },
+  );
+});