From 38fbfb9fe6d52e1a36b16ccc2a9da9ae01561cca Mon Sep 17 00:00:00 2001 From: Robert Speicher Date: Mon, 5 Oct 2015 18:03:14 -0400 Subject: Require jquery.turbolinks in all JS specs Side-effect: This simplifies the requiresInput handler --- app/assets/javascripts/behaviors/requires_input.js.coffee | 3 +-- spec/javascripts/spec_helper.coffee | 1 + 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/behaviors/requires_input.js.coffee b/app/assets/javascripts/behaviors/requires_input.js.coffee index 8318fe435b3..79d750d1847 100644 --- a/app/assets/javascripts/behaviors/requires_input.js.coffee +++ b/app/assets/javascripts/behaviors/requires_input.js.coffee @@ -34,6 +34,5 @@ $.fn.requiresInput = -> $form.on 'change input', fieldSelector, requireInput -# Triggered on standard document `ready` and on Turbolinks `page:load` events -$(document).on 'ready page:load', -> +$ -> $('form.js-requires-input').requiresInput() diff --git a/spec/javascripts/spec_helper.coffee b/spec/javascripts/spec_helper.coffee index 47b41dd2c81..90b02a6aec5 100644 --- a/spec/javascripts/spec_helper.coffee +++ b/spec/javascripts/spec_helper.coffee @@ -9,6 +9,7 @@ # require the specific files that are being used in the spec that tests them. #= require jquery +#= require jquery.turbolinks #= require bootstrap #= require underscore -- cgit v1.2.1 From 01d0926bc16bb82ef676c35a5a61b8e90a82654c Mon Sep 17 00:00:00 2001 From: Robert Speicher Date: Mon, 5 Oct 2015 18:19:11 -0400 Subject: Add "Quick Submit" JS behavior --- .../javascripts/behaviors/quick_submit.js.coffee | 29 ++++++++++ .../behaviors/quick_submit_spec.js.coffee | 65 ++++++++++++++++++++++ .../fixtures/behaviors/quick_submit.html.haml | 6 ++ 3 files changed, 100 insertions(+) create mode 100644 app/assets/javascripts/behaviors/quick_submit.js.coffee create mode 100644 spec/javascripts/behaviors/quick_submit_spec.js.coffee create mode 100644 spec/javascripts/fixtures/behaviors/quick_submit.html.haml diff --git a/app/assets/javascripts/behaviors/quick_submit.js.coffee b/app/assets/javascripts/behaviors/quick_submit.js.coffee new file mode 100644 index 00000000000..dc9bd4d94cc --- /dev/null +++ b/app/assets/javascripts/behaviors/quick_submit.js.coffee @@ -0,0 +1,29 @@ +# Quick Submit behavior +# +# When an input field with the `js-quick-submit` class receives a "Meta+Enter" +# (Mac) or "Ctrl+Enter" (Linux/Windows) key combination, its parent form is +# submitted. +# +#= require extensions/jquery +# +# ### Example Markup +# +#
+# +# +#
+# +$(document).on 'keydown.quick_submit', '.js-quick-submit', (e) -> + return if e.repeat + return unless e.keyCode == 13 # Enter + + if navigator.userAgent.match(/Macintosh/) + return unless (e.metaKey && !e.altKey && !e.ctrlKey && !e.shiftKey) + else + return unless (e.ctrlKey && !e.altKey && !e.metaKey && !e.shiftKey) + + e.preventDefault() + + $form = $(e.target).closest('form') + $form.find('input[type=submit], button[type=submit]').disable() + $form.submit() diff --git a/spec/javascripts/behaviors/quick_submit_spec.js.coffee b/spec/javascripts/behaviors/quick_submit_spec.js.coffee new file mode 100644 index 00000000000..6beef28741b --- /dev/null +++ b/spec/javascripts/behaviors/quick_submit_spec.js.coffee @@ -0,0 +1,65 @@ +#= require behaviors/quick_submit + +describe 'Quick Submit behavior', -> + fixture.preload('behaviors/quick_submit.html') + + beforeEach -> + fixture.load('behaviors/quick_submit.html') + + # Prevent a form submit from moving us off the testing page + $('form').submit (e) -> e.preventDefault() + + @spies = { + submit: spyOnEvent('form', 'submit') + } + + it 'does not respond to other keyCodes', -> + $('input').trigger(keydownEvent(keyCode: 32)) + + expect(@spies.submit).not.toHaveBeenTriggered() + + it 'does not respond to Enter alone', -> + $('input').trigger(keydownEvent(ctrlKey: false, metaKey: false)) + + expect(@spies.submit).not.toHaveBeenTriggered() + + it 'disables submit buttons', -> + $('textarea').trigger(keydownEvent()) + + expect($('input[type=submit]')).toBeDisabled() + expect($('button[type=submit]')).toBeDisabled() + + # We cannot stub `navigator.userAgent` for CI's `rake teaspoon` task, so we'll + # only run the tests that apply to the current platform + if navigator.userAgent.match(/Macintosh/) + it 'responds to Meta+Enter', -> + $('input').trigger(keydownEvent()) + + expect(@spies.submit).toHaveBeenTriggered() + + it 'excludes other modifier keys', -> + $('input').trigger(keydownEvent(altKey: true)) + $('input').trigger(keydownEvent(ctrlKey: true)) + $('input').trigger(keydownEvent(shiftKey: true)) + + expect(@spies.submit).not.toHaveBeenTriggered() + else + it 'responds to Ctrl+Enter', -> + $('input').trigger(keydownEvent()) + + expect(@spies.submit).toHaveBeenTriggered() + + it 'excludes other modifier keys', -> + $('input').trigger(keydownEvent(altKey: true)) + $('input').trigger(keydownEvent(metaKey: true)) + $('input').trigger(keydownEvent(shiftKey: true)) + + expect(@spies.submit).not.toHaveBeenTriggered() + + keydownEvent = (options) -> + if navigator.userAgent.match(/Macintosh/) + defaults = { keyCode: 13, metaKey: true } + else + defaults = { keyCode: 13, ctrlKey: true } + + $.Event('keydown', $.extend({}, defaults, options)) diff --git a/spec/javascripts/fixtures/behaviors/quick_submit.html.haml b/spec/javascripts/fixtures/behaviors/quick_submit.html.haml new file mode 100644 index 00000000000..b80a28a33ea --- /dev/null +++ b/spec/javascripts/fixtures/behaviors/quick_submit.html.haml @@ -0,0 +1,6 @@ +%form{ action: '/foo' } + %input.js-quick-submit{ type: 'text' } + %textarea.js-quick-submit + + %input{ type: 'submit'} Submit + %button.btn{ type: 'submit' } Submit -- cgit v1.2.1 From 2ed5a5b70df6e4c9b4b9afd0e1cac12f267676e8 Mon Sep 17 00:00:00 2001 From: Robert Speicher Date: Mon, 5 Oct 2015 18:20:00 -0400 Subject: Remove "quick submit" behavior specific to the Notes JS --- app/assets/javascripts/notes.js.coffee | 7 ------- 1 file changed, 7 deletions(-) diff --git a/app/assets/javascripts/notes.js.coffee b/app/assets/javascripts/notes.js.coffee index 4b9f0d68912..ea75c656bcc 100644 --- a/app/assets/javascripts/notes.js.coffee +++ b/app/assets/javascripts/notes.js.coffee @@ -63,12 +63,6 @@ class @Notes # fetch notes when tab becomes visible $(document).on "visibilitychange", @visibilityChange - # Chrome doesn't fire keypress or keyup for Command+Enter, so we need keydown. - $(document).on 'keydown', '.js-note-text', (e) -> - return if e.originalEvent.repeat - if e.keyCode == 10 || ((e.metaKey || e.ctrlKey) && e.keyCode == 13) - $(@).closest('form').submit() - cleanBinding: -> $(document).off "ajax:success", ".js-main-target-form" $(document).off "ajax:success", ".js-discussion-note-form" @@ -82,7 +76,6 @@ class @Notes $(document).off "click", ".js-discussion-reply-button" $(document).off "click", ".js-add-diff-note-button" $(document).off "visibilitychange" - $(document).off "keydown", ".js-note-text" $(document).off "keyup", ".js-note-text" $(document).off "click", ".js-note-target-reopen" $(document).off "click", ".js-note-target-close" -- cgit v1.2.1 From de3ff174e70a9048fc8f23cd5ee0c709471f3651 Mon Sep 17 00:00:00 2001 From: Robert Speicher Date: Mon, 5 Oct 2015 18:20:43 -0400 Subject: Quick Submit all the things! Adds quick submit behavior to the forms for: - Blobs ("new file") - Commit messages - Issuables - Notes - Labels - Milestones - Wikis --- app/views/projects/blob/_editor.html.haml | 2 +- app/views/projects/blob/new.html.haml | 2 +- app/views/projects/labels/_form.html.haml | 2 +- app/views/projects/milestones/_form.html.haml | 4 ++-- app/views/projects/notes/_edit_form.html.haml | 2 +- app/views/projects/notes/_form.html.haml | 2 +- app/views/projects/wikis/_form.html.haml | 2 +- app/views/shared/_commit_message_container.html.haml | 2 +- app/views/shared/issuable/_form.html.haml | 4 ++-- 9 files changed, 11 insertions(+), 11 deletions(-) diff --git a/app/views/projects/blob/_editor.html.haml b/app/views/projects/blob/_editor.html.haml index 9c3e1703c89..f1ad0c3c403 100644 --- a/app/views/projects/blob/_editor.html.haml +++ b/app/views/projects/blob/_editor.html.haml @@ -11,7 +11,7 @@ - if current_action?(:new) || current_action?(:create) \/ = text_field_tag 'file_name', params[:file_name], placeholder: "File name", - required: true, class: 'form-control new-file-name' + required: true, class: 'form-control new-file-name js-quick-submit' .pull-right = select_tag :encoding, options_for_select([ "base64", "text" ], "text"), class: 'form-control' diff --git a/app/views/projects/blob/new.html.haml b/app/views/projects/blob/new.html.haml index d7987e24ef3..7975137c37f 100644 --- a/app/views/projects/blob/new.html.haml +++ b/app/views/projects/blob/new.html.haml @@ -15,7 +15,7 @@ = label_tag 'branch', class: 'control-label' do Branch .col-sm-10 - = text_field_tag 'new_branch', @ref, class: "form-control" + = text_field_tag 'new_branch', @ref, class: "form-control js-quick-submit" = hidden_field_tag 'content', '', id: 'file-content' = render 'projects/commit_button', ref: @ref, diff --git a/app/views/projects/labels/_form.html.haml b/app/views/projects/labels/_form.html.haml index 534c545329b..4cf13492e99 100644 --- a/app/views/projects/labels/_form.html.haml +++ b/app/views/projects/labels/_form.html.haml @@ -10,7 +10,7 @@ .form-group = f.label :title, class: 'control-label' .col-sm-10 - = f.text_field :title, class: "form-control", required: true + = f.text_field :title, class: "form-control js-quick-submit", required: true .form-group = f.label :color, "Background Color", class: 'control-label' .col-sm-10 diff --git a/app/views/projects/milestones/_form.html.haml b/app/views/projects/milestones/_form.html.haml index 74e9668052d..255ddab479f 100644 --- a/app/views/projects/milestones/_form.html.haml +++ b/app/views/projects/milestones/_form.html.haml @@ -16,13 +16,13 @@ .form-group = f.label :title, "Title", class: "control-label" .col-sm-10 - = f.text_field :title, maxlength: 255, class: "form-control", required: true + = f.text_field :title, maxlength: 255, class: "form-control js-quick-submit", required: true %p.hint Required .form-group.milestone-description = f.label :description, "Description", class: "control-label" .col-sm-10 = render layout: 'projects/md_preview', locals: { preview_class: "md-preview" } do - = render 'projects/zen', f: f, attr: :description, classes: 'description form-control' + = render 'projects/zen', f: f, attr: :description, classes: 'description form-control js-quick-submit' .hint .pull-left Milestones are parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"), target: '_blank'}. .pull-left Attach files by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector' }. diff --git a/app/views/projects/notes/_edit_form.html.haml b/app/views/projects/notes/_edit_form.html.haml index a0e26f9827e..a21c019986a 100644 --- a/app/views/projects/notes/_edit_form.html.haml +++ b/app/views/projects/notes/_edit_form.html.haml @@ -2,7 +2,7 @@ = form_for note, url: namespace_project_note_path(@project.namespace, @project, note), method: :put, remote: true, authenticity_token: true do |f| = note_target_fields(note) = render layout: 'projects/md_preview', locals: { preview_class: 'md-preview' } do - = render 'projects/zen', f: f, attr: :note, classes: 'note_text js-note-text js-task-list-field' + = render 'projects/zen', f: f, attr: :note, classes: 'note_text js-note-text js-task-list-field js-quick-submit' = render 'projects/notes/hints' .note-form-actions diff --git a/app/views/projects/notes/_form.html.haml b/app/views/projects/notes/_form.html.haml index 512ccd48b38..13dfa0a1bb3 100644 --- a/app/views/projects/notes/_form.html.haml +++ b/app/views/projects/notes/_form.html.haml @@ -8,7 +8,7 @@ = f.hidden_field :noteable_type = render layout: 'projects/md_preview', locals: { preview_class: "md-preview", referenced_users: true } do - = render 'projects/zen', f: f, attr: :note, classes: 'note_text js-note-text' + = render 'projects/zen', f: f, attr: :note, classes: 'note_text js-note-text js-quick-submit' = render 'projects/notes/hints' .error-alert diff --git a/app/views/projects/wikis/_form.html.haml b/app/views/projects/wikis/_form.html.haml index 05d754adbe5..261d4a92d7d 100644 --- a/app/views/projects/wikis/_form.html.haml +++ b/app/views/projects/wikis/_form.html.haml @@ -22,7 +22,7 @@ = f.label :content, class: 'control-label' .col-sm-10 = render layout: 'projects/md_preview', locals: { preview_class: "md-preview" } do - = render 'projects/zen', f: f, attr: :content, classes: 'description form-control' + = render 'projects/zen', f: f, attr: :content, classes: 'description form-control js-quick-submit' .col-sm-12.hint .pull-left Wiki content is parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"), target: '_blank'} .pull-right Attach files by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector' }. diff --git a/app/views/shared/_commit_message_container.html.haml b/app/views/shared/_commit_message_container.html.haml index 5071ff640f1..cc3f1268f8b 100644 --- a/app/views/shared/_commit_message_container.html.haml +++ b/app/views/shared/_commit_message_container.html.haml @@ -6,7 +6,7 @@ .max-width-marker = text_area_tag 'commit_message', (params[:commit_message] || local_assigns[:text]), - class: 'form-control', placeholder: local_assigns[:placeholder], + class: 'form-control js-quick-submit', placeholder: local_assigns[:placeholder], required: true, rows: (local_assigns[:rows] || 3) - if local_assigns[:hint] %p.hint diff --git a/app/views/shared/issuable/_form.html.haml b/app/views/shared/issuable/_form.html.haml index 33ec726e93c..594e54f404c 100644 --- a/app/views/shared/issuable/_form.html.haml +++ b/app/views/shared/issuable/_form.html.haml @@ -10,7 +10,7 @@ %strong= 'Title *' .col-sm-10 = f.text_field :title, maxlength: 255, autofocus: true, autocomplete: 'off', - class: 'form-control pad js-gfm-input', required: true + class: 'form-control pad js-gfm-input js-quick-submit', required: true - if issuable.is_a?(MergeRequest) %p.help-block @@ -26,7 +26,7 @@ = render layout: 'projects/md_preview', locals: { preview_class: "md-preview", referenced_users: true } do = render 'projects/zen', f: f, attr: :description, - classes: 'description form-control' + classes: 'description form-control js-quick-submit' .col-sm-12.hint .pull-left Parsed with -- cgit v1.2.1 From f96c6c43c49c8c423f42a99ae27e02d47f04c748 Mon Sep 17 00:00:00 2001 From: Robert Speicher Date: Mon, 5 Oct 2015 18:31:18 -0400 Subject: Add CHANGELOG entry for "Quick Submit" [ci skip] --- CHANGELOG | 2 ++ 1 file changed, 2 insertions(+) diff --git a/CHANGELOG b/CHANGELOG index 8ab2d9f08da..74d9ff97326 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -37,6 +37,8 @@ v 8.1.0 (unreleased) - Use commit status in merge request widget as preffered source of CI status - Integrate CI commit and build pages into project pages - Move CI services page to project settings area + - Add "Quick Submit" behavior to input fields throughout the application. Use + Cmd+Enter on Mac and Ctrl+Enter on Windows/Linux. v 8.0.4 - Fix Message-ID header to be RFC 2111-compliant to prevent e-mails being dropped (Stan Hu) -- cgit v1.2.1 From fcf99d0d09d63d0662290658ebc1e366bfc11bf0 Mon Sep 17 00:00:00 2001 From: Robert Speicher Date: Wed, 7 Oct 2015 15:19:26 -0400 Subject: Check originalEvent.repeat --- app/assets/javascripts/behaviors/quick_submit.js.coffee | 2 +- spec/javascripts/behaviors/quick_submit_spec.js.coffee | 10 +++++++++- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/behaviors/quick_submit.js.coffee b/app/assets/javascripts/behaviors/quick_submit.js.coffee index dc9bd4d94cc..0748eed763c 100644 --- a/app/assets/javascripts/behaviors/quick_submit.js.coffee +++ b/app/assets/javascripts/behaviors/quick_submit.js.coffee @@ -14,7 +14,7 @@ # # $(document).on 'keydown.quick_submit', '.js-quick-submit', (e) -> - return if e.repeat + return if e.originalEvent.repeat return unless e.keyCode == 13 # Enter if navigator.userAgent.match(/Macintosh/) diff --git a/spec/javascripts/behaviors/quick_submit_spec.js.coffee b/spec/javascripts/behaviors/quick_submit_spec.js.coffee index 6beef28741b..fd20f674746 100644 --- a/spec/javascripts/behaviors/quick_submit_spec.js.coffee +++ b/spec/javascripts/behaviors/quick_submit_spec.js.coffee @@ -23,6 +23,11 @@ describe 'Quick Submit behavior', -> expect(@spies.submit).not.toHaveBeenTriggered() + it 'does not respond to repeated events', -> + $('input').trigger(keydownEvent(repeat: true)) + + expect(@spies.submit).not.toHaveBeenTriggered() + it 'disables submit buttons', -> $('textarea').trigger(keydownEvent()) @@ -62,4 +67,7 @@ describe 'Quick Submit behavior', -> else defaults = { keyCode: 13, ctrlKey: true } - $.Event('keydown', $.extend({}, defaults, options)) + args = $.extend({}, defaults, options) + originalEvent = new KeyboardEvent('keydown', args) + + $.Event('keydown', $.extend({}, args, {originalEvent: originalEvent})) -- cgit v1.2.1 From dbf9ccbcfe788beb24cda34b0d86b7e12ecdf4bb Mon Sep 17 00:00:00 2001 From: Robert Speicher Date: Wed, 7 Oct 2015 17:59:10 -0400 Subject: Check originalEvent.repeat *and* event.repeat phantomjs < 2.0 doesn't support creating `KeyboardEvent` so the tests were failing on CI --- app/assets/javascripts/behaviors/quick_submit.js.coffee | 2 +- spec/javascripts/behaviors/quick_submit_spec.js.coffee | 5 +---- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/app/assets/javascripts/behaviors/quick_submit.js.coffee b/app/assets/javascripts/behaviors/quick_submit.js.coffee index 0748eed763c..4ec8531d580 100644 --- a/app/assets/javascripts/behaviors/quick_submit.js.coffee +++ b/app/assets/javascripts/behaviors/quick_submit.js.coffee @@ -14,7 +14,7 @@ # # $(document).on 'keydown.quick_submit', '.js-quick-submit', (e) -> - return if e.originalEvent.repeat + return if (e.originalEvent && e.originalEvent.repeat) || e.repeat return unless e.keyCode == 13 # Enter if navigator.userAgent.match(/Macintosh/) diff --git a/spec/javascripts/behaviors/quick_submit_spec.js.coffee b/spec/javascripts/behaviors/quick_submit_spec.js.coffee index fd20f674746..09708c12ed4 100644 --- a/spec/javascripts/behaviors/quick_submit_spec.js.coffee +++ b/spec/javascripts/behaviors/quick_submit_spec.js.coffee @@ -67,7 +67,4 @@ describe 'Quick Submit behavior', -> else defaults = { keyCode: 13, ctrlKey: true } - args = $.extend({}, defaults, options) - originalEvent = new KeyboardEvent('keydown', args) - - $.Event('keydown', $.extend({}, args, {originalEvent: originalEvent})) + $.Event('keydown', $.extend({}, defaults, options)) -- cgit v1.2.1