Use webpack to require files

Changes after review

11 files changed, 42 insertions, 44 deletions

diff --git a/app/assets/javascripts/commit/pipelines/pipelines_bundle.js.es6 b/app/assets/javascripts/commit/pipelines/pipelines_bundle.js.es6
index 3a06e41848b..fbfec7743c7 100644
--- a/app/assets/javascripts/commit/pipelines/pipelines_bundle.js.es6
+++ b/app/assets/javascripts/commit/pipelines/pipelines_bundle.js.es6
@@ -2,8 +2,6 @@
 /* global Vue, CommitsPipelineStore, PipelinesService, Flash */
 
 window.Vue = require('vue');
-require('./pipelines_store');
-require('./pipelines_service');
 require('./pipelines_table');
 /**
  * Commits View > Pipelines Tab > Pipelines Table.
diff --git a/app/assets/javascripts/commit/pipelines/pipelines_service.js.es6 b/app/assets/javascripts/commit/pipelines/pipelines_service.js.es6
index ef3902fba50..483b414126a 100644
--- a/app/assets/javascripts/commit/pipelines/pipelines_service.js.es6
+++ b/app/assets/javascripts/commit/pipelines/pipelines_service.js.es6
@@ -18,7 +18,7 @@ class PipelinesService {
    *
    * @return {Promise}
    */
-  get() {
+  all() {
     return this.pipelines.get();
   }
 }
diff --git a/app/assets/javascripts/commit/pipelines/pipelines_store.js.es6 b/app/assets/javascripts/commit/pipelines/pipelines_store.js.es6
index 178e7bc9cd7..f1b41911b73 100644
--- a/app/assets/javascripts/commit/pipelines/pipelines_store.js.es6
+++ b/app/assets/javascripts/commit/pipelines/pipelines_store.js.es6
@@ -44,4 +44,7 @@ class PipelinesStore {
   }
 }
 
-return PipelinesStore;
+window.gl = window.gl || {};
+gl.commits = gl.commits || {};
+gl.commits.pipelines = gl.commits.pipelines || {};
+gl.commits.pipelines.PipelinesStore = PipelinesStore;
diff --git a/app/assets/javascripts/commit/pipelines/pipelines_table.js.es6 b/app/assets/javascripts/commit/pipelines/pipelines_table.js.es6
index 93fca933b0d..ce0dbd4d56b 100644
--- a/app/assets/javascripts/commit/pipelines/pipelines_table.js.es6
+++ b/app/assets/javascripts/commit/pipelines/pipelines_table.js.es6
@@ -3,9 +3,12 @@
 
 window.Vue = require('vue');
 window.Vue.use(require('vue-resource'));
+require('../../lib/utils/common_utils');
 require('../../vue_shared/vue_resource_interceptor');
 require('../../vue_shared/components/pipelines_table');
