summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPhil Hughes <me@iamphill.com>2017-05-16 10:32:55 +0000
committerkushalpandya <kushal@gitlab.com>2017-05-19 14:04:54 +0530
commit05aad53440547306771390d2958b4bd4b831b8aa (patch)
treee0e66d4448af87388d47ec9b4891ba6e4eea018f
parentc5247a596d0dded76e4f9589a6c5e284583affa9 (diff)
downloadgitlab-ce-05aad53440547306771390d2958b4bd4b831b8aa.tar.gz
Merge branch 'winh-autocomplete-error' into 'master'
Replace broken autocomplete field for new tags with dropdown Closes #32127 See merge request !11290
-rw-r--r--app/assets/javascripts/dispatcher.js3
-rw-r--r--app/assets/javascripts/new_branch_form.js47
-rw-r--r--app/assets/javascripts/ref_select_dropdown.js46
-rw-r--r--app/views/projects/tags/new.html.haml19
-rw-r--r--spec/features/tags/master_creates_tag_spec.rb16
5 files changed, 77 insertions, 54 deletions
diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index c316ff64219..38c1c4c45b4 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -51,6 +51,8 @@ import ShortcutsWiki from './shortcuts_wiki';
import Pipelines from './pipelines';
import BlobViewer from './blob/viewer/index';
import AutoWidthDropdownSelect from './issuable/auto_width_dropdown_select';
+import UsersSelect from './users_select';
+import RefSelectDropdown from './ref_select_dropdown';
const ShortcutsBlob = require('./shortcuts_blob');
@@ -204,6 +206,7 @@ const ShortcutsBlob = require('./shortcuts_blob');
case 'projects:tags:new':
new ZenMode();
new gl.GLForm($('.tag-form'));
+ new RefSelectDropdown($('.js-branch-select'), window.gl.availableRefs);
break;
case 'projects:releases:edit':
new ZenMode();
diff --git a/app/assets/javascripts/new_branch_form.js b/app/assets/javascripts/new_branch_form.js
index 67046d52a65..4903875dfa0 100644
--- a/app/assets/javascripts/new_branch_form.js
+++ b/app/assets/javascripts/new_branch_form.js
@@ -1,4 +1,6 @@
/* eslint-disable func-names, space-before-function-paren, no-var, one-var, prefer-rest-params, max-len, vars-on-top, wrap-iife, consistent-return, comma-dangle, one-var-declaration-per-line, quotes, no-return-assign, prefer-arrow-callback, prefer-template, no-shadow, no-else-return, max-len, object-shorthand */
+import RefSelectDropdown from '~/ref_select_dropdown';
+
(function() {
var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; },
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; };
@@ -9,7 +11,7 @@
this.branchNameError = form.find('.js-branch-name-error');
this.name = form.find('.js-branch-name');
this.ref = form.find('#ref');
- this.setupAvailableRefs(availableRefs);
+ new RefSelectDropdown($('.js-branch-select'), availableRefs); // eslint-disable-line no-new
this.setupRestrictions();
this.addBinding();
this.init();
@@ -25,49 +27,6 @@
}
};
- NewBranchForm.prototype.setupAvailableRefs = function(availableRefs) {
- var $branchSelect = $('.js-branch-select');
-
- $branchSelect.glDropdown({
- data: availableRefs,
- filterable: true,
- filterByText: true,
- remote: false,
- fieldName: $branchSelect.data('field-name'),
- filterInput: 'input[type="search"]',
- selectable: true,
- isSelectable: function(branch, $el) {
- return !$el.hasClass('is-active');
- },
- text: function(branch) {
- return branch;
- },
- id: function(branch) {
- return branch;
- },
- toggleLabel: function(branch) {
- if (branch) {
- return branch;
- }
- }
- });
-
- const $dropdownContainer = $branchSelect.closest('.dropdown');
- const $fieldInput = $(`input[name="${$branchSelect.data('field-name')}"]`, $dropdownContainer);
- const $filterInput = $('input[type="search"]', $dropdownContainer);
-
- $filterInput.on('keyup', (e) => {
- const keyCode = e.keyCode || e.which;
- if (keyCode !== 13) return;
-
- const text = $filterInput.val();
- $fieldInput.val(text);
- $('.dropdown-toggle-text', $branchSelect).text(text);
-
- $dropdownContainer.removeClass('open');
- });
- };
-
NewBranchForm.prototype.setupRestrictions = function() {
var endsWith, invalid, single, startsWith;
startsWith = {
diff --git a/app/assets/javascripts/ref_select_dropdown.js b/app/assets/javascripts/ref_select_dropdown.js
new file mode 100644
index 00000000000..215cd6fbdfd
--- /dev/null
+++ b/app/assets/javascripts/ref_select_dropdown.js
@@ -0,0 +1,46 @@
+class RefSelectDropdown {
+ constructor($dropdownButton, availableRefs) {
+ $dropdownButton.glDropdown({
+ data: availableRefs,
+ filterable: true,
+ filterByText: true,
+ remote: false,
+ fieldName: $dropdownButton.data('field-name'),
+ filterInput: 'input[type="search"]',
+ selectable: true,
+ isSelectable(branch, $el) {
+ return !$el.hasClass('is-active');
+ },
+ text(branch) {
+ return branch;
+ },
+ id(branch) {
+ return branch;
+ },
+ toggleLabel(branch) {
+ return branch;
+ },
+ });
+
+ const $dropdownContainer = $dropdownButton.closest('.dropdown');
+ const $fieldInput = $(`input[name="${$dropdownButton.data('field-name')}"]`, $dropdownContainer);
+ const $filterInput = $('input[type="search"]', $dropdownContainer);
+
+ $filterInput.on('keyup', (e) => {
+ const keyCode = e.keyCode || e.which;
+ if (keyCode !== 13) return;
+
+ const ref = $filterInput.val().trim();
+ if (ref === '') {
+ return;
+ }
+
+ $fieldInput.val(ref);
+ $('.dropdown-toggle-text', $dropdownButton).text(ref);
+
+ $dropdownContainer.removeClass('open');
+ });
+ }
+}
+
+export default RefSelectDropdown;
diff --git a/app/views/projects/tags/new.html.haml b/app/views/projects/tags/new.html.haml
index 7c607d2956b..ce0eaff3060 100644
--- a/app/views/projects/tags/new.html.haml
+++ b/app/views/projects/tags/new.html.haml
@@ -1,4 +1,5 @@
- page_title "New Tag"
+- default_ref = params[:ref] || @project.default_branch
- if @error
.alert.alert-danger
@@ -16,9 +17,13 @@
= text_field_tag :tag_name, params[:tag_name], required: true, tabindex: 1, autofocus: true, class: 'form-control'
.form-group
= label_tag :ref, 'Create from', class: 'control-label'
- .col-sm-10
- = text_field_tag :ref, params[:ref] || @project.default_branch, required: true, tabindex: 2, class: 'form-control'
- .help-block Branch name or commit SHA
+ .col-sm-10.create-from
+ .dropdown
+ = hidden_field_tag :ref, default_ref
+ = button_tag type: 'button', title: default_ref, class: 'dropdown-menu-toggle wide form-control js-branch-select', required: true, data: { toggle: 'dropdown', selected: default_ref, field_name: 'ref' } do
+ .text-left.dropdown-toggle-text= default_ref
+ = render 'shared/ref_dropdown', dropdown_class: 'wide'
+ .help-block Existing branch name, tag, or commit SHA
.form-group
= label_tag :message, nil, class: 'control-label'
.col-sm-10
@@ -37,9 +42,5 @@
= link_to 'Cancel', namespace_project_tags_path(@project.namespace, @project), class: 'btn btn-cancel'
:javascript
- var availableRefs = #{@project.repository.ref_names.to_json};
-
- $("#ref").autocomplete({
- source: availableRefs,
- minLength: 1
- });
+ window.gl = window.gl || { };
+ window.gl.availableRefs = #{@project.repository.ref_names.to_json};
diff --git a/spec/features/tags/master_creates_tag_spec.rb b/spec/features/tags/master_creates_tag_spec.rb
index ca25c696f75..af25eebed13 100644
--- a/spec/features/tags/master_creates_tag_spec.rb
+++ b/spec/features/tags/master_creates_tag_spec.rb
@@ -51,10 +51,24 @@ feature 'Master creates tag', feature: true do
end
end
+ scenario 'opens dropdown for ref', js: true do
+ click_link 'New tag'
+ ref_row = find('.form-group:nth-of-type(2) .col-sm-10')
+ page.within ref_row do
+ ref_input = find('[name="ref"]', visible: false)
+ expect(ref_input.value).to eq 'master'
+ expect(find('.dropdown-toggle-text')).to have_content 'master'
+
+ find('.js-branch-select').trigger('click')
+
+ expect(find('.dropdown-menu')).to have_content 'empty-branch'
+ end
+ end
+
def create_tag_in_form(tag:, ref:, message: nil, desc: nil)
click_link 'New tag'
fill_in 'tag_name', with: tag
- fill_in 'ref', with: ref
+ find('#ref', visible: false).set(ref)
fill_in 'message', with: message unless message.nil?
fill_in 'release_description', with: desc unless desc.nil?
click_button 'Create tag'