Commit 85c95ece authored by Clement Ho's avatar Clement Ho

Merge branch 'ee-modulify-and-tech-debt-gfm-auto-complete' into 'master'

Make `gfm_auto_complete` a module and fix up tech debt -- EE merge edition

See merge request !1881
parents aa7b5015 e0a94def
...@@ -55,6 +55,7 @@ import BlobViewer from './blob/viewer/index'; ...@@ -55,6 +55,7 @@ import BlobViewer from './blob/viewer/index';
import GeoNodes from './geo_nodes'; import GeoNodes from './geo_nodes';
import ServiceDeskRoot from './projects/settings_service_desk/service_desk_root'; import ServiceDeskRoot from './projects/settings_service_desk/service_desk_root';
import AutoWidthDropdownSelect from './issuable/auto_width_dropdown_select'; import AutoWidthDropdownSelect from './issuable/auto_width_dropdown_select';
import GfmAutoComplete from './gfm_auto_complete';
const ShortcutsBlob = require('./shortcuts_blob'); const ShortcutsBlob = require('./shortcuts_blob');
...@@ -81,6 +82,8 @@ const ShortcutsBlob = require('./shortcuts_blob'); ...@@ -81,6 +82,8 @@ const ShortcutsBlob = require('./shortcuts_blob');
path = page.split(':'); path = page.split(':');
shortcut_handler = null; shortcut_handler = null;
new GfmAutoComplete(gl.GfmAutoComplete && gl.GfmAutoComplete.dataSources).setup();
function initBlob() { function initBlob() {
new LineHighlighter(); new LineHighlighter();
......
This diff is collapsed.
...@@ -3,6 +3,8 @@ ...@@ -3,6 +3,8 @@
/* global DropzoneInput */ /* global DropzoneInput */
/* global autosize */ /* global autosize */
import GfmAutoComplete from './gfm_auto_complete';
window.gl = window.gl || {}; window.gl = window.gl || {};
function GLForm(form) { function GLForm(form) {
...@@ -31,7 +33,7 @@ GLForm.prototype.setupForm = function() { ...@@ -31,7 +33,7 @@ GLForm.prototype.setupForm = function() {
// remove notify commit author checkbox for non-commit notes // remove notify commit author checkbox for non-commit notes
gl.utils.disableButtonIfEmptyField(this.form.find('.js-note-text'), this.form.find('.js-comment-button, .js-note-new-discussion')); gl.utils.disableButtonIfEmptyField(this.form.find('.js-note-text'), this.form.find('.js-comment-button, .js-note-new-discussion'));
gl.GfmAutoComplete.setup(this.form.find('.js-gfm-input')); new GfmAutoComplete(gl.GfmAutoComplete && gl.GfmAutoComplete.dataSources).setup(this.form.find('.js-gfm-input'));
new DropzoneInput(this.form); new DropzoneInput(this.form);
autosize(this.textarea); autosize(this.textarea);
} }
......
...@@ -7,6 +7,8 @@ ...@@ -7,6 +7,8 @@
/* global dateFormat */ /* global dateFormat */
/* global Pikaday */ /* global Pikaday */
import GfmAutoComplete from './gfm_auto_complete';
(function() { (function() {
this.IssuableForm = (function() { this.IssuableForm = (function() {
IssuableForm.prototype.issueMoveConfirmMsg = 'Are you sure you want to move this issue to another project?'; IssuableForm.prototype.issueMoveConfirmMsg = 'Are you sure you want to move this issue to another project?';
...@@ -20,7 +22,7 @@ ...@@ -20,7 +22,7 @@
this.renderWipExplanation = this.renderWipExplanation.bind(this); this.renderWipExplanation = this.renderWipExplanation.bind(this);
this.resetAutosave = this.resetAutosave.bind(this); this.resetAutosave = this.resetAutosave.bind(this);
this.handleSubmit = this.handleSubmit.bind(this); this.handleSubmit = this.handleSubmit.bind(this);
gl.GfmAutoComplete.setup(); new GfmAutoComplete(gl.GfmAutoComplete && gl.GfmAutoComplete.dataSources).setup();
new UsersSelect(); new UsersSelect();
new GroupsSelect(); new GroupsSelect();
new ZenMode(); new ZenMode();
......
...@@ -97,7 +97,6 @@ import './dropzone_input'; ...@@ -97,7 +97,6 @@ import './dropzone_input';
import './due_date_select'; import './due_date_select';
import './files_comment_button'; import './files_comment_button';
import './flash'; import './flash';
import './gfm_auto_complete';
import './gl_dropdown'; import './gl_dropdown';
import './gl_field_error'; import './gl_field_error';
import './gl_field_errors'; import './gl_field_errors';
......
...@@ -12,7 +12,6 @@ require('./autosave'); ...@@ -12,7 +12,6 @@ require('./autosave');
window.autosize = require('vendor/autosize'); window.autosize = require('vendor/autosize');
window.Dropzone = require('dropzone'); window.Dropzone = require('dropzone');
require('./dropzone_input'); require('./dropzone_input');
require('./gfm_auto_complete');
require('vendor/jquery.caret'); // required by jquery.atwho require('vendor/jquery.caret'); // required by jquery.atwho
require('vendor/jquery.atwho'); require('vendor/jquery.atwho');
require('./task_list'); require('./task_list');
......
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
- if project - if project
:javascript :javascript
gl.GfmAutoComplete = gl.GfmAutoComplete || {};
gl.GfmAutoComplete.dataSources = { gl.GfmAutoComplete.dataSources = {
members: "#{members_namespace_project_autocomplete_sources_path(project.namespace, project, type: noteable_type, type_id: params[:id])}", members: "#{members_namespace_project_autocomplete_sources_path(project.namespace, project, type: noteable_type, type_id: params[:id])}",
issues: "#{issues_namespace_project_autocomplete_sources_path(project.namespace, project)}", issues: "#{issues_namespace_project_autocomplete_sources_path(project.namespace, project)}",
...@@ -11,5 +12,3 @@ ...@@ -11,5 +12,3 @@
milestones: "#{milestones_namespace_project_autocomplete_sources_path(project.namespace, project)}", milestones: "#{milestones_namespace_project_autocomplete_sources_path(project.namespace, project)}",
commands: "#{commands_namespace_project_autocomplete_sources_path(project.namespace, project, type: noteable_type, type_id: params[:id])}" commands: "#{commands_namespace_project_autocomplete_sources_path(project.namespace, project, type: noteable_type, type_id: params[:id])}"
}; };
gl.GfmAutoComplete.setup();
...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
%html{ lang: I18n.locale, class: "#{page_class}" } %html{ lang: I18n.locale, class: "#{page_class}" }
= render "layouts/head" = render "layouts/head"
%body{ class: @body_class, data: { page: body_data_page, project: "#{@project.path if @project}", group: "#{@group.path if @group}" } } %body{ class: @body_class, data: { page: body_data_page, project: "#{@project.path if @project}", group: "#{@group.path if @group}" } }
= render "layouts/init_auto_complete" if @gfm_form
= render "layouts/header/default", title: header_title = render "layouts/header/default", title: header_title
= render 'layouts/page', sidebar: sidebar, nav: nav = render 'layouts/page', sidebar: sidebar, nav: nav
= yield :scripts_body = yield :scripts_body
= render "layouts/init_auto_complete" if @gfm_form
...@@ -10,7 +10,7 @@ describe 'GFM autocomplete loading', feature: true, js: true do ...@@ -10,7 +10,7 @@ describe 'GFM autocomplete loading', feature: true, js: true do
end end
it 'does not load on project#show' do it 'does not load on project#show' do
expect(evaluate_script('gl.GfmAutoComplete.dataSources')).to eq({}) expect(evaluate_script('gl.GfmAutoComplete')).to eq(nil)
end end
it 'loads on new issue page' do it 'loads on new issue page' do
......
/* eslint no-param-reassign: "off" */ /* eslint no-param-reassign: "off" */
require('~/gfm_auto_complete'); import GfmAutoComplete from '~/gfm_auto_complete';
require('vendor/jquery.caret'); require('vendor/jquery.caret');
require('vendor/jquery.atwho'); require('vendor/jquery.atwho');
const global = window.gl || (window.gl = {});
const GfmAutoComplete = global.GfmAutoComplete;
describe('GfmAutoComplete', function () { describe('GfmAutoComplete', function () {
const gfmAutoCompleteCallbacks = GfmAutoComplete.prototype.getDefaultCallbacks.call({
fetchData: () => {},
});
describe('DefaultOptions.sorter', function () { describe('DefaultOptions.sorter', function () {
describe('assets loading', function () { describe('assets loading', function () {
beforeEach(function () { beforeEach(function () {
...@@ -16,7 +18,7 @@ describe('GfmAutoComplete', function () { ...@@ -16,7 +18,7 @@ describe('GfmAutoComplete', function () {
this.atwhoInstance = { setting: {} }; this.atwhoInstance = { setting: {} };
this.items = []; this.items = [];
this.sorterValue = GfmAutoComplete.DefaultOptions.sorter this.sorterValue = gfmAutoCompleteCallbacks.sorter
.call(this.atwhoInstance, '', this.items); .call(this.atwhoInstance, '', this.items);
}); });
...@@ -38,7 +40,7 @@ describe('GfmAutoComplete', function () { ...@@ -38,7 +40,7 @@ describe('GfmAutoComplete', function () {
it('should enable highlightFirst if alwaysHighlightFirst is set', function () { it('should enable highlightFirst if alwaysHighlightFirst is set', function () {
const atwhoInstance = { setting: { alwaysHighlightFirst: true } }; const atwhoInstance = { setting: { alwaysHighlightFirst: true } };
GfmAutoComplete.DefaultOptions.sorter.call(atwhoInstance); gfmAutoCompleteCallbacks.sorter.call(atwhoInstance);
expect(atwhoInstance.setting.highlightFirst).toBe(true); expect(atwhoInstance.setting.highlightFirst).toBe(true);
}); });
...@@ -46,7 +48,7 @@ describe('GfmAutoComplete', function () { ...@@ -46,7 +48,7 @@ describe('GfmAutoComplete', function () {
it('should enable highlightFirst if a query is present', function () { it('should enable highlightFirst if a query is present', function () {
const atwhoInstance = { setting: {} }; const atwhoInstance = { setting: {} };
GfmAutoComplete.DefaultOptions.sorter.call(atwhoInstance, 'query'); gfmAutoCompleteCallbacks.sorter.call(atwhoInstance, 'query');
expect(atwhoInstance.setting.highlightFirst).toBe(true); expect(atwhoInstance.setting.highlightFirst).toBe(true);
}); });
...@@ -58,7 +60,7 @@ describe('GfmAutoComplete', function () { ...@@ -58,7 +60,7 @@ describe('GfmAutoComplete', function () {
const items = []; const items = [];
const searchKey = 'searchKey'; const searchKey = 'searchKey';
GfmAutoComplete.DefaultOptions.sorter.call(atwhoInstance, query, items, searchKey); gfmAutoCompleteCallbacks.sorter.call(atwhoInstance, query, items, searchKey);
expect($.fn.atwho.default.callbacks.sorter).toHaveBeenCalledWith(query, items, searchKey); expect($.fn.atwho.default.callbacks.sorter).toHaveBeenCalledWith(query, items, searchKey);
}); });
...@@ -67,7 +69,7 @@ describe('GfmAutoComplete', function () { ...@@ -67,7 +69,7 @@ describe('GfmAutoComplete', function () {
describe('DefaultOptions.matcher', function () { describe('DefaultOptions.matcher', function () {
const defaultMatcher = (context, flag, subtext) => ( const defaultMatcher = (context, flag, subtext) => (
GfmAutoComplete.DefaultOptions.matcher.call(context, flag, subtext) gfmAutoCompleteCallbacks.matcher.call(context, flag, subtext)
); );
const flagsUseDefaultMatcher = ['@', '#', '!', '~', '%']; const flagsUseDefaultMatcher = ['@', '#', '!', '~', '%'];
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment