Merge branch 'master' into issues-modal-filters

.eslintignore

+/builds/
 /coverage/
 /coverage-javascript/
 /node_modules/
 /public/
 /tmp/
 /vendor/
-/builds/
+karma.config.js
+webpack.config.js

.eslintrc

@@ -16,6 +16,8 @@
   ],
   "rules": {
     "filenames/match-regex": [2, "^[a-z0-9_]+(.js)?$"],
-    "no-multiple-empty-lines": ["error", { "max": 1 }]
+    "no-multiple-empty-lines": ["error", { "max": 1 }],
+    "import/no-extraneous-dependencies": "off",
+    "import/no-unresolved": "off"
   }
 }

.gitlab-ci.yml

@@ -107,11 +107,13 @@ setup-test-env:
   <<: *dedicated-runner
   stage: prepare
   script:
-    - bundle exec rake gitlab:assets:compile 2>/dev/null
+    - npm install
+    - bundle exec rake gitlab:assets:compile
     - bundle exec ruby -Ispec -e 'require "spec_helper" ; TestEnv.init'
   artifacts:
     expire_in: 7d
     paths:
+      - node_modules
       - public/assets
       - tmp/tests
 
@@ -232,7 +234,7 @@ spinach 9 10 ruby21: *spinach-knapsack-ruby21
   script:
     - bundle exec $CI_BUILD_NAME
 
-rubocop: 
+rubocop:
   <<: *ruby-static-analysis
   <<: *dedicated-runner
   stage: test
@@ -291,18 +293,17 @@ rake db:seed_fu:
     paths:
       - log/development.log
 
-teaspoon:
+karma:
   cache:
     paths:
       - vendor/ruby
-      - node_modules/
+      - node_modules
   stage: test
   <<: *use-db
   <<: *dedicated-runner
   script:
-    - npm install
     - npm link istanbul
-    - bundle exec rake teaspoon
+    - bundle exec rake karma
   artifacts:
     name: coverage-javascript
     expire_in: 31d
@@ -444,7 +445,7 @@ pages:
   <<: *dedicated-runner
   dependencies:
     - coverage
-    - teaspoon
+    - karma
     - lint:javascript:report
   script:
     - mv public/ .public/

CONTRIBUTING.md

@@ -88,6 +88,27 @@ contributing to GitLab.
 
 Please see the [UX Guide for GitLab].
 
+## Release retrospective and kickoff
+
+### Retrospective
+
+After each release (usually on the 22nd of each month), we have a retrospective
+call where we discuss what went well, what went wrong, and what we can improve
+for the next release. The [retrospective notes] are public and you are invited
+to comment them.
+If you're interested, you can even join the [retrospective call][retro-kickoff-call].
+
+### Kickoff
+
+Before working on the next release (usually on the 8th of each month), we have a
+kickoff call to explain what we expect to ship in the next release. The
+[kickoff notes] are public and you are invited to comment them.
+If you're interested, you can even join the [kickoff call][retro-kickoff-call].
+
+[retrospective notes]: https://docs.google.com/document/d/1nEkM_7Dj4bT21GJy0Ut3By76FZqCfLBmFQNVThmW2TY/edit?usp=sharing
+[kickoff notes]: https://docs.google.com/document/d/1ElPkZ90A8ey_iOkTvUs_ByMlwKK6NAB2VOK5835wYK0/edit?usp=sharing
+[retro-kickoff-call]: https://gitlab.zoom.us/j/918821206
+
 ## Issue tracker
 
 To get support for your particular problem please use the

Gemfile

@@ -7,7 +7,6 @@ gem 'rails-deprecated_sanitizer', '~> 1.0.3'
 gem 'responders', '~> 2.0'
 
 gem 'sprockets', '~> 3.7.0'
-gem 'sprockets-es6', '~> 0.9.2'
 
 # Default values for AR models
 gem 'default_value_for', '~> 3.0.0'
@@ -219,6 +218,9 @@ gem 'oj', '~> 2.17.4'
 gem 'chronic', '~> 0.10.2'
 gem 'chronic_duration', '~> 0.10.6'
 
+gem 'webpack-rails', '~> 0.9.9'
+gem 'rack-proxy', '~> 0.6.0'
+
 gem 'sass-rails', '~> 5.0.6'
 gem 'coffee-rails', '~> 4.1.0'
 gem 'uglifier', '~> 2.7.2'
@@ -291,13 +293,9 @@ group :development, :test do
   gem 'capybara-screenshot', '~> 1.0.0'
   gem 'poltergeist',         '~> 1.9.0'
 
-  gem 'teaspoon', '~> 1.1.0'
-  gem 'teaspoon-jasmine', '~> 2.2.0'
-
   gem 'spring',                   '~> 1.7.0'
   gem 'spring-commands-rspec',    '~> 1.0.4'
   gem 'spring-commands-spinach',  '~> 1.1.0'
-  gem 'spring-commands-teaspoon', '~> 0.0.2'
 
   gem 'rubocop', '~> 0.46.0', require: false
   gem 'rubocop-rspec', '~> 1.9.1', require: false

Gemfile.lock

@@ -72,10 +72,6 @@ GEM
       descendants_tracker (~> 0.0.4)
       ice_nine (~> 0.11.0)
       thread_safe (~> 0.3, >= 0.3.1)
-    babel-source (5.8.35)
-    babel-transpiler (0.7.0)
-      babel-source (>= 4.0, < 6)
-      execjs (~> 2.0)
     babosa (1.0.2)
     base32 (0.3.2)
     bcrypt (3.1.11)
@@ -546,6 +542,8 @@ GEM
       rack (>= 1.1)
     rack-protection (1.5.3)
       rack
+    rack-proxy (0.6.0)
+      rack
     rack-test (0.6.3)
       rack (>= 1.0)
     rails (4.2.7.1)
@@ -733,15 +731,9 @@ GEM
       spring (>= 0.9.1)
     spring-commands-spinach (1.1.0)
       spring (>= 0.9.1)
-    spring-commands-teaspoon (0.0.2)
-      spring (>= 0.9.1)
     sprockets (3.7.0)
       concurrent-ruby (~> 1.0)
       rack (> 1, < 3)
-    sprockets-es6 (0.9.2)
-      babel-source (>= 5.8.11)
-      babel-transpiler
-      sprockets (>= 3.0.0)
     sprockets-rails (3.1.1)
       actionpack (>= 4.0)
       activesupport (>= 4.0)
@@ -759,10 +751,6 @@ GEM
     sys-filesystem (1.1.6)
       ffi
     sysexits (1.2.0)
-    teaspoon (1.1.5)
-      railties (>= 3.2.5, < 6)
-    teaspoon-jasmine (2.2.0)
-      teaspoon (>= 1.0.0)
     temple (0.7.7)
     test_after_commit (1.1.0)
       activerecord (>= 3.2)
@@ -814,6 +802,8 @@ GEM
     webmock (1.21.0)
       addressable (>= 2.3.6)
       crack (>= 0.3.2)
+    webpack-rails (0.9.9)
+      rails (>= 3.2.0)
     websocket-driver (0.6.3)
       websocket-extensions (>= 0.1.0)
     websocket-extensions (0.1.2)
@@ -952,6 +942,7 @@ DEPENDENCIES
   rack-attack (~> 4.4.1)
   rack-cors (~> 0.4.0)
   rack-oauth2 (~> 1.2.1)
+  rack-proxy (~> 0.6.0)
   rails (= 4.2.7.1)
   rails-deprecated_sanitizer (~> 1.0.3)
   rainbow (~> 2.1.0)
@@ -993,14 +984,10 @@ DEPENDENCIES
   spring (~> 1.7.0)
   spring-commands-rspec (~> 1.0.4)
   spring-commands-spinach (~> 1.1.0)
-  spring-commands-teaspoon (~> 0.0.2)
   sprockets (~> 3.7.0)
-  sprockets-es6 (~> 0.9.2)
   stackprof (~> 0.2.10)
   state_machines-activerecord (~> 0.4.0)
   sys-filesystem (~> 1.1.6)
-  teaspoon (~> 1.1.0)
-  teaspoon-jasmine (~> 2.2.0)
   test_after_commit (~> 1.1)
   thin (~> 1.7.0)
   timecop (~> 0.8.0)
