Use dynamic imports in dispatcher (EE)

app/assets/javascripts/dispatcher.js

@@ -56,6 +56,10 @@ var Dispatcher;
         case 'projects:activity':
         case 'projects:commits:show':
         case 'projects:show':
+        case 'groups:show':
+        case 'projects:find_file:show':
+        case 'projects:blob:show':
+        case 'projects:blame:show':
           shortcut_handler = true;
           break;
         case 'projects:edit':
@@ -63,66 +67,8 @@ var Dispatcher;
             .then(callDefault)
             .catch(fail);
           break;
-        case 'groups:activity':
-          import('./pages/groups/activity')
-            .then(callDefault)
-            .catch(fail);
-          break;
-        case 'groups:show':
-          shortcut_handler = true;
-          break;
-        case 'groups:group_members:index':
-          import('./pages/groups/group_members/index')
-            .then(callDefault)
-            .catch(fail);
-          break;
-        case 'projects:project_members:index':
-          import('./pages/projects/project_members')
-            .then(callDefault)
-            .catch(fail);
-          break;
-        case 'groups:create':
-        case 'groups:new':
-          import('./pages/groups/new')
-            .then(callDefault)
-            .catch(fail);
-          break;
-        case 'groups:edit':
-          import('./pages/groups/edit')
-            .then(callDefault)
-            .catch(fail);
-          break;
-        case 'admin:groups:create':
-        case 'admin:groups:new':
-          import('./pages/admin/groups/new')
-            .then(callDefault)
-            .catch(fail);
-          break;
-        case 'admin:groups:edit':
-          import('./pages/admin/groups/edit')
-            .then(callDefault)
-            .catch(fail);
-          break;
         case 'projects:tree:show':
-          import('./pages/projects/tree/show')
-            .then(callDefault)
-            .catch(fail);
-          shortcut_handler = true;
-          break;
-        case 'projects:find_file:show':
-          import('./pages/projects/find_file/show')
-            .then(callDefault)
-            .catch(fail);
-          shortcut_handler = true;
-          break;
-        case 'projects:blob:show':
-          import('./pages/projects/blob/show')
-            .then(callDefault)
-            .catch(fail);
-          shortcut_handler = true;
-          break;
-        case 'projects:blame:show':
-          import('./pages/projects/blame/show')
+          import(/* webpackChunkName: "ee_projects_edit" */ 'ee/pages/projects/tree/show')
             .then(callDefault)
             .catch(fail);
           shortcut_handler = true;

app/assets/javascripts/pages/admin/groups/edit/index.js

-import groupAvatar from '../../../../group_avatar';
+import groupAvatar from '~/group_avatar';
 
-export default () => groupAvatar();
+document.addEventListener('DOMContentLoaded', groupAvatar);

app/assets/javascripts/pages/admin/groups/new/index.js

@@ -2,8 +2,8 @@ import BindInOut from '../../../../behaviors/bind_in_out';
 import Group from '../../../../group';
 import groupAvatar from '../../../../group_avatar';
 
-export default () => {
+document.addEventListener('DOMContentLoaded', () => {
   BindInOut.initAll();
   new Group(); // eslint-disable-line no-new
   groupAvatar();
-};
+});

app/assets/javascripts/pages/groups/activity/index.js

 import Activities from '~/activities';
 
-export default () => new Activities();
+document.addEventListener('DOMContentLoaded', () => new Activities());

app/assets/javascripts/pages/groups/edit/index.js

 import groupAvatar from '~/group_avatar';
 import TransferDropdown from '~/groups/transfer_dropdown';
 
-export default () => {
+document.addEventListener('DOMContentLoaded', () => {
   groupAvatar();
   new TransferDropdown(); // eslint-disable-line no-new
-};
+});

app/assets/javascripts/pages/groups/group_members/index/index.js

@@ -4,8 +4,8 @@ import memberExpirationDate from '~/member_expiration_date';
 import Members from '~/members';
 import UsersSelect from '~/users_select';
 
