Add latest changes from gitlab-org/gitlab@master

2 files changed, 22 insertions, 4 deletions

diff --git a/app/assets/javascripts/behaviors/index.js b/app/assets/javascripts/behaviors/index.js
index 8060938c72a..fd12c282b62 100644
--- a/app/assets/javascripts/behaviors/index.js
+++ b/app/assets/javascripts/behaviors/index.js
@@ -1,7 +1,7 @@
+import $ from 'jquery';
 import './autosize';
 import './bind_in_out';
 import './markdown/render_gfm';
-import initGFMInput from './markdown/gfm_auto_complete';
 import initCopyAsGFM from './markdown/copy_as_gfm';
 import initCopyToClipboard from './copy_to_clipboard';
 import './details_behavior';
@@ -15,9 +15,27 @@ import initCollapseSidebarOnWindowResize from './collapse_sidebar_on_window_resi
 import initSelect2Dropdowns from './select2';
 
 installGlEmojiElement();
-initGFMInput();
+
 initCopyAsGFM();
 initCopyToClipboard();
+
 initPageShortcuts();
 initCollapseSidebarOnWindowResize();
 initSelect2Dropdowns();
+
+document.addEventListener('DOMContentLoaded', () => {
+  window.requestIdleCallback(
+    () => {
+      // Check if we have to Load GFM Input
+      const $gfmInputs = $('.js-gfm-input:not(.js-gfm-input-initialized)');
+      if ($gfmInputs.length) {
+        import(/* webpackChunkName: 'initGFMInput' */ './markdown/gfm_auto_complete')
+          .then(({ default: initGFMInput }) => {
+            initGFMInput($gfmInputs);
+          })
+          .catch(() => {});
+      }
+    },
+    { timeout: 500 },
+  );
+});
diff --git a/app/assets/javascripts/behaviors/markdown/gfm_auto_complete.js b/app/assets/javascripts/behaviors/markdown/gfm_auto_complete.js
index 6bbd2133344..83f2ca0bdc2 100644
--- a/app/assets/javascripts/behaviors/markdown/gfm_auto_complete.js
+++ b/app/assets/javascripts/behaviors/markdown/gfm_auto_complete.js
@@ -2,8 +2,8 @@ import $ from 'jquery';
 import GfmAutoComplete from 'ee_else_ce/gfm_auto_complete';
 import { parseBoolean } from '~/lib/utils/common_utils';
 
-export default function initGFMInput() {
-  $('.js-gfm-input:not(.js-vue-textarea)').each((i, el) => {
+export default function initGFMInput($els) {
+  $els.each((i, el) => {
     const gfm = new GfmAutoComplete(gl.GfmAutoComplete && gl.GfmAutoComplete.dataSources);
     const enableGFM = parseBoolean(el.dataset.supportsAutocomplete);