@@ -1016,6 +1003,7 @@ DEPENDENCIES
   vmstat (~> 2.3.0)
   web-console (~> 2.0)
   webmock (~> 1.21.0)
+  webpack-rails (~> 0.9.9)
   wikicloth (= 0.8.1)
 
 BUNDLED WITH

app/assets/javascripts/application.js

-/* eslint-disable func-names, space-before-function-paren, no-var, quotes, consistent-return, prefer-arrow-callback, comma-dangle, object-shorthand, no-new, max-len */
+/* eslint-disable func-names, space-before-function-paren, no-var, quotes, consistent-return, prefer-arrow-callback, comma-dangle, object-shorthand, no-new, max-len, no-multi-spaces, import/newline-after-import */
 /* global bp */
 /* global Cookies */
 /* global Flash */
@@ -6,60 +6,57 @@
 /* global AwardsHandler */
 /* global Aside */
 
-// This is a manifest file that'll be compiled into including all the files listed below.
-// Add new JavaScript code in separate files in this directory and they'll automatically
-// be included in the compiled file accessible from http://example.com/assets/application.js
-// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
-// the compiled file.
-//
-/*= require jquery2 */
-/*= require jquery-ui/autocomplete */
-/*= require jquery-ui/datepicker */
-/*= require jquery-ui/draggable */
-/*= require jquery-ui/effect-highlight */
-/*= require jquery-ui/sortable */
-/*= require jquery_ujs */
-/*= require jquery.endless-scroll */
-/*= require jquery.highlight */
-/*= require jquery.waitforimages */
-/*= require jquery.atwho */
-/*= require jquery.scrollTo */
-/*= require js.cookie */
-/*= require autosave */
-/*= require bootstrap/affix */
-/*= require bootstrap/alert */
-/*= require bootstrap/button */
-/*= require bootstrap/collapse */
-/*= require bootstrap/dropdown */
-/*= require bootstrap/modal */
-/*= require bootstrap/scrollspy */
-/*= require bootstrap/tab */
-/*= require bootstrap/transition */
-/*= require bootstrap/tooltip */
-/*= require bootstrap/popover */
-/*= require select2 */
-/*= require underscore */
-/*= require dropzone */
-/*= require mousetrap */
-/*= require mousetrap/pause */
-/*= require shortcuts */
-/*= require shortcuts_navigation */
-/*= require shortcuts_dashboard_navigation */
-/*= require shortcuts_issuable */
-/*= require shortcuts_network */
-/*= require jquery.nicescroll */
-/*= require date.format */
-/*= require_directory ./behaviors */
-/*= require_directory ./blob */
-/*= require_directory ./templates */
-/*= require_directory ./commit */
-/*= require_directory ./extensions */
-/*= require_directory ./lib/utils */
-/*= require_directory ./u2f */
-/*= require_directory ./droplab */
-/*= require_directory . */
-/*= require fuzzaldrin-plus */
-/*= require es6-promise.auto */
+function requireAll(context) { return context.keys().map(context); }
+
+window.$ = window.jQuery = require('jquery');
+require('jquery-ui/ui/autocomplete');
+require('jquery-ui/ui/datepicker');
+require('jquery-ui/ui/draggable');
+require('jquery-ui/ui/effect-highlight');
+require('jquery-ui/ui/sortable');
+require('jquery-ujs');
+require('vendor/jquery.endless-scroll');
+require('vendor/jquery.highlight');
+require('vendor/jquery.waitforimages');
+require('vendor/jquery.caret');
+require('vendor/jquery.atwho');
+require('vendor/jquery.scrollTo');
+window.Cookies = require('vendor/js.cookie');
+require('./autosave');
+require('bootstrap/js/affix');
+require('bootstrap/js/alert');
+require('bootstrap/js/button');
+require('bootstrap/js/collapse');
+require('bootstrap/js/dropdown');
+require('bootstrap/js/modal');
+require('bootstrap/js/scrollspy');
+require('bootstrap/js/tab');
+require('bootstrap/js/transition');
+require('bootstrap/js/tooltip');
+require('bootstrap/js/popover');
+require('select2/select2.js');
+window._ = require('underscore');
+window.Dropzone = require('dropzone');
+require('mousetrap');
+require('mousetrap/plugins/pause/mousetrap-pause');
+require('./shortcuts');
+require('./shortcuts_navigation');
+require('./shortcuts_dashboard_navigation');
+require('./shortcuts_issuable');
+require('./shortcuts_network');
+require('vendor/jquery.nicescroll');
+requireAll(require.context('./behaviors',  false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./blob',       false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./templates',  false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./commit',     false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./extensions', false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./lib/utils',  false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./u2f',        false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./droplab',    false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('.',            false, /^\.\/(?!application\.js).*\.(js|es6)$/));
+require('vendor/fuzzaldrin-plus');
+window.ES6Promise = require('vendor/es6-promise.auto');
+window.ES6Promise.polyfill();
 
 (function () {
   document.addEventListener('beforeunload', function () {

app/assets/javascripts/awards_handler.js

 /* eslint-disable func-names, space-before-function-paren, wrap-iife, max-len, no-var, prefer-arrow-callback, consistent-return, one-var, one-var-declaration-per-line, no-unused-vars, no-else-return, prefer-template, quotes, comma-dangle, no-param-reassign, no-void, brace-style, no-underscore-dangle, no-return-assign, camelcase */
 /* global Cookies */
 
+var emojiAliases = require('emoji-aliases');
+
 (function() {
   this.AwardsHandler = (function() {
     var FROM_SENTENCE_REGEX = /(?:, and | and |, )/; // For separating lists produced by ruby's Array#toSentence
     function AwardsHandler() {
-      this.aliases = gl.emojiAliases();
+      this.aliases = emojiAliases;
       $(document).off('click', '.js-add-award').on('click', '.js-add-award', (function(_this) {
         return function(e) {
           e.stopPropagation();

app/assets/javascripts/behaviors/autosize.js

 /* eslint-disable func-names, space-before-function-paren, prefer-arrow-callback, no-var, consistent-return, max-len */
 /* global autosize */
 
-/*= require autosize */
+var autosize = require('vendor/autosize');
 
 (function() {
   $(function() {

app/assets/javascripts/behaviors/quick_submit.js

@@ -6,7 +6,7 @@
 // "Meta+Enter" (Mac) or "Ctrl+Enter" (Linux/Windows) key combination, the form
 // is submitted.
 //
-/*= require extensions/jquery */
+require('../extensions/jquery');
 
 //
 // ### Example Markup

app/assets/javascripts/behaviors/requires_input.js

@@ -4,7 +4,7 @@
 // When called on a form with input fields with the `required` attribute, the
 // form's submit button will be disabled until all required fields have values.
 //
-/*= require extensions/jquery */
+require('../extensions/jquery');
 
 //
 // ### Example Markup

app/assets/javascripts/blob/blob_ci_yaml.js.es6

 /* eslint-disable no-param-reassign, comma-dangle */
 /* global Api */
 
-/*= require blob/template_selector */
+require('./template_selector');
+
 ((global) => {
   class BlobCiYamlSelector extends gl.TemplateSelector {
     requestFile(query) {

app/assets/javascripts/blob/blob_dockerfile_selector.js.es6

 /* global Api */
-/*= require blob/template_selector */
+
+require('./template_selector');
 
 (() => {
   const global = window.gl || (window.gl = {});

app/assets/javascripts/blob/blob_gitignore_selector.js

 /* eslint-disable func-names, space-before-function-paren, max-len, one-var, no-var, no-restricted-syntax, vars-on-top, no-use-before-define, no-param-reassign, new-cap, no-underscore-dangle, wrap-iife, prefer-rest-params */
 /* global Api */
 
-/*= require blob/template_selector */
+require('./template_selector');
 
 (function() {
   var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },

app/assets/javascripts/blob/blob_license_selector.js

 /* eslint-disable func-names, space-before-function-paren, max-len, one-var, no-var, no-restricted-syntax, vars-on-top, no-use-before-define, no-param-reassign, new-cap, no-underscore-dangle, wrap-iife, prefer-rest-params, comma-dangle */
 /* global Api */
 
-/*= require blob/template_selector */
+require('./template_selector');
 
 (function() {
   var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },

app/assets/javascripts/blob_edit/blob_edit_bundle.js

@@ -2,7 +2,7 @@
 /* global EditBlob */
 /* global NewCommitForm */
 
-/*= require_tree . */
+require('./edit_blob');
 
 (function() {
   $(function() {

app/assets/javascripts/boards/boards_bundle.js.es6

-/* eslint-disable one-var, quote-props, comma-dangle, space-before-function-paren */
+/* eslint-disable one-var, quote-props, comma-dangle, space-before-function-paren, import/newline-after-import, no-multi-spaces, max-len */
 /* global Vue */
 /* global BoardService */
 
-//= require vue
-//= require vue-resource
-//= require Sortable
-//= require_tree ./models
-//= require_tree ./stores
-//= require_tree ./services
-//= require_tree ./mixins
-//= require_tree ./filters
-//= require ./components/board
-//= require ./components/board_sidebar
-//= require ./components/new_list_dropdown
-//= require ./components/modal/index
-//= require ./vue_resource_interceptor
+function requireAll(context) { return context.keys().map(context); }
+
+window.Vue = require('vue');
+window.Vue.use(require('vue-resource'));
+window.Sortable = require('vendor/Sortable');
+requireAll(require.context('./models',   true, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./stores',   true, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./services', true, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./mixins',   true, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./filters',  true, /^\.\/.*\.(js|es6)$/));
+require('./components/board');
+require('./components/board_sidebar');
+require('./components/new_list_dropdown');
+require('./components/modal/index');
+require('./vue_resource_interceptor');
 
 $(() => {
   const $boardApp = document.getElementById('board-app');
@@ -76,7 +78,7 @@ $(() => {
   });
 
   gl.IssueBoardsSearch = new Vue({
-    el: '#js-boards-search',
+    el: document.getElementById('js-boards-search'),
     data: {
       filters: Store.state.filters
     },
@@ -87,7 +89,7 @@ $(() => {
 
   gl.IssueBoardsModalAddBtn = new Vue({
     mixins: [gl.issueBoards.ModalMixins],
-    el: '#js-add-issues-btn',
+    el: document.getElementById('js-add-issues-btn'),
     data: {
       modal: ModalStore.store,
       store: Store.state,

app/assets/javascripts/boards/components/board.js.es6

@@ -2,9 +2,9 @@
 /* global Vue */
 /* global Sortable */
 
-//= require ./board_blank_state
-//= require ./board_delete
-//= require ./board_list
+require('./board_blank_state');
+require('./board_delete');
+require('./board_list');
 
 (() => {
   const Store = gl.issueBoards.BoardsStore;

app/assets/javascripts/boards/components/board_card.js.es6

 /* eslint-disable comma-dangle, space-before-function-paren, dot-notation */
-//= require ./issue_card_inner
 /* global Vue */
 
+require('./issue_card_inner');
+
 (() => {
   const Store = gl.issueBoards.BoardsStore;
 

app/assets/javascripts/boards/components/board_list.js.es6

@@ -2,8 +2,8 @@
 /* global Vue */
 /* global Sortable */
 
-//= require ./board_card
-//= require ./board_new_issue
+require('./board_card');
+require('./board_new_issue');
 
 (() => {
   const Store = gl.issueBoards.BoardsStore;

app/assets/javascripts/boards/components/board_sidebar.js.es6

@@ -4,7 +4,8 @@
 /* global MilestoneSelect */
 /* global LabelsSelect */
 /* global Sidebar */
-//= require ./sidebar/remove_issue
+
+require('./sidebar/remove_issue');
 
 (() => {
   const Store = gl.issueBoards.BoardsStore;

app/assets/javascripts/boards/components/modal/filters.js.es6

 /* global Vue */
-//= require_tree ./filters
-(() => {
-  const ModalStore = gl.issueBoards.ModalStore;
-
-  gl.issueBoards.ModalFilters = Vue.extend({
-    props: {
-      projectId: {
-        type: Number,
-        required: true,
-      },
-      milestonePath: {
-        type: String,
-        required: true,
-      },
-      labelPath: {
-        type: String,
-        required: true,
-      },
+module.exports = Vue.extend({
+  name: 'modal-filters',
+  props: {
+    projectId: {
+      type: Number,
+      required: true,
     },
-    destroyed() {
-      ModalStore.setDefaultFilter();
+    milestonePath: {
+      type: String,
+      required: true,
     },
-    components: {
-      'user-filter': gl.issueBoards.ModalFilterUser,
-      'milestone-filter': gl.issueBoards.ModalFilterMilestone,
-      'label-filter': gl.issueBoards.ModalLabelFilter,
+    labelPath: {
+      type: String,
+      required: true,
     },
-    template: `
-      <div class="modal-filters">
-        <user-filter
-          dropdown-class-name="dropdown-menu-author"
-          toggle-class-name="js-user-search js-author-search"
-          toggle-label="Author"
-          field-name="author_id"
-          :project-id="projectId"></user-filter>
-        <user-filter
-          dropdown-class-name="dropdown-menu-author"
-          toggle-class-name="js-assignee-search"
-          toggle-label="Assignee"
-          field-name="assignee_id"
-          :null-user="true"
-          :project-id="projectId"></user-filter>
-        <milestone-filter :milestone-path="milestonePath"></milestone-filter>
-        <label-filter :label-path="labelPath"></label-filter>
-      </div>
-    `,
-  });
-})();
+  },
+  destroyed() {
+    gl.issueBoards.ModalStore.setDefaultFilter();
+  },
+  components: {
+    'user-filter': require('./filters/user'),
+    'milestone-filter': require('./filters/milestone'),
+    'label-filter': require('./filters/label'),
+  },
+  template: `
+    <div class="modal-filters">
+      <user-filter
+        dropdown-class-name="dropdown-menu-author"
+        toggle-class-name="js-user-search js-author-search"
+        toggle-label="Author"
+        field-name="author_id"
+        :project-id="projectId"></user-filter>
+      <user-filter
+        dropdown-class-name="dropdown-menu-author"
+        toggle-class-name="js-assignee-search"
+        toggle-label="Assignee"
+        field-name="assignee_id"
+        :null-user="true"
+        :project-id="projectId"></user-filter>
+      <milestone-filter :milestone-path="milestonePath"></milestone-filter>
+      <label-filter :label-path="labelPath"></label-filter>
+    </div>
+  `,
+});

app/assets/javascripts/boards/components/modal/filters/label.js.es6

 /* eslint-disable no-new */
 /* global Vue */
 /* global LabelsSelect */
-(() => {
-  gl.issueBoards.ModalLabelFilter = Vue.extend({
-    props: {
-      labelPath: {
-        type: String,
-        required: true,
-      },
+module.exports = Vue.extend({
+  name: 'filter-label',
+  props: {
+    labelPath: {
+      type: String,
+      required: true,
     },
-    mounted() {
-      new LabelsSelect(this.$refs.dropdown);
-    },
-    template: `
-      <div class="dropdown">
-        <button
-          class="dropdown-menu-toggle js-label-select js-multiselect js-extra-options"
-          type="button"
-          data-toggle="dropdown"
-          data-show-any="true"
-          data-show-no="true"
-          :data-labels="labelPath"
-          ref="dropdown">
-          <span class="dropdown-toggle-text">
-            Label
-          </span>
-          <i class="fa fa-chevron-down"></i>
-        </button>
-        <div class="dropdown-menu dropdown-select dropdown-menu-paging dropdown-menu-labels dropdown-menu-selectable">
-          <div class="dropdown-title">
-            Filter by label
-            <button
-              class="dropdown-title-button dropdown-menu-close"
-              aria-label="Close"
-              type="button">
-              <i class="fa fa-times dropdown-menu-close-icon"></i>
-            </button>
-          </div>
-          <div class="dropdown-input">
-            <input
-              type="search"
-              class="dropdown-input-field"
-              placeholder="Search"
-              autocomplete="off" />
-            <i class="fa fa-search dropdown-input-search"></i>
-            <i role="button" class="fa fa-times dropdown-input-clear js-dropdown-input-clear"></i>
-          </div>
-          <div class="dropdown-content"></div>
-          <div class="dropdown-loading"><i class="fa fa-spinner fa-spin"></i></div>
+  },
+  mounted() {
+    new LabelsSelect(this.$refs.dropdown);
+  },
+  template: `
+    <div class="dropdown">
+      <button
+        class="dropdown-menu-toggle js-label-select js-multiselect js-extra-options"
+        type="button"
+        data-toggle="dropdown"
+        data-show-any="true"
+        data-show-no="true"
+        :data-labels="labelPath"
+        ref="dropdown">
+        <span class="dropdown-toggle-text">
+          Label
+        </span>
+        <i class="fa fa-chevron-down"></i>
+      </button>
+      <div class="dropdown-menu dropdown-select dropdown-menu-paging dropdown-menu-labels dropdown-menu-selectable">
+        <div class="dropdown-title">
+          Filter by label
+          <button
+            class="dropdown-title-button dropdown-menu-close"
+            aria-label="Close"
+            type="button">
+            <i class="fa fa-times dropdown-menu-close-icon"></i>
+          </button>
+        </div>
+        <div class="dropdown-input">
+          <input
+            type="search"
+            class="dropdown-input-field"
+            placeholder="Search"
+            autocomplete="off" />
+          <i class="fa fa-search dropdown-input-search"></i>
+          <i role="button" class="fa fa-times dropdown-input-clear js-dropdown-input-clear"></i>
         </div>
+        <div class="dropdown-content"></div>
+        <div class="dropdown-loading"><i class="fa fa-spinner fa-spin"></i></div>
       </div>
-    `,
-  });
-})();
+    </div>
+  `,
+});

app/assets/javascripts/boards/components/modal/filters/milestone.js.es6

 /* eslint-disable no-new */
 /* global Vue */
 /* global MilestoneSelect */
-(() => {
-  gl.issueBoards.ModalFilterMilestone = Vue.extend({
-    props: {
-      milestonePath: {
-        type: String,
-        required: true,
-      },
+module.exports = Vue.extend({
+  name: 'filter-milestone',
+  props: {
+    milestonePath: {
+      type: String,
+      required: true,
     },
-    mounted() {
-      new MilestoneSelect(null, this.$refs.dropdown);
-    },
-    template: `
-      <div class="dropdown">
-        <button
-          class="dropdown-menu-toggle js-milestone-select"
-          type="button"
-          data-toggle="dropdown"
-          data-show-any="true"
-          data-show-upcoming="true"
-          data-field-name="milestone_title"
-          :data-milestones="milestonePath"
-          ref="dropdown">
-          <span class="dropdown-toggle-text">
-            Milestone
-          </span>
-          <i class="fa fa-chevron-down"></i>
-        </button>
-        <div class="dropdown-menu dropdown-select dropdown-menu-selectable dropdown-menu-milestone">
-          <div class="dropdown-title">
-            <span>Filter by milestone</span>
-            <button
-              class="dropdown-title-button dropdown-menu-close"
-              aria-label="Close"
-              type="button">
-              <i class="fa fa-times dropdown-menu-close-icon"></i>
-            </button>
-          </div>
-          <div class="dropdown-input">
-            <input
-              type="search"
-              class="dropdown-input-field"
-              placeholder="Search milestones"
-              autocomplete="off" />
-            <i class="fa fa-search dropdown-input-search"></i>
-            <i role="button" class="fa fa-times dropdown-input-clear js-dropdown-input-clear"></i>
-          </div>
-          <div class="dropdown-content"></div>
-          <div class="dropdown-loading"><i class="fa fa-spinner fa-spin"></i></div>
+  },
+  mounted() {
+    new MilestoneSelect(null, this.$refs.dropdown);
+  },
+  template: `
+    <div class="dropdown">
+      <button
+        class="dropdown-menu-toggle js-milestone-select"
+        type="button"
+        data-toggle="dropdown"
+        data-show-any="true"
+        data-show-upcoming="true"
+        data-field-name="milestone_title"
+        :data-milestones="milestonePath"
+        ref="dropdown">
+        <span class="dropdown-toggle-text">
+          Milestone
+        </span>
+        <i class="fa fa-chevron-down"></i>
+      </button>
+      <div class="dropdown-menu dropdown-select dropdown-menu-selectable dropdown-menu-milestone">
+        <div class="dropdown-title">
+          <span>Filter by milestone</span>
+          <button
+            class="dropdown-title-button dropdown-menu-close"
+            aria-label="Close"
+            type="button">
+            <i class="fa fa-times dropdown-menu-close-icon"></i>
+          </button>
+        </div>
+        <div class="dropdown-input">
+          <input
+            type="search"
+            class="dropdown-input-field"
+            placeholder="Search milestones"
+            autocomplete="off" />
+          <i class="fa fa-search dropdown-input-search"></i>
+          <i role="button" class="fa fa-times dropdown-input-clear js-dropdown-input-clear"></i>
         </div>
+        <div class="dropdown-content"></div>
+        <div class="dropdown-loading"><i class="fa fa-spinner fa-spin"></i></div>
       </div>
-    `,
-  });
-})();
+    </div>
+  `,
+});

app/assets/javascripts/boards/components/modal/filters/user.js.es6

 /* eslint-disable no-new */
 /* global Vue */
 /* global UsersSelect */
-(() => {
-  gl.issueBoards.ModalFilterUser = Vue.extend({
-    props: {
-      toggleClassName: {
-        type: String,
-        required: true,
-      },
-      dropdownClassName: {
-        type: String,
-        required: false,
-        default: '',
-      },
-      toggleLabel: {
-        type: String,
-        required: true,
-      },
-      fieldName: {
-        type: String,
-        required: true,
-      },
-      nullUser: {
-        type: Boolean,
-        required: false,
-        default: false,
-      },
-      projectId: {
-        type: Number,
-        required: true,
-      },
+module.exports = Vue.extend({
+  name: 'filter-user',
+  props: {
+    toggleClassName: {
+      type: String,
+      required: true,
     },
-    mounted() {
-      new UsersSelect(null, this.$refs.dropdown);
+    dropdownClassName: {
+      type: String,
+      required: false,
+      default: '',
     },
-    computed: {
-      currentUsername() {
-        return gon.current_username;
-      },
-      dropdownTitle() {
-        return `Filter by ${this.toggleLabel.toLowerCase()}`;
-      },
-      inputPlaceholder() {
-        return `Search ${this.toggleLabel.toLowerCase()}`;
-      },
+    toggleLabel: {
+      type: String,
+      required: true,
     },
-    template: `
-      <div class="dropdown">
-        <button
-          class="dropdown-menu-toggle js-user-search"
-          :class="toggleClassName"
-          type="button"
-          data-toggle="dropdown"
-          data-current-user="true"
-          :data-any-user="'Any ' + toggleLabel"
-          :data-null-user="nullUser"
-          :data-field-name="fieldName"
-          :data-project-id="projectId"
-          :data-first-user="currentUsername"
-          ref="dropdown">
-          <span class="dropdown-toggle-text">
-            {{ toggleLabel }}
-          </span>
-          <i class="fa fa-chevron-down"></i>
-        </button>
-        <div
-          class="dropdown-menu dropdown-select dropdown-menu-user dropdown-menu-selectable"
-          :class="dropdownClassName">
-          <div class="dropdown-title">
-            {{ dropdownTitle }}
-            <button
-              class="dropdown-title-button dropdown-menu-close"
-              aria-label="Close"
-              type="button">
-              <i class="fa fa-times dropdown-menu-close-icon"></i>
-            </button>
-          </div>
-          <div class="dropdown-input">
-            <input
-              type="search"
-              class="dropdown-input-field"
-              autocomplete="off"
-              :placeholder="inputPlaceholder" />
-            <i class="fa fa-search dropdown-input-search"></i>
-            <i
-              role="button"
-              class="fa fa-times dropdown-input-clear js-dropdown-input-clear">
-            </i>
-          </div>
-          <div class="dropdown-content"></div>
-          <div class="dropdown-loading"><i class="fa fa-spinner fa-spin"></i></div>
+    fieldName: {
+      type: String,
+      required: true,
+    },
+    nullUser: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+    projectId: {
+      type: Number,
+      required: true,
+    },
+  },
+  mounted() {
+    new UsersSelect(null, this.$refs.dropdown);
+  },
+  computed: {
+    currentUsername() {
+      return gon.current_username;
+    },
+    dropdownTitle() {
+      return `Filter by ${this.toggleLabel.toLowerCase()}`;
+    },
+    inputPlaceholder() {
+      return `Search ${this.toggleLabel.toLowerCase()}`;
+    },
+  },
+  template: `
+    <div class="dropdown">
+      <button
+        class="dropdown-menu-toggle js-user-search"
+        :class="toggleClassName"
+        type="button"
+        data-toggle="dropdown"
+        data-current-user="true"
+        :data-any-user="'Any ' + toggleLabel"
+        :data-null-user="nullUser"
+        :data-field-name="fieldName"
+        :data-project-id="projectId"
+        :data-first-user="currentUsername"
+        ref="dropdown">
+        <span class="dropdown-toggle-text">
+          {{ toggleLabel }}
+        </span>
+        <i class="fa fa-chevron-down"></i>
+      </button>
+      <div
+        class="dropdown-menu dropdown-select dropdown-menu-user dropdown-menu-selectable"
+        :class="dropdownClassName">
+        <div class="dropdown-title">
+          {{ dropdownTitle }}
+          <button
+            class="dropdown-title-button dropdown-menu-close"
+            aria-label="Close"
+            type="button">
+            <i class="fa fa-times dropdown-menu-close-icon"></i>
+          </button>
+        </div>
+        <div class="dropdown-input">
+          <input
+            type="search"
+            class="dropdown-input-field"
+            autocomplete="off"
+            :placeholder="inputPlaceholder" />
+          <i class="fa fa-search dropdown-input-search"></i>
+          <i
+            role="button"
+            class="fa fa-times dropdown-input-clear js-dropdown-input-clear">
+          </i>
         </div>
+        <div class="dropdown-content"></div>
+        <div class="dropdown-loading"><i class="fa fa-spinner fa-spin"></i></div>
       </div>
-    `,
-  });
-})();
+    </div>
+  `,
+});

app/assets/javascripts/boards/components/modal/footer.js.es6

 /* eslint-disable no-new */
-//= require ./lists_dropdown
 /* global Vue */
 /* global Flash */
+
+require('./lists_dropdown');
+
 (() => {
   const ModalStore = gl.issueBoards.ModalStore;
 

app/assets/javascripts/boards/components/modal/header.js.es6

 /* global Vue */
-//= require ./tabs
-//= require ./filters
+require('./tabs');
 (() => {
   const ModalStore = gl.issueBoards.ModalStore;
 
@@ -44,7 +43,7 @@
     },
     components: {
       'modal-tabs': gl.issueBoards.ModalTabs,
-      'modal-filters': gl.issueBoards.ModalFilters,
+      'modal-filters': require('./filters'),
     },
     template: `
       <div>

app/assets/javascripts/boards/components/modal/index.js.es6

 /* global Vue */
 /* global ListIssue */
-//= require ./header
-//= require ./list
-//= require ./footer
-//= require ./empty_state
+
+require('./header');
+require('./list');
+require('./footer');
+require('./empty_state');
+
 (() => {
   const ModalStore = gl.issueBoards.ModalStore;
 

app/assets/javascripts/copy_as_gfm.js.es6

 /* eslint-disable class-methods-use-this, object-shorthand, no-unused-vars, no-use-before-define, no-new, max-len, no-restricted-syntax, guard-for-in, no-continue */
 /* jshint esversion: 6 */
 
-/*= require lib/utils/common_utils */
+require('./lib/utils/common_utils');
 
 (() => {
   const gfmRules = {

app/assets/javascripts/copy_to_clipboard.js

 /* eslint-disable func-names, space-before-function-paren, one-var, no-var, one-var-declaration-per-line, prefer-template, quotes, no-unused-vars, prefer-arrow-callback, max-len */
 /* global Clipboard */
 
-/*= require clipboard */
+window.Clipboard = require('vendor/clipboard');
 
 (function() {
   var genericError, genericSuccess, showTooltip;

app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js.es6

@@ -2,9 +2,12 @@
 /* global Cookies */
 /* global Flash */
 
-//= require vue
-//= require_tree ./svg
-//= require_tree .
+window.Vue = require('vue');
+window.Cookies = require('vendor/js.cookie');
+
+function requireAll(context) { return context.keys().map(context); }
+requireAll(require.context('./svg', false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('.', true, /^\.\/(?!cycle_analytics_bundle).*\.(js|es6)$/));
 
 $(() => {
   const OVERVIEW_DIALOG_COOKIE = 'cycle_analytics_help_dismissed';

app/assets/javascripts/diff.js.es6

 /* eslint-disable class-methods-use-this */
 
-//= require lib/utils/url_utility */
+require('./lib/utils/url_utility');
 
 (() => {
   const UNFOLD_COUNT = 20;
+  let isBound = false;
 
   class Diff {
     constructor() {
@@ -17,10 +18,12 @@
         $('.content-wrapper .container-fluid').removeClass('container-limited');
       }
 
-      $(document)
-        .off('click', '.js-unfold, .diff-line-num a')
-        .on('click', '.js-unfold', this.handleClickUnfold.bind(this))
-        .on('click', '.diff-line-num a', this.handleClickLineNum.bind(this));
+      if (!isBound) {
+        $(document)
+          .on('click', '.js-unfold', this.handleClickUnfold.bind(this))
+          .on('click', '.diff-line-num a', this.handleClickLineNum.bind(this));
+        isBound = true;
+      }
 
       this.openAnchoredDiff();
     }

app/assets/javascripts/diff_notes/diff_notes_bundle.js.es6

-/* eslint-disable func-names, comma-dangle, new-cap, no-new */
+/* eslint-disable func-names, comma-dangle, new-cap, no-new, import/newline-after-import, no-multi-spaces, max-len */
 /* global Vue */
 /* global ResolveCount */
 
-//= require_directory ./models
-//= require_directory ./stores
-//= require_directory ./services
-//= require_directory ./mixins
-//= require_directory ./components
+function requireAll(context) { return context.keys().map(context); }
+requireAll(require.context('./models',     false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./stores',     false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./services',   false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./mixins',     false, /^\.\/.*\.(js|es6)$/));
+requireAll(require.context('./components', false, /^\.\/.*\.(js|es6)$/));
 
 $(() => {
   const COMPONENT_SELECTOR = 'resolve-btn, resolve-discussion-btn, jump-to-discussion, comment-and-resolve-btn';

app/assets/javascripts/dropzone_input.js

 /* eslint-disable func-names, space-before-function-paren, wrap-iife, max-len, one-var, no-var, one-var-declaration-per-line, no-unused-vars, camelcase, quotes, no-useless-concat, prefer-template, quote-props, comma-dangle, object-shorthand, consistent-return, prefer-arrow-callback */
 /* global Dropzone */
 
-/*= require preview_markdown */
+require('./preview_markdown');
 
 (function() {
   this.DropzoneInput = (function() {

app/assets/javascripts/environments/components/environment.js.es6

@@ -3,10 +3,10 @@
 /* global EnvironmentsService */
 /* global Flash */
 
-//= require vue
-//= require vue-resource
-//= require_tree ../services/
-//= require ./environment_item
+window.Vue = require('vue');
+window.Vue.use(require('vue-resource'));
+require('../services/environments_service');
+require('./environment_item');
 
 (() => {
   window.gl = window.gl || {};

app/assets/javascripts/environments/components/environment_actions.js.es6

-/*= require vue */
 /* global Vue */
 
+window.Vue = require('vue');
+
 (() => {
   window.gl = window.gl || {};
   window.gl.environmentsList = window.gl.environmentsList || {};

app/assets/javascripts/environments/components/environment_external_url.js.es6

-/*= require vue */
 /* global Vue */
 
+window.Vue = require('vue');
+
 (() => {
   window.gl = window.gl || {};
   window.gl.environmentsList = window.gl.environmentsList || {};

app/assets/javascripts/environments/components/environment_item.js.es6

 /* global Vue */
 /* global timeago */
 
-/*= require timeago */
-/*= require lib/utils/text_utility */
-/*= require vue_common_component/commit */
-/*= require ./environment_actions */
-/*= require ./environment_external_url */
-/*= require ./environment_stop */
-/*= require ./environment_rollback */
-/*= require ./environment_terminal_button */
+window.Vue = require('vue');
+window.timeago = require('vendor/timeago');
+require('../../lib/utils/text_utility');
+require('../../vue_common_component/commit');
+require('./environment_actions');
+require('./environment_external_url');
+require('./environment_stop');
+require('./environment_rollback');
+require('./environment_terminal_button');
 
 (() => {
   /**

app/assets/javascripts/environments/components/environment_rollback.js.es6

-/*= require vue */
 /* global Vue */
 
+window.Vue = require('vue');
+
 (() => {
   window.gl = window.gl || {};
   window.gl.environmentsList = window.gl.environmentsList || {};

app/assets/javascripts/environments/components/environment_stop.js.es6

-/*= require vue */
 /* global Vue */
 
+window.Vue = require('vue');
+
 (() => {
   window.gl = window.gl || {};
   window.gl.environmentsList = window.gl.environmentsList || {};

app/assets/javascripts/environments/components/environment_terminal_button.js.es6

-/*= require vue */
 /* global Vue */
 
+window.Vue = require('vue');
+
 (() => {
   window.gl = window.gl || {};
   window.gl.environmentsList = window.gl.environmentsList || {};

app/assets/javascripts/environments/environments_bundle.js.es6

-//= require vue
-//= require_tree ./stores/
-//= require ./components/environment
-//= require ./vue_resource_interceptor
+window.Vue = require('vue');
+
+require('./stores/environments_store');
+require('./components/environment');
+require('./vue_resource_interceptor');
 
 $(() => {
   window.gl = window.gl || {};

app/assets/javascripts/environments/services/environments_service.js.es6

 /* globals Vue */
 /* eslint-disable no-unused-vars, no-param-reassign */
+
 class EnvironmentsService {
 
   constructor(root) {

app/assets/javascripts/extensions/array.js.es6

-/* eslint-disable no-extend-native, func-names, space-before-function-paren, space-infix-ops, max-len */
+/* eslint-disable no-extend-native, func-names, space-before-function-paren, space-infix-ops, strict, max-len */
+
+'use strict';
+
 Array.prototype.first = function() {
   return this[0];
 };

app/assets/javascripts/filtered_search/dropdown_hint.js.es6

-/*= require filtered_search/filtered_search_dropdown */
+require('./filtered_search_dropdown');
 
 /* global droplabFilter */
 

app/assets/javascripts/filtered_search/dropdown_non_user.js.es6

-/*= require filtered_search/filtered_search_dropdown */
+require('./filtered_search_dropdown');
 
 /* global droplabAjax */
 /* global droplabFilter */

app/assets/javascripts/filtered_search/dropdown_user.js.es6

-/*= require filtered_search/filtered_search_dropdown */
+require('./filtered_search_dropdown');
 
 /* global droplabAjaxFilter */
 

app/assets/javascripts/filtered_search/filtered_search_bundle.js

- // This is a manifest file that'll be compiled into including all the files listed below.
- // Add new JavaScript code in separate files in this directory and they'll automatically
- // be included in the compiled file accessible from http://example.com/assets/application.js
- // It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
- // the compiled file.
- //
- /*= require_tree . */
+function requireAll(context) { return context.keys().map(context); }
+
+requireAll(require.context('./', true, /^\.\/(?!filtered_search_bundle).*\.(js|es6)$/));

app/assets/javascripts/gl_field_errors.js.es6

 /* eslint-disable comma-dangle, class-methods-use-this, max-len, space-before-function-paren, arrow-parens, no-param-reassign */
 
-//= require gl_field_error
+require('./gl_field_error');
 
 ((global) => {
   const customValidationFlag = 'gl-field-error-ignore';

app/assets/javascripts/graphs/graphs_bundle.js

-/* eslint-disable func-names, space-before-function-paren */
-// This is a manifest file that'll be compiled into including all the files listed below.
-// Add new JavaScript code in separate files in this directory and they'll automatically
-// be included in the compiled file accessible from http://example.com/assets/application.js
-// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
-// the compiled file.
-//
-/*= require_tree . */
-
-(function() {
-
-}).call(this);
+// require everything else in this directory
+function requireAll(context) { return context.keys().map(context); }
+requireAll(require.context('.', false, /^\.\/(?!graphs_bundle).*\.(js|es6)$/));

app/assets/javascripts/graphs/stat_graph_contributors.js

@@ -5,7 +5,7 @@
 /* global ContributorsStatGraphUtil */
 /* global d3 */
 
-/*= require d3 */
+window.d3 = require('d3');
 
 (function() {
   this.ContributorsStatGraph = (function() {

app/assets/javascripts/graphs/stat_graph_contributors_graph.js

@@ -2,7 +2,7 @@
 /* global d3 */
 /* global ContributorsGraph */
 
-/*= require d3 */
+window.d3 = require('d3');
 
 (function() {
   var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; },

app/assets/javascripts/issuable/issuable_bundle.js.es6

-//= require ./time_tracking/time_tracking_bundle
+require('./time_tracking/time_tracking_bundle');

app/assets/javascripts/issuable/time_tracking/components/collapsed_state.js.es6

 /* global Vue */
-//= require lib/utils/pretty_time
+require('../../../lib/utils/pretty_time');
 
 (() => {
   Vue.component('time-tracking-collapsed-state', {
@@ -39,4 +39,3 @@
       `,
   });
 })();
-

app/assets/javascripts/issuable/time_tracking/components/comparison_pane.js.es6

 /* global Vue */
-//= require lib/utils/pretty_time
+require('../../../lib/utils/pretty_time');
 
 (() => {
   const prettyTime = gl.utils.prettyTime;

app/assets/javascripts/issuable/time_tracking/components/time_tracker.js.es6

 /* global Vue */
-//= require ./help_state
-//= require ./collapsed_state
-//= require ./spent_only_pane
-//= require ./no_tracking_pane
-//= require ./estimate_only_pane
-//= require ./comparison_pane
+
+require('./help_state');
+require('./collapsed_state');
+require('./spent_only_pane');
+require('./no_tracking_pane');
+require('./estimate_only_pane');
+require('./comparison_pane');
 
 (() => {
   Vue.component('issuable-time-tracker', {

app/assets/javascripts/issuable/time_tracking/time_tracking_bundle.js.es6

 /* global Vue */
-//= require ./components/time_tracker
-//= require smart_interval
-//= require subbable_resource
+
+require('./components/time_tracker');
+require('../../smart_interval');
+require('../../subbable_resource');
 
 (() => {
   /* This Vue instance represents what will become the parent instance for the

app/assets/javascripts/issue.js

 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, one-var, no-underscore-dangle, one-var-declaration-per-line, object-shorthand, no-unused-vars, no-new, comma-dangle, consistent-return, quotes, dot-notation, quote-props, prefer-arrow-callback, max-len */
 /* global Flash */
 
-/*= require flash */
-/*= require jquery.waitforimages */
-/*= require task_list */
+require('./flash');
+require('vendor/jquery.waitforimages');
+require('vendor/task_list');
 
 (function() {
   var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; };

app/assets/javascripts/lib/chart.js

 /* eslint-disable func-names, space-before-function-paren */
 
-/*= require Chart */
-
-(function() {
-
-}).call(this);
+window.Chart = require('vendor/Chart');

app/assets/javascripts/lib/d3.js

 /* eslint-disable func-names, space-before-function-paren */
 
-/*= require d3 */
-
-(function() {
-
-}).call(this);
+window.d3 = require('d3');

app/assets/javascripts/lib/utils/datetime_utility.js

@@ -2,8 +2,8 @@
 /* global timeago */
 /* global dateFormat */
 
-/*= require timeago */
-/*= require date.format */
+window.timeago = require('vendor/timeago');
+window.dateFormat = require('vendor/date.format');
 
 (function() {
   (function(w) {

app/assets/javascripts/lib/utils/emoji_aliases.js.erb

-(function() {
-  gl.emojiAliases = function() {
-    return JSON.parse('<%= Gitlab::AwardEmoji.aliases.to_json %>');
-  };
-
-}).call(this);

app/assets/javascripts/lib/vue_resource.js.es6

-//= require vue
-//= require vue-resource
+window.Vue = require('vue');
+window.Vue.use(require('vue-resource'));

app/assets/javascripts/line_highlighter.js

@@ -4,7 +4,7 @@
 //
 // Handles single- and multi-line selection and highlight for blob views.
 //
-/*= require jquery.scrollTo */
+require('vendor/jquery.scrollTo');
 
 //
 // ### Example Markup

app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js.es6

@@ -2,14 +2,14 @@
 /* global Vue */
 /* global Flash */
 
-//= require vue
-//= require ./merge_conflict_store
-//= require ./merge_conflict_service
-//= require ./mixins/line_conflict_utils
-//= require ./mixins/line_conflict_actions
-//= require ./components/diff_file_editor
-//= require ./components/inline_conflict_lines
-//= require ./components/parallel_conflict_lines
+window.Vue = require('vue');
+require('./merge_conflict_store');
+require('./merge_conflict_service');
+require('./mixins/line_conflict_utils');
+require('./mixins/line_conflict_actions');
+require('./components/diff_file_editor');
+require('./components/inline_conflict_lines');
+require('./components/parallel_conflict_lines');
 
 $(() => {
   const INTERACTIVE_RESOLVE_MODE = 'interactive';

app/assets/javascripts/merge_request.js

 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, quotes, no-underscore-dangle, one-var, one-var-declaration-per-line, consistent-return, dot-notation, quote-props, comma-dangle, object-shorthand, max-len, prefer-arrow-callback */
 /* global MergeRequestTabs */
 
-/*= require jquery.waitforimages */
-/*= require task_list */
-/*= require merge_request_tabs */
+require('vendor/jquery.waitforimages');
+require('vendor/task_list');
+require('./merge_request_tabs');
 
 (function() {
   var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; };

app/assets/javascripts/merge_request_tabs.js.es6

 /* eslint-disable no-new, class-methods-use-this */
 /* global Breakpoints */
 /* global Cookies */
-/* global DiffNotesApp */
 /* global Flash */
 
-/*= require js.cookie */
-/*= require breakpoints */
+require('./breakpoints');
+window.Cookies = require('vendor/js.cookie');
+require('./flash');
 
 /* eslint-disable max-len */
 // MergeRequestTabs

app/assets/javascripts/merge_request_widget.js.es6

@@ -3,6 +3,8 @@
 /* global notifyPermissions */
 /* global merge_request_widget */
 
+require('./smart_interval');
+
 ((global) => {
   var indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i += 1) { if (i in this && this[i] === item) return i; } return -1; };
 

app/assets/javascripts/merge_request_widget/ci_bundle.js.es6

@@ -47,7 +47,7 @@
         $('.js-rebase-button').html("<i class='fa fa-spinner fa-spin'></i> Rebase in progress");
       });
     } else {
-      merge_request_widget.getMergeStatus();
+      setTimeout(() => merge_request_widget.getMergeStatus(), 200);
     }
   });
 })();

app/assets/javascripts/network/network_bundle.js

@@ -2,13 +2,9 @@
 /* global Network */
 /* global ShortcutsNetwork */
 
-// This is a manifest file that'll be compiled into including all the files listed below.
-// Add new JavaScript code in separate files in this directory and they'll automatically
-// be included in the compiled file accessible from http://example.com/assets/application.js
-// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
-// the compiled file.
-//
-/*= require_tree . */
+// require everything else in this directory
+function requireAll(context) { return context.keys().map(context); }
+requireAll(require.context('.', false, /^\.\/(?!network_bundle).*\.(js|es6)$/));
 
 (function() {
   $(function() {

app/assets/javascripts/notes.js

@@ -4,13 +4,14 @@
 /* global ResolveService */
 /* global mrRefreshWidgetUrl */
 
-/*= require autosave */
-/*= require autosize */
-/*= require dropzone */
-/*= require dropzone_input */
-/*= require gfm_auto_complete */
-/*= require jquery.atwho */
-/*= require task_list */
+require('./autosave');
+window.autosize = require('vendor/autosize');
+window.Dropzone = require('dropzone');
+require('./dropzone_input');
+require('./gfm_auto_complete');
+require('vendor/jquery.caret'); // required by jquery.atwho
+require('vendor/jquery.atwho');
+require('vendor/task_list');
 
 (function() {
   var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; };

app/assets/javascripts/pipelines.js.es6

 /* eslint-disable no-new, guard-for-in, no-restricted-syntax, no-continue, no-param-reassign, max-len */
 
-//= require lib/utils/bootstrap_linked_tabs
+require('./lib/utils/bootstrap_linked_tabs');
 
 ((global) => {
   class Pipelines {

app/assets/javascripts/profile/profile_bundle.js

-/* eslint-disable func-names, space-before-function-paren */
-
-/*= require_tree . */
-
-(function() {
-
-}).call(this);
+// require everything else in this directory
+function requireAll(context) { return context.keys().map(context); }
+requireAll(require.context('.', false, /^\.\/(?!profile_bundle).*\.(js|es6)$/));

app/assets/javascripts/project.js

@@ -57,8 +57,8 @@
     };
 
     Project.prototype.initRefSwitcher = function() {
-      var refListItem = document.createElement('li'),
-          refLink = document.createElement('a');
+      var refListItem = document.createElement('li');
+      var refLink = document.createElement('a');
 
       refLink.href = '#';
 

app/assets/javascripts/protected_branches/protected_branches_bundle.js

-/*= require_tree . */
+// require everything else in this directory
+function requireAll(context) { return context.keys().map(context); }
+requireAll(require.context('.', false, /^\.\/(?!protected_branches_bundle).*\.(js|es6)$/));

app/assets/javascripts/shortcuts_blob.js

@@ -2,7 +2,7 @@
 /* global Shortcuts */
 /* global Mousetrap */
 
-/*= require shortcuts */
+require('./shortcuts');
 
 (function() {
   var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },

app/assets/javascripts/shortcuts_dashboard_navigation.js

@@ -2,7 +2,7 @@
 /* global Mousetrap */
 /* global Shortcuts */
 
-/*= require shortcuts */
+require('./shortcuts');
 
 (function() {
   var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },

app/assets/javascripts/shortcuts_find_file.js

@@ -2,7 +2,7 @@
 /* global Mousetrap */
 /* global ShortcutsNavigation */
 
-/*= require shortcuts_navigation */
+require('./shortcuts_navigation');
 
 (function() {
   var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },

app/assets/javascripts/shortcuts_issuable.js

@@ -3,8 +3,8 @@
 /* global ShortcutsNavigation */
 /* global sidebar */
 
-/*= require mousetrap */
-/*= require shortcuts_navigation */
+require('mousetrap');
+require('./shortcuts_navigation');
 
 (function() {
   var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },

app/assets/javascripts/shortcuts_navigation.js

@@ -2,7 +2,7 @@
 /* global Mousetrap */
 /* global Shortcuts */
 
-/*= require shortcuts */
+require('./shortcuts');
 
 (function() {
   var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },

app/assets/javascripts/shortcuts_network.js

@@ -2,7 +2,7 @@
 /* global Mousetrap */
 /* global ShortcutsNavigation */
 
-/*= require shortcuts_navigation */
+require('./shortcuts_navigation');
 
 (function() {
   var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },

app/assets/javascripts/snippet/snippet_bundle.js

 /* eslint-disable func-names, space-before-function-paren, prefer-arrow-callback, no-var, quotes, max-len */
 /* global ace */
 
-/*= require_tree . */
+// require everything else in this directory
+function requireAll(context) { return context.keys().map(context); }
+requireAll(require.context('.', false, /^\.\/(?!snippet_bundle).*\.(js|es6)$/));
 
 (function() {
   $(function() {

app/assets/javascripts/templates/issuable_template_selector.js.es6

 /* eslint-disable comma-dangle, max-len, no-useless-return, no-param-reassign, max-len */
 /* global Api */
 
-/*= require ../blob/template_selector */
+require('../blob/template_selector');
 
 ((global) => {
   class IssuableTemplateSelector extends gl.TemplateSelector {

app/assets/javascripts/terminal/terminal_bundle.js.es6

-//= require xterm/encoding-indexes
-//= require xterm/encoding
-//= require xterm/xterm.js
-//= require xterm/fit.js
-//= require ./terminal.js
+require('vendor/xterm/encoding-indexes.js');
+require('vendor/xterm/encoding.js');
+window.Terminal = require('vendor/xterm/xterm.js');
+require('vendor/xterm/fit.js');
+require('./terminal.js');
 
 $(() => new gl.Terminal({ selector: '#terminal' }));

app/assets/javascripts/users/users_bundle.js

-/* eslint-disable func-names, space-before-function-paren */
-
-/*= require_tree . */
-
-(function() {
-
-}).call(this);
+// require everything else in this directory
+function requireAll(context) { return context.keys().map(context); }
+requireAll(require.context('.', false, /^\.\/(?!users_bundle).*\.(js|es6)$/));

app/assets/javascripts/vue_common_component/commit.js.es6

-/*= require vue */
 /* global Vue */
+
+window.Vue = require('vue');
+
 (() => {
   window.gl = window.gl || {};
 

app/assets/javascripts/vue_pagination/index.js.es6

 /* global Vue, gl */
 /* eslint-disable no-param-reassign, no-plusplus */
 
+window.Vue = require('vue');
+
 ((gl) => {
   const PAGINATION_UI_BUTTON_LIMIT = 4;
   const UI_LIMIT = 6;

app/assets/javascripts/vue_pipelines_index/index.js.es6

 /* global Vue, VueResource, gl */
-/*= require vue_common_component/commit */
-/*= require vue_pagination/index */
-/*= require vue-resource
-/*= require boards/vue_resource_interceptor */
-/*= require ./status.js.es6 */
-/*= require ./store.js.es6 */
-/*= require ./pipeline_url.js.es6 */
-/*= require ./stage.js.es6 */
-/*= require ./stages.js.es6 */
-/*= require ./pipeline_actions.js.es6 */
-/*= require ./time_ago.js.es6 */
-/*= require ./pipelines.js.es6 */
+window.Vue = require('vue');
+window.Vue.use(require('vue-resource'));
+require('../vue_common_component/commit');
+require('../vue_pagination/index');
+require('../boards/vue_resource_interceptor');
+require('./status');
+require('./store');
+require('./pipeline_url');
+require('./stage');
+require('./stages');
+require('./pipeline_actions');
+require('./time_ago');
+require('./pipelines');
 
 (() => {
   const project = document.querySelector('.pipelines');
   const entry = document.querySelector('.vue-pipelines-index');
   const svgs = document.querySelector('.pipeline-svgs');
 
-  Vue.use(VueResource);
-
   if (!entry) return null;
   return new Vue({
     el: entry,

app/assets/javascripts/vue_pipelines_index/store.js.es6

 /* global gl, Flash */
 /* eslint-disable no-param-reassign, no-underscore-dangle */
-/*= require vue_realtime_listener/index.js */
+require('../vue_realtime_listener');
 
 ((gl) => {
   const pageValues = (headers) => {

app/assets/javascripts/wikis.js.es6

 /* eslint-disable no-param-reassign */
 /* global Breakpoints */
 
-/*= require latinise */
-/*= require breakpoints */
-/*= require jquery.nicescroll */
+require('vendor/latinise');
+require('./breakpoints');
+require('vendor/jquery.nicescroll');
 
 ((global) => {
   const dasherize = str => str.replace(/[_\s]+/g, '-');

app/assets/javascripts/zen_mode.js

@@ -6,11 +6,11 @@
 //
 /*= provides zen_mode:enter */
 /*= provides zen_mode:leave */
-//
-/*= require jquery.scrollTo */
-/*= require dropzone */
-/*= require mousetrap */
-/*= require mousetrap/pause */
+
+require('vendor/jquery.scrollTo');
+window.Dropzone = require('dropzone');
+require('mousetrap');
+require('mousetrap/plugins/pause/mousetrap-pause');
 
 //
 // ### Events

app/controllers/projects/application_controller.rb

@@ -18,7 +18,7 @@ class Projects::ApplicationController < ApplicationController
       # to
       #   localhost/group/project
       #
-      if id =~ /\.git\Z/
+      if params[:format] == 'git'
         redirect_to request.original_url.gsub(/\.git\/?\Z/, '')
         return
       end

app/helpers/javascript_helper.rb

@@ -2,4 +2,7 @@ module JavascriptHelper
   def page_specific_javascript_tag(js)
     javascript_include_tag asset_path(js)
   end
+  def page_specific_javascript_bundle_tag(js)
+    javascript_include_tag(*webpack_asset_paths(js))
+  end
 end

app/helpers/search_helper.rb

@@ -56,7 +56,7 @@ module SearchHelper
       { category: "Help", label: "Rake Tasks Help",    url: help_page_path("raketasks/README") },
       { category: "Help", label: "SSH Keys Help",      url: help_page_path("ssh/README") },
       { category: "Help", label: "System Hooks Help",  url: help_page_path("system_hooks/system_hooks") },
-      { category: "Help", label: "Webhooks Help",      url: help_page_path("web_hooks/web_hooks") },
+      { category: "Help", label: "Webhooks Help",      url: help_page_path("user/project/integrations/webhooks") },
       { category: "Help", label: "Workflow Help",      url: help_page_path("workflow/README") },
     ]
   end

app/views/layouts/_head.html.haml

@@ -28,7 +28,7 @@
   = stylesheet_link_tag "application", media: "all"
   = stylesheet_link_tag "print",       media: "print"
 
-  = javascript_include_tag "application"
+  = javascript_include_tag(*webpack_asset_paths("application"))
 
   - if content_for?(:page_specific_javascripts)
     = yield :page_specific_javascripts

app/views/profiles/_head.html.haml

 - content_for :page_specific_javascripts do
   = page_specific_javascript_tag('lib/cropper.js')
-  = page_specific_javascript_tag('profile/profile_bundle.js')
+  = page_specific_javascript_bundle_tag('profile')

app/views/projects/blob/diff.html.haml

@@ -27,4 +27,4 @@
 
   - if @form.unfold? && @form.bottom? && @form.to < @blob.loc
     %tr.line_holder{ id: @form.to, class: line_class }
-      = diff_match_line @form.to, @form.to, text: @match_line, view: diff_view, bottom: true
+      = diff_match_line @form.to - @form.offset, @form.to, text: @match_line, view: diff_view, bottom: true

app/views/projects/blob/edit.html.haml

@@ -2,7 +2,7 @@
 - page_title "Edit", @blob.path, @ref
 - content_for :page_specific_javascripts do
   = page_specific_javascript_tag('lib/ace.js')
-  = page_specific_javascript_tag('blob_edit/blob_edit_bundle.js')
+  = page_specific_javascript_bundle_tag('blob_edit')
 = render "projects/commits/head"
 
 %div{ class: container_class }

app/views/projects/blob/new.html.haml

 - page_title "New File", @path.presence, @ref
 - content_for :page_specific_javascripts do
   = page_specific_javascript_tag('lib/ace.js')
-  = page_specific_javascript_tag('blob_edit/blob_edit_bundle.js')
+  = page_specific_javascript_bundle_tag('blob_edit')
 
 %h3.page-title
   New File

app/views/projects/boards/_show.html.haml

@@ -3,8 +3,8 @@
 - page_title "Boards"
 
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_tag('boards/boards_bundle.js')
-  = page_specific_javascript_tag('boards/test_utils/simulate_drag.js') if Rails.env.test?
+  = page_specific_javascript_bundle_tag('boards')
+  = page_specific_javascript_bundle_tag('boards_test') if Rails.env.test?
 
   %script#js-board-template{ type: "text/x-template" }= render "projects/boards/components/board"
   %script#js-board-list-template{ type: "text/x-template" }= render "projects/boards/components/board_list"