Export old code as ES6 odules38869-es6

Rever project find file changes

8 files changed, 52 insertions, 54 deletions

diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index dcc0fa63b63..80fbad2a41b 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -64,10 +64,7 @@ import './notifications_form';
 import './pager';
 import './preview_markdown';
 import './project_find_file';
-import './project_import';
 import './projects_dropdown';
-import './projects_list';
-import './syntax_highlight';
 import './render_gfm';
 import './right_sidebar';
 import './search';
diff --git a/app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js b/app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js
index 17591829b76..372b2b520e8 100644
--- a/app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js
+++ b/app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js
@@ -3,6 +3,7 @@
 import Vue from 'vue';
 import Flash from '../flash';
 import initIssuableSidebar from '../init_issuable_sidebar';
+import syntaxHighlight from '../syntax_highlight';
 import './merge_conflict_store';
 import './merge_conflict_service';
 import './mixins/line_conflict_utils';
@@ -53,7 +54,7 @@ $(() => {
           mergeConflictsStore.setLoadingState(false);
 
           this.$nextTick(() => {
-            $('.js-syntax-highlight').syntaxHighlight();
+            syntaxHighlight($('.js-syntax-highlight'));
           });
         });
     },
diff --git a/app/assets/javascripts/merge_request_tabs.js b/app/assets/javascripts/merge_request_tabs.js
index 54c1b7a268e..e9254acbfd7 100644
--- a/app/assets/javascripts/merge_request_tabs.js
+++ b/app/assets/javascripts/merge_request_tabs.js
@@ -13,6 +13,7 @@ import {
 } from './lib/utils/common_utils';
 import initDiscussionTab from './image_diff/init_discussion_tab';
 import Diff from './diff';
+import syntaxHighlight from './syntax_highlight';
 
 /* eslint-disable max-len */
 // MergeRequestTabs
@@ -294,7 +295,7 @@ import Diff from './diff';
           }
 
           gl.utils.localTimeAgo($('.js-timeago', 'div#diffs'));