-export default () => {
+document.addEventListener('DOMContentLoaded', () => {
   memberExpirationDate();
   new Members();
   new UsersSelect();
-};
+});

app/assets/javascripts/pages/groups/new/index.js

@@ -2,8 +2,8 @@ import BindInOut from '~/behaviors/bind_in_out';
 import Group from '~/group';
 import groupAvatar from '~/group_avatar';
 
-export default () => {
+document.addEventListener('DOMContentLoaded', () => {
   BindInOut.initAll();
   new Group(); // eslint-disable-line no-new
   groupAvatar();
-};
+});

app/assets/javascripts/pages/projects/blame/show/index.js

 import initBlob from '~/pages/projects/init_blob';
 
-export default initBlob;
+document.addEventListener('DOMContentLoaded', initBlob);

app/assets/javascripts/pages/projects/blob/show/index.js

 import BlobViewer from '~/blob/viewer/index';
 import initBlob from '~/pages/projects/init_blob';
 
-export default () => {
+document.addEventListener('DOMContentLoaded', () => {
   new BlobViewer(); // eslint-disable-line no-new
   initBlob();
-};
+});

app/assets/javascripts/pages/projects/find_file/show/index.js

 import ProjectFindFile from '~/project_find_file';
 import ShortcutsFindFile from '~/shortcuts_find_file';
 
-export default () => {
+document.addEventListener('DOMContentLoaded', () => {
   const findElement = document.querySelector('.js-file-finder');
   const projectFindFile = new ProjectFindFile($('.file-finder-holder'), {
     url: findElement.dataset.fileFindUrl,
@@ -9,4 +9,4 @@ export default () => {
     blobUrlTemplate: findElement.dataset.blobUrlTemplate,
   });
   new ShortcutsFindFile(projectFindFile); // eslint-disable-line no-new
-};
+});

app/assets/javascripts/pages/projects/project_members/index.js

@@ -3,10 +3,10 @@ import UsersSelect from '../../../users_select';
 import groupsSelect from '../../../groups_select';
 import Members from '../../../members';
 
-export default () => {
+document.addEventListener('DOMContentLoaded', () => {
   memberExpirationDate('.js-access-expiration-date-groups');
   groupsSelect();
   memberExpirationDate();
   new Members(); // eslint-disable-line no-new
   new UsersSelect(); // eslint-disable-line no-new
-};
+});

app/assets/javascripts/pages/projects/tree/show/index.js

-import initPathLocks from 'ee/path_locks';
 import Vue from 'vue';
 import commitPipelineStatus from '~/projects/tree/components/commit_pipeline_status_component.vue';
 import TreeView from '../../../../tree';
@@ -7,7 +6,7 @@ import BlobViewer from '../../../../blob/viewer';
 import NewCommitForm from '../../../../new_commit_form';
 import { ajaxGet } from '../../../../lib/utils/common_utils';
 
-export default () => {
+document.addEventListener('DOMContentLoaded', () => {
   new ShortcutsNavigation(); // eslint-disable-line no-new
   new TreeView(); // eslint-disable-line no-new
   new BlobViewer(); // eslint-disable-line no-new
@@ -34,11 +33,4 @@ export default () => {
       },
     });
   }
-
-  if (document.querySelector('.js-tree-content').dataset.pathLocksAvailable === 'true') {
-    initPathLocks(
-      document.querySelector('.js-tree-content').dataset.pathLocksToggle,
-      document.querySelector('.js-tree-content').dataset.pathLocksPath,
-    );
-  }
-};
+});

ee/app/assets/javascripts/pages/projects/tree/show/index.js

+import '~/pages/projects/tree/show/index';
+import initPathLocks from 'ee/path_locks';
+
+document.addEventListener('DOMContentLoaded', () => {
+  if (document.querySelector('.js-tree-content').dataset.pathLocksAvailable === 'true') {
+    initPathLocks(
+      document.querySelector('.js-tree-content').dataset.pathLocksToggle,
+      document.querySelector('.js-tree-content').dataset.pathLocksPath,
+    );
+  }
+});