Merge branch '34904-specific-async-script-loading-by-using-a-page-variable' into 'master'

Resolve "Specific Async Script Loading by using a Page Variable"

Closes #34904

See merge request !12759

app/assets/javascripts/awards_handler.js

 /* eslint-disable class-methods-use-this */
 /* global Flash */
-
+import _ from 'underscore';
 import Cookies from 'js-cookie';
 
 const animationEndEventString = 'animationend webkitAnimationEnd MSAnimationEnd oAnimationEnd';

app/assets/javascripts/behaviors/requires_input.js

+import _ from 'underscore';
 import '../commons/bootstrap';
 
 // Requires Input behavior
@@ -48,7 +49,9 @@ function hideOrShowHelpBlock(form) {
 
 $(() => {
   const $form = $('form.js-requires-input');
-  $form.requiresInput();
-  hideOrShowHelpBlock($form);
-  $('.select2.js-select-namespace').change(() => hideOrShowHelpBlock($form));
+  if ($form) {
+    $form.requiresInput();
+    hideOrShowHelpBlock($form);
+    $('.select2.js-select-namespace').change(() => hideOrShowHelpBlock($form));
+  }
 });

app/assets/javascripts/behaviors/toggler_behavior.js

-
 // Toggle button. Show/hide content inside parent container.
 // Button does not change visibility. If button has icon - it changes chevron style.
 //

app/assets/javascripts/boards/boards_bundle.js

@@ -2,6 +2,7 @@
 /* global BoardService */
 /* global Flash */
 
+import _ from 'underscore';
 import Vue from 'vue';
 import VueResource from 'vue-resource';
 import FilteredSearchBoards from './filtered_search_boards';

app/assets/javascripts/boards/components/board_blank_state.js

 /* global ListLabel */
 
+import _ from 'underscore';
 import Cookies from 'js-cookie';
 
 const Store = gl.issueBoards.BoardsStore;

app/assets/javascripts/boards/components/new_list_dropdown.js

 /* eslint-disable comma-dangle, func-names, no-new, space-before-function-paren, one-var,
    promise/catch-or-return */
+import _ from 'underscore';
 
 window.gl = window.gl || {};
 window.gl.issueBoards = window.gl.issueBoards || {};

app/assets/javascripts/boards/stores/boards_store.js

 /* eslint-disable comma-dangle, space-before-function-paren, one-var, no-shadow, dot-notation, max-len */
 /* global List */
-
+import _ from 'underscore';
 import Cookies from 'js-cookie';
 
 window.gl = window.gl || {};

app/assets/javascripts/commons/index.js

+import 'underscore';
 import './polyfills';
 import './jquery';
 import './bootstrap';

app/assets/javascripts/copy_as_gfm.js

 /* 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 */
-
+import _ from 'underscore';
 import './lib/utils/common_utils';
 import { placeholderImage } from './lazy_loader';
 

app/assets/javascripts/dispatcher.js

@@ -79,10 +79,6 @@ import GpgBadges from './gpg_badges';
 (function() {
   var Dispatcher;
 
-  $(function() {
-    return new Dispatcher();
-  });
-
   Dispatcher = (function() {
     function Dispatcher() {
       this.initSearch();
@@ -637,4 +633,8 @@ import GpgBadges from './gpg_badges';
 
     return Dispatcher;
   })();
+
+  $(function() {
+    new Dispatcher();
+  });
 }).call(window);

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 */
-
+import _ from 'underscore';
 import './preview_markdown';
 
 window.DropzoneInput = (function() {
   function DropzoneInput(form) {
-    Dropzone.autoDiscover = false;
     const divHover = '<div class="div-dropzone-hover"></div>';
     const iconPaperclip = '<i class="fa fa-paperclip div-dropzone-icon"></i>';
     const $attachButton = form.find('.button-attach-file');

app/assets/javascripts/emoji/index.js

+import _ from 'underscore';
 import emojiMap from 'emojis/digests.json';
 import emojiAliases from 'emojis/aliases.json';
 

app/assets/javascripts/filterable_list.js

+import _ from 'underscore';
+
 /**
  * Makes search request for content when user types a value in the search input.
  * Updates the html content of the page with the received one.

app/assets/javascripts/filtered_search/dropdown_utils.js

+import _ from 'underscore';
 import FilteredSearchContainer from './container';
 
 class DropdownUtils {

app/assets/javascripts/gfm_auto_complete.js

+import _ from 'underscore';
 import glRegexp from './lib/utils/regexp';
 import AjaxCache from './lib/utils/ajax_cache';
 

app/assets/javascripts/gl_dropdown.js

 /* eslint-disable func-names, space-before-function-paren, no-var, one-var, one-var-declaration-per-line, prefer-rest-params, max-len, vars-on-top, wrap-iife, no-unused-vars, quotes, no-shadow, no-cond-assign, prefer-arrow-callback, no-return-assign, no-else-return, camelcase, comma-dangle, no-lonely-if, guard-for-in, no-restricted-syntax, consistent-return, prefer-template, no-param-reassign, no-loop-func, no-mixed-operators */
 /* global fuzzaldrinPlus */
+import _ from 'underscore';
 import { isObject } from './lib/utils/type_utility';
 
 var GitLabDropdown, GitLabDropdownFilter, GitLabDropdownRemote;

app/assets/javascripts/graphs/stat_graph_contributors.js

 /* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, one-var, camelcase, one-var-declaration-per-line, quotes, no-param-reassign, quote-props, comma-dangle, prefer-template, max-len, no-return-assign, no-shadow */
 
+import _ from 'underscore';
 import d3 from 'd3';
 import { ContributorsGraph, ContributorsAuthorGraph, ContributorsMasterGraph } from './stat_graph_contributors_graph';
 import ContributorsStatGraphUtil from './stat_graph_contributors_util';

app/assets/javascripts/graphs/stat_graph_contributors_graph.js

 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, max-len, no-restricted-syntax, vars-on-top, no-use-before-define, no-param-reassign, new-cap, no-underscore-dangle, wrap-iife, comma-dangle, no-return-assign, prefer-arrow-callback, quotes, prefer-template, newline-per-chained-call, no-else-return, no-shadow */
-
+import _ from 'underscore';
 import d3 from 'd3';
 
 const 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/graphs/stat_graph_contributors_util.js

 /* eslint-disable func-names, space-before-function-paren, object-shorthand, no-var, one-var, camelcase, one-var-declaration-per-line, comma-dangle, no-param-reassign, no-return-assign, quotes, prefer-arrow-callback, wrap-iife, consistent-return, no-unused-vars, max-len, no-cond-assign, no-else-return, max-len */
+import _ from 'underscore';
 
 export default {
   parse_log: function(log) {

app/assets/javascripts/issuable_bulk_update_actions.js

 /* eslint-disable comma-dangle, quotes, consistent-return, func-names, array-callback-return, space-before-function-paren, prefer-arrow-callback, max-len, no-unused-expressions, no-sequences, no-underscore-dangle, no-unused-vars, no-param-reassign */
 /* global IssuableIndex */
 /* global Flash */
+import _ from 'underscore';
 
 export default {
   init({ container, form, issues, prefixId } = {}) {

app/assets/javascripts/issuable_index.js

 /* eslint-disable no-param-reassign, func-names, no-var, camelcase, no-unused-vars, object-shorthand, space-before-function-paren, no-return-assign, comma-dangle, consistent-return, one-var, one-var-declaration-per-line, quotes, prefer-template, prefer-arrow-callback, wrap-iife, max-len */
 /* global IssuableIndex */
-
+import _ from 'underscore';
 import IssuableBulkUpdateSidebar from './issuable_bulk_update_sidebar';
 import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
 

app/assets/javascripts/labels_select.js

 /* eslint-disable no-useless-return, func-names, space-before-function-paren, wrap-iife, no-var, no-underscore-dangle, prefer-arrow-callback, max-len, one-var, no-unused-vars, one-var-declaration-per-line, prefer-template, no-new, consistent-return, object-shorthand, comma-dangle, no-shadow, no-param-reassign, brace-style, vars-on-top, quotes, no-lonely-if, no-else-return, dot-notation, no-empty, no-return-assign, camelcase, prefer-spread */
 /* global Issuable */
 /* global ListLabel */
-
+import _ from 'underscore';
 import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
 import DropdownUtils from './filtered_search/dropdown_utils';
 

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

+import _ from 'underscore';
+
 (() => {
   /*
    * TODO: Make these methods more configurable (e.g. parseSeconds timePeriodContstraints,

app/assets/javascripts/main.js

@@ -36,9 +36,6 @@ import './shortcuts_find_file';
 import './shortcuts_issuable';
 import './shortcuts_network';
 
-// behaviors
-import './behaviors/';
-
 // templates
 import './templates/issuable_template_selector';
 import './templates/issuable_template_selectors';
@@ -56,6 +53,9 @@ import './lib/utils/pretty_time';
 import './lib/utils/text_utility';
 import './lib/utils/url_utility';
 
+// behaviors
+import './behaviors/';
+
 // u2f
 import './u2f/authenticate';
 import './u2f/error';
@@ -86,7 +86,6 @@ import './copy_as_gfm';
 import './copy_to_clipboard';
 import './create_label';
 import './diff';
-import './dispatcher';
 import './dropzone_input';
 import './due_date_select';
 import './files_comment_button';
@@ -150,9 +149,13 @@ import './subscription';
 import './subscription_select';
 import './syntax_highlight';
 
+import './dispatcher';
+
 // eslint-disable-next-line global-require, import/no-commonjs
 if (process.env.NODE_ENV !== 'production') require('./test_utils/');
 
+Dropzone.autoDiscover = false;
+
 document.addEventListener('beforeunload', function () {
   // Unbind scroll events
   $(document).off('scroll');

app/assets/javascripts/milestone_select.js

 /* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, no-underscore-dangle, prefer-arrow-callback, max-len, one-var, one-var-declaration-per-line, no-unused-vars, object-shorthand, comma-dangle, no-else-return, no-self-compare, consistent-return, no-param-reassign, no-shadow */
 /* global Issuable */
 /* global ListMilestone */
+import _ from 'underscore';
 
 (function() {
   this.MilestoneSelect = (function() {

app/assets/javascripts/notes.js

@@ -11,6 +11,7 @@ newline-per-chained-call, no-useless-escape, class-methods-use-this */
 /* global mrRefreshWidgetUrl */
 
 import $ from 'jquery';
+import _ from 'underscore';
 import Cookies from 'js-cookie';
 import autosize from 'vendor/autosize';
 import Dropzone from 'dropzone';

app/assets/javascripts/pipeline_schedules/components/interval_pattern_input.vue

 <script>
+  import _ from 'underscore';
+
   export default {
     props: {
       initialCronInterval: {

app/assets/javascripts/profile/gl_crop.js

 /* eslint-disable no-useless-escape, max-len, quotes, no-var, no-underscore-dangle, func-names, space-before-function-paren, no-unused-vars, no-return-assign, object-shorthand, one-var, one-var-declaration-per-line, comma-dangle, consistent-return, class-methods-use-this, new-parens */
 
 import 'cropper';
+import _ from 'underscore';
 
 ((global) => {
   // Matches everything but the file name

app/assets/javascripts/project_edit.js

 export default function setupProjectEdit() {
   const $transferForm = $('.js-project-transfer-form');
-  const $selectNamespace = $transferForm.find('.select2');
+  const $selectNamespace = $transferForm.find('select.select2');
 
   $selectNamespace.on('change', () => {
     $transferForm.find(':submit').prop('disabled', !$selectNamespace.val());

app/assets/javascripts/protected_branches/protected_branch_dropdown.js

+import _ from 'underscore';
+
 export default class ProtectedBranchDropdown {
   /**
    * @param {Object} options containing

app/assets/javascripts/protected_tags/protected_tag_dropdown.js

+import _ from 'underscore';
+
 export default class ProtectedTagDropdown {
   /**
    * @param {Object} options containing

app/assets/javascripts/right_sidebar.js

 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, no-unused-vars, consistent-return, one-var, one-var-declaration-per-line, quotes, prefer-template, object-shorthand, comma-dangle, no-else-return, no-param-reassign, max-len */
 
+import _ from 'underscore';
 import Cookies from 'js-cookie';
 import SidebarHeightManager from './sidebar_height_manager';
 

app/assets/javascripts/shortcuts_issuable.js

@@ -3,6 +3,7 @@
 /* global ShortcutsNavigation */
 /* global sidebar */
 
+import _ from 'underscore';
 import 'mousetrap';
 import './shortcuts_navigation';
 
@@ -58,7 +59,7 @@ import './shortcuts_navigation';
       });
       // If replyField already has some content, add a newline before our quote
       separator = replyField.val().trim() !== "" && "\n\n" || '';
-      replyField.val(function(_, current) {
+      replyField.val(function(a, current) {
         return current + separator + quote.join('') + "\n";
       });
 

app/assets/javascripts/sidebar/components/time_tracking/sidebar_time_tracking.js

+import _ from 'underscore';
+
 import '~/smart_interval';
 
 import timeTracker from './time_tracker';

app/assets/javascripts/sidebar_height_manager.js

+import _ from 'underscore';
+
 export default {
   init() {
     if (!this.initialized) {
@@ -30,4 +32,3 @@ export default {
     }
   },
 };
-

app/assets/javascripts/todos.js

@@ -52,6 +52,7 @@ export default class Todos {
   }
 
   updateRowStateClicked(e) {
+    e.stopPropagation();
     e.preventDefault();
 
     const target = e.target;
@@ -92,6 +93,7 @@ export default class Todos {
   }
 
   updateAllStateClicked(e) {
+    e.stopPropagation();
     e.preventDefault();
 
     const target = e.currentTarget;
@@ -142,6 +144,7 @@ export default class Todos {
     if (gl.utils.isMetaClick(e)) {
       const windowTarget = '_blank';
       const selected = e.target;
+      e.stopPropagation();
       e.preventDefault();
 
       if (selected.tagName === 'IMG') {

app/assets/javascripts/u2f/authenticate.js

@@ -3,6 +3,8 @@
 /* global U2FError */
 /* global U2FUtil */
 
+import _ from 'underscore';
+
 // Authenticate U2F (universal 2nd factor) devices for users to authenticate with.
 //
 // State Flow #1: setup -> in_progress -> authenticated -> POST to server

app/assets/javascripts/u2f/register.js

@@ -3,6 +3,8 @@
 /* global U2FError */
 /* global U2FUtil */
 
+import _ from 'underscore';
+
 // Register U2F (universal 2nd factor) devices for users to authenticate with.
 //
 // State Flow #1: setup -> in_progress -> registered -> POST to server

app/assets/javascripts/username_validator.js

 /* eslint-disable comma-dangle, consistent-return, class-methods-use-this, arrow-parens, no-param-reassign, max-len */
 
+import _ from 'underscore';
+
 const debounceTimeoutDuration = 1000;
 const invalidInputClass = 'gl-field-error-outline';
 const successInputClass = 'gl-field-success-outline';

app/assets/javascripts/users/activity_calendar.js

+import _ from 'underscore';
 import d3 from 'd3';
 
 const LOADING_HTML = `

app/assets/javascripts/users_select.js

 /* eslint-disable func-names, space-before-function-paren, one-var, no-var, prefer-rest-params, wrap-iife, quotes, max-len, one-var-declaration-per-line, vars-on-top, prefer-arrow-callback, consistent-return, comma-dangle, object-shorthand, no-shadow, no-unused-vars, no-else-return, no-self-compare, prefer-template, no-unused-expressions, no-lonely-if, yoda, prefer-spread, no-void, camelcase, no-param-reassign */
 /* global Issuable */
 /* global emitSidebarEvent */
+import _ from 'underscore';
 
 // TODO: remove eventHub hack after code splitting refactor
 window.emitSidebarEvent = window.emitSidebarEvent || $.noop;

app/helpers/defer_script_tag_helper.rb

+module DeferScriptTagHelper
+  # Override the default ActionView `javascript_include_tag` helper to support page specific deferred loading
+  def javascript_include_tag(*sources)
+    super(*sources, defer: true)
+  end
+end

app/views/layouts/_bootlint.haml

+-# haml-lint:disable InlineJavaScript
 :javascript
-  jQuery(document).ready(function() {
-    javascript:(function(){var s=document.createElement("script");s.onload=function(){bootlint.showLintReportForCurrentDocument([], {hasProblems: false, problemFree: false});};s.src="https://maxcdn.bootstrapcdn.com/bootlint/latest/bootlint.min.js";document.body.appendChild(s)})();
-  });
+  window.onload = function() {
+    var s=document.createElement("script");s.onload=function(){bootlint.showLintReportForCurrentDocument([], {hasProblems: false, problemFree: false});};s.src="https://maxcdn.bootstrapcdn.com/bootlint/latest/bootlint.min.js";document.body.appendChild(s);
+  }

app/views/layouts/_init_auto_complete.html.haml

@@ -4,6 +4,7 @@
 - if project
   -# haml-lint:disable InlineJavaScript
   :javascript
+    gl = window.gl || {};
     gl.GfmAutoComplete = gl.GfmAutoComplete || {};
     gl.GfmAutoComplete.dataSources = {
       members: "#{members_project_autocomplete_sources_path(project, type: noteable_type, type_id: params[:id])}",

app/views/projects/merge_requests/show.html.haml

@@ -17,6 +17,7 @@
 
     -# haml-lint:disable InlineJavaScript
     :javascript
+      window.gl = window.gl || {};
       window.gl.mrWidgetData = #{serialize_issuable(@merge_request)}
 
     #js-vue-mr-widget.mr-widget

spec/helpers/defer_script_tag_helper_spec.rb

+# coding: utf-8
+require 'spec_helper'
+
+describe DeferScriptTagHelper do
+  describe 'script tag' do
+    script_url = 'test.js'
+
+    it 'returns an script tag with defer=true' do
+      expect(javascript_include_tag(script_url).to_s)
+        .to eq "<script src=\"/javascripts/#{script_url}\" defer=\"defer\"></script>"
+    end
+  end
+end