-          $('#diffs .js-syntax-highlight').syntaxHighlight();
+          syntaxHighlight($('#diffs .js-syntax-highlight'));
 
           if (this.diffViewType() === 'parallel' && this.isDiffAction(this.currentAction)) {
             this.expandViewContainer();
diff --git a/app/assets/javascripts/render_gfm.js b/app/assets/javascripts/render_gfm.js
index c91a0d9ba41..05a623ca6d9 100644
--- a/app/assets/javascripts/render_gfm.js
+++ b/app/assets/javascripts/render_gfm.js
@@ -1,12 +1,13 @@
 import renderMath from './render_math';
 import renderMermaid from './render_mermaid';
+import syntaxHighlight from './syntax_highlight';
 
 // Render Gitlab flavoured Markdown
 //
 // Delegates to syntax highlight and render math & mermaid diagrams.
 //
 $.fn.renderGFM = function renderGFM() {
-  this.find('.js-syntax-highlight').syntaxHighlight();
+  syntaxHighlight(this.find('.js-syntax-highlight'));
   renderMath(this.find('.js-render-math'));
   renderMermaid(this.find('.js-render-mermaid'));
   return this;
diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index 6ce9267f598..425c55fafb5 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -1,6 +1,7 @@
 <script>
 /* global LineHighlighter */
 import { mapGetters } from 'vuex';
+import syntaxHighlight from '../../syntax_highlight';
 
 export default {
   computed: {
@@ -13,7 +14,7 @@ export default {
   },
   methods: {
     highlightFile() {
-      $(this.$el).find('.file-content').syntaxHighlight();
+      syntaxHighlight($(this.$el).find('.file-content'));
     },
   },
   mounted() {
diff --git a/app/assets/javascripts/single_file_diff.js b/app/assets/javascripts/single_file_diff.js
index 3f811c59cb9..95e51bc4e7a 100644
--- a/app/assets/javascripts/single_file_diff.js
+++ b/app/assets/javascripts/single_file_diff.js
@@ -2,6 +2,7 @@
 
 import FilesCommentButton from './files_comment_button';
 import imageDiffHelper from './image_diff/helpers/index';
+import syntaxHighlight from './syntax_highlight';
 
 const WRAPPER = '<div class="diff-content"></div>';
 const LOADING_HTML = '<i class="fa fa-spinner fa-spin"></i>';
@@ -64,7 +65,7 @@ export default class SingleFileDiff {
         _this.loadingContent.hide();
         if (data.html) {
           _this.content = $(data.html);
-          _this.content.syntaxHighlight();
+          syntaxHighlight(_this.content);
         } else {
           _this.hasError = true;
           _this.content = $(ERROR_HTML);
diff --git a/app/assets/javascripts/syntax_highlight.js b/app/assets/javascripts/syntax_highlight.js
index 662d6b36c16..3c6a3305cb9 100644
--- a/app/assets/javascripts/syntax_highlight.js
+++ b/app/assets/javascripts/syntax_highlight.js
@@ -10,17 +10,15 @@
 //   <div class="js-syntax-highlight"></div>
 //
 
-$.fn.syntaxHighlight = function() {
-  var $children;
-
-  if ($(this).hasClass('js-syntax-highlight')) {
+export default function syntaxHighlight(element) {
+  if ($(element).hasClass('js-syntax-highlight')) {
     // Given the element itself, apply highlighting
-    return $(this).addClass(gon.user_color_scheme);
+    return $(element).addClass(gon.user_color_scheme);
   } else {
     // Given a parent element, recurse to any of its applicable children
-    $children = $(this).find('.js-syntax-highlight');
+    const $children = $(element).find('.js-syntax-highlight');
     if ($children.length) {
-      return $children.syntaxHighlight();
+      return syntaxHighlight($children);
     }
   }
-};
+}
diff --git a/spec/javascripts/syntax_highlight_spec.js b/spec/javascripts/syntax_highlight_spec.js
index 946f98379ce..763a15e710b 100644
--- a/spec/javascripts/syntax_highlight_spec.js
+++ b/spec/javascripts/syntax_highlight_spec.js
@@ -1,44 +1,42 @@
 /* eslint-disable space-before-function-paren, no-var, no-return-assign, quotes */
 
-import '~/syntax_highlight';
+import syntaxHighlight from '~/syntax_highlight';
 
-(function() {
-  describe('Syntax Highlighter', function() {
-    var stubUserColorScheme;
-    stubUserColorScheme = function(value) {
-      if (window.gon == null) {
-        window.gon = {};
-      }
-      return window.gon.user_color_scheme = value;
-    };
-    describe('on a js-syntax-highlight element', function() {
-      beforeEach(function() {
-        return setFixtures('<div class="js-syntax-highlight"></div>');
-      });
-      return it('applies syntax highlighting', function() {
-        stubUserColorScheme('monokai');
-        $('.js-syntax-highlight').syntaxHighlight();
-        return expect($('.js-syntax-highlight')).toHaveClass('monokai');
-      });
+describe('Syntax Highlighter', function() {
+  var stubUserColorScheme;
+  stubUserColorScheme = function(value) {
+    if (window.gon == null) {
+      window.gon = {};
+    }
+    return window.gon.user_color_scheme = value;
+  };
+  describe('on a js-syntax-highlight element', function() {
+    beforeEach(function() {
+      return setFixtures('<div class="js-syntax-highlight"></div>');
     });
-    return describe('on a parent element', function() {
-      beforeEach(function() {
-        return setFixtures("<div class=\"parent\">\n  <div class=\"js-syntax-highlight\"></div>\n  <div class=\"foo\"></div>\n  <div class=\"js-syntax-highlight\"></div>\n</div>");
-      });
-      it('applies highlighting to all applicable children', function() {
-        stubUserColorScheme('monokai');
-        $('.parent').syntaxHighlight();
-        expect($('.parent, .foo')).not.toHaveClass('monokai');
-        return expect($('.monokai').length).toBe(2);
-      });
-      return it('prevents an infinite loop when no matches exist', function() {
-        var highlight;
-        setFixtures('<div></div>');
-        highlight = function() {
-          return $('div').syntaxHighlight();
-        };
-        return expect(highlight).not.toThrow();
-      });
+    return it('applies syntax highlighting', function() {
+      stubUserColorScheme('monokai');
+      syntaxHighlight($('.js-syntax-highlight'));
+      return expect($('.js-syntax-highlight')).toHaveClass('monokai');
     });
   });
-}).call(window);
+  return describe('on a parent element', function() {
+    beforeEach(function() {
+      return setFixtures("<div class=\"parent\">\n  <div class=\"js-syntax-highlight\"></div>\n  <div class=\"foo\"></div>\n  <div class=\"js-syntax-highlight\"></div>\n</div>");
+    });
+    it('applies highlighting to all applicable children', function() {
+      stubUserColorScheme('monokai');
+      syntaxHighlight($('.parent'));
+      expect($('.parent, .foo')).not.toHaveClass('monokai');
+      return expect($('.monokai').length).toBe(2);
+    });
+    return it('prevents an infinite loop when no matches exist', function() {
+      var highlight;
+      setFixtures('<div></div>');
+      highlight = function() {
+        return syntaxHighlight($('div'));
+      };
+      return expect(highlight).not.toThrow();
+    });
+  });
+});