-require('../vue_realtime_listener/index');
+require('../../vue_realtime_listener/index');
+require('./pipelines_service');
+require('./pipelines_store');
 
 /**
  *
@@ -62,10 +65,10 @@ require('../vue_realtime_listener/index');
      *
      */
     created() {
-      gl.pipelines.pipelinesService = new PipelinesService(this.endpoint);
+      const pipelinesService = new gl.commits.pipelines.PipelinesService(this.endpoint);
 
       this.isLoading = true;
-      return gl.pipelines.pipelinesService.all()
+      return pipelinesService.all()
         .then(response => response.json())
         .then((json) => {
           this.store.storePipelines(json);
diff --git a/app/assets/javascripts/lib/utils/common_utils.js.es6 b/app/assets/javascripts/lib/utils/common_utils.js.es6
index cde48474906..0ee29a75c62 100644
--- a/app/assets/javascripts/lib/utils/common_utils.js.es6
+++ b/app/assets/javascripts/lib/utils/common_utils.js.es6
@@ -233,6 +233,9 @@
 
     /**
      * Transforms a DOMStringMap into a plain object.
+     *
+     * @param {DOMStringMap} DOMStringMapObject
+     * @returns {Object}
      */
     w.gl.utils.DOMStringMapToObject = DOMStringMapObject => Object.keys(DOMStringMapObject).reduce((acc, element) => {
       acc[element] = DOMStringMapObject[element];
diff --git a/app/assets/javascripts/vue_pipelines_index/index.js.es6 b/app/assets/javascripts/vue_pipelines_index/index.js.es6
index 9acb22d937f..e7432afb56e 100644
--- a/app/assets/javascripts/vue_pipelines_index/index.js.es6
+++ b/app/assets/javascripts/vue_pipelines_index/index.js.es6
@@ -2,39 +2,35 @@
 /* global Vue, VueResource, gl */
 window.Vue = require('vue');
 window.Vue.use(require('vue-resource'));
+require('../lib/utils/common_utils');
 require('../vue_shared/vue_resource_interceptor');
 require('./pipelines');
 
-$(() => {
-  return new Vue({
-    el: document.querySelector('.vue-pipelines-index'),
+$(() => new Vue({
+  el: document.querySelector('.vue-pipelines-index'),
 
-    data() {
-      const project = document.querySelector('.pipelines');
-      const svgs = document.querySelector('.pipeline-svgs').dataset;
+  data() {
+    const project = document.querySelector('.pipelines');
+    const svgs = document.querySelector('.pipeline-svgs').dataset;
 
-      // Transform svgs DOMStringMap to a plain Object.
-      const svgsObject = Object.keys(svgs).reduce((acc, element) => {
-        acc[element] = svgs[element];
-        return acc;
-      }, {});
+    // Transform svgs DOMStringMap to a plain Object.
+    const svgsObject = gl.utils.DOMStringMapToObject(svgs);
 
-      return {
-        scope: project.dataset.url,
-        store: new gl.PipelineStore(),
-        svgs: svgsObject,
-      };
-    },
-    components: {
-      'vue-pipelines': gl.VuePipelines,
-    },
-    template: `
-      <vue-pipelines
-        :scope='scope'
-        :store='store'
-        :svgs='svgs'
-      >
-      </vue-pipelines>
-    `,
-  });
-});
+    return {
+      scope: project.dataset.url,
+      store: new gl.PipelineStore(),
+      svgs: svgsObject,
+    };
+  },
+  components: {
+    'vue-pipelines': gl.VuePipelines,
+  },
+  template: `
+    <vue-pipelines
+      :scope='scope'
+      :store='store'
+      :svgs='svgs'
+    >
+    </vue-pipelines>
+  `,
+}));
diff --git a/app/assets/javascripts/vue_shared/components/commit.js.es6 b/app/assets/javascripts/vue_shared/components/commit.js.es6
index 4adad7bea31..7f7c18ddeb1 100644
--- a/app/assets/javascripts/vue_shared/components/commit.js.es6
+++ b/app/assets/javascripts/vue_shared/components/commit.js.es6
@@ -1,7 +1,5 @@
 /* global Vue */
 
-window.Vue = require('vue');
-
 (() => {
   window.gl = window.gl || {};
 
diff --git a/app/assets/javascripts/vue_shared/components/pipelines_table.js.es6 b/app/assets/javascripts/vue_shared/components/pipelines_table.js.es6
index e4176252c8f..4bdaef31ee9 100644
--- a/app/assets/javascripts/vue_shared/components/pipelines_table.js.es6
+++ b/app/assets/javascripts/vue_shared/components/pipelines_table.js.es6
@@ -1,7 +1,6 @@
 /* eslint-disable no-param-reassign */
 /* global Vue */
 
-window.Vue = require('vue');
 require('./pipelines_table_row');
 /**
  * Pipelines Table Component.
diff --git a/app/assets/javascripts/vue_shared/components/pipelines_table_row.js.es6 b/app/assets/javascripts/vue_shared/components/pipelines_table_row.js.es6
index 8707ab5d3e0..c819f0dd7cd 100644
--- a/app/assets/javascripts/vue_shared/components/pipelines_table_row.js.es6
+++ b/app/assets/javascripts/vue_shared/components/pipelines_table_row.js.es6
@@ -1,7 +1,6 @@
 /* eslint-disable no-param-reassign */
 /* global Vue */
 
-window.Vue = require('vue');
 require('../../vue_pipelines_index/status');
 require('../../vue_pipelines_index/pipeline_url');
 require('../../vue_pipelines_index/stage');
diff --git a/app/views/projects/commit/_pipelines_list.haml b/app/views/projects/commit/_pipelines_list.haml
index bfe5eb18ad1..aae2cb8a04b 100644
--- a/app/views/projects/commit/_pipelines_list.haml
+++ b/app/views/projects/commit/_pipelines_list.haml
@@ -22,4 +22,4 @@
 } }
 
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_tag('commit/pipelines/pipelines_bundle.js')
+  = page_specific_javascript_bundle_tag('commit_pipelines')
diff --git a/app/views/projects/pipelines/index.html.haml b/app/views/projects/pipelines/index.html.haml
index 58e76afa09a..81e393d7626 100644
--- a/app/views/projects/pipelines/index.html.haml
+++ b/app/views/projects/pipelines/index.html.haml
@@ -60,5 +60,4 @@
 
       .vue-pipelines-index
 
-- content_for :page_specific_javascripts do
-  = page_specific_javascript_tag('vue_pipelines_index/index.js')
+= page_specific_javascript_bundle_tag('vue_pipelines')