From 5700842ba8ca2f3100395a9fb98c759e78e63d96 Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Wed, 15 Oct 2014 02:21:21 -0500 Subject: Add Markdown preview to more forms Enable Markdown previews when creating and editing issues, merge requests, and milestones, and when editing notes. --- app/assets/javascripts/markdown_area.js.coffee | 45 ++++++++++++++++++ app/assets/javascripts/notes.js.coffee | 55 ++-------------------- app/assets/stylesheets/generic/markdown_area.scss | 25 ++++++++++ app/assets/stylesheets/sections/notes.scss | 10 ---- app/controllers/projects/notes_controller.rb | 4 -- app/controllers/projects_controller.rb | 4 ++ app/views/projects/_issuable_form.html.haml | 25 +++++----- app/views/projects/_md_preview.html.haml | 12 +++++ .../projects/merge_requests/_new_submit.html.haml | 13 ++--- app/views/projects/milestones/_form.html.haml | 11 +++-- app/views/projects/notes/_form.html.haml | 22 +++------ app/views/projects/notes/_note.html.haml | 3 +- config/routes.rb | 5 +- features/project/issues/issues.feature | 27 +++++++++++ features/project/merge_requests.feature | 31 ++++++++++++ features/steps/project/merge_requests.rb | 4 ++ features/steps/shared/diff_note.rb | 14 +++--- features/steps/shared/markdown.rb | 39 +++++++++++++++ features/steps/shared/note.rb | 12 ++--- spec/features/notes_on_merge_requests_spec.rb | 12 ++--- spec/routing/project_routing_spec.rb | 28 ++++++----- 21 files changed, 260 insertions(+), 141 deletions(-) create mode 100644 app/views/projects/_md_preview.html.haml diff --git a/app/assets/javascripts/markdown_area.js.coffee b/app/assets/javascripts/markdown_area.js.coffee index a0ebfc98ce6..a4bd4774dc9 100644 --- a/app/assets/javascripts/markdown_area.js.coffee +++ b/app/assets/javascripts/markdown_area.js.coffee @@ -24,6 +24,51 @@ $(document).ready -> "opacity": 0 "display": "none" + # Preview button + $(document).off "click", ".js-md-preview-button" + $(document).on "click", ".js-md-preview-button", (e) -> + ### + Shows the Markdown preview. + + Lets the server render GFM into Html and displays it. + ### + e.preventDefault() + form = $(this).closest("form") + # toggle tabs + form.find(".js-md-write-button").parent().removeClass "active" + form.find(".js-md-preview-button").parent().addClass "active" + + # toggle content + form.find(".md-write-holder").hide() + form.find(".md-preview-holder").show() + + preview = form.find(".js-md-preview") + mdText = form.find(".markdown-area").val() + if mdText.trim().length is 0 + preview.text "Nothing to preview." + else + preview.text "Loading..." + $.post($(this).data("url"), + md_text: mdText + ).success (previewData) -> + preview.html previewData + + # Write button + $(document).off "click", ".js-md-write-button" + $(document).on "click", ".js-md-write-button", (e) -> + ### + Shows the Markdown textarea. + ### + e.preventDefault() + form = $(this).closest("form") + # toggle tabs + form.find(".js-md-write-button").parent().addClass "active" + form.find(".js-md-preview-button").parent().removeClass "active" + + # toggle content + form.find(".md-write-holder").show() + form.find(".md-preview-holder").hide() + dropzone = $(".div-dropzone").dropzone( url: project_image_path_upload dictDefaultMessage: "" diff --git a/app/assets/javascripts/notes.js.coffee b/app/assets/javascripts/notes.js.coffee index ba8d7a9a2f5..b6bb0c42ad4 100644 --- a/app/assets/javascripts/notes.js.coffee +++ b/app/assets/javascripts/notes.js.coffee @@ -36,12 +36,6 @@ class Notes # delete note attachment $(document).on "click", ".js-note-attachment-delete", @removeAttachment - # Preview button - $(document).on "click", ".js-note-preview-button", @previewNote - - # Preview button - $(document).on "click", ".js-note-write-button", @writeNote - # reset main target form after submit $(document).on "ajax:complete", ".js-main-target-form", @resetMainTargetForm @@ -77,8 +71,6 @@ class Notes $(document).off "click", ".note-edit-cancel" $(document).off "click", ".js-note-delete" $(document).off "click", ".js-note-attachment-delete" - $(document).off "click", ".js-note-preview-button" - $(document).off "click", ".js-note-write-button" $(document).off "ajax:complete", ".js-main-target-form" $(document).off "click", ".js-choose-note-attachment-button" $(document).off "click", ".js-discussion-reply-button" @@ -165,47 +157,6 @@ class Notes # cleanup after successfully creating a diff/discussion note @removeDiscussionNoteForm(form) - ### - Shows write note textarea. - ### - writeNote: (e) -> - e.preventDefault() - form = $(this).closest("form") - # toggle tabs - form.find(".js-note-write-button").parent().addClass "active" - form.find(".js-note-preview-button").parent().removeClass "active" - - # toggle content - form.find(".note-write-holder").show() - form.find(".note-preview-holder").hide() - - ### - Shows the note preview. - - Lets the server render GFM into Html and displays it. - ### - previewNote: (e) -> - e.preventDefault() - form = $(this).closest("form") - # toggle tabs - form.find(".js-note-write-button").parent().removeClass "active" - form.find(".js-note-preview-button").parent().addClass "active" - - # toggle content - form.find(".note-write-holder").hide() - form.find(".note-preview-holder").show() - - preview = form.find(".js-note-preview") - noteText = form.find(".js-note-text").val() - if noteText.trim().length is 0 - preview.text "Nothing to preview." - else - preview.text "Loading..." - $.post($(this).data("url"), - note: noteText - ).success (previewData) -> - preview.html previewData - ### Called in response the main target form has been successfully submitted. @@ -220,7 +171,7 @@ class Notes form.find(".js-errors").remove() # reset text and preview - form.find(".js-note-write-button").click() + form.find(".js-md-write-button").click() form.find(".js-note-text").val("").trigger "input" ### @@ -270,8 +221,8 @@ class Notes form.removeClass "js-new-note-form" # setup preview buttons - form.find(".js-note-write-button, .js-note-preview-button").tooltip placement: "left" - previewButton = form.find(".js-note-preview-button") + form.find(".js-md-write-button, .js-md-preview-button").tooltip placement: "left" + previewButton = form.find(".js-md-preview-button") form.find(".js-note-text").on "input", -> if $(this).val().trim() isnt "" previewButton.removeClass("turn-off").addClass "turn-on" diff --git a/app/assets/stylesheets/generic/markdown_area.scss b/app/assets/stylesheets/generic/markdown_area.scss index fbfa72c5e5e..e8c21afabe1 100644 --- a/app/assets/stylesheets/generic/markdown_area.scss +++ b/app/assets/stylesheets/generic/markdown_area.scss @@ -50,3 +50,28 @@ margin-bottom: 0; transition: opacity 200ms ease-in-out; } + +.md-preview-holder { + background: #FFF; + border: 1px solid #ddd; + min-height: 100px; + padding: 5px; + font-size: 14px; + box-shadow: none; +} + +.new_note, +.edit_note, +.issuable-description, +.milestone-description, +.merge-request-form { + .nav-tabs { + margin-bottom: 0; + border: none; + + li a, + li.active a { + border: 1px solid #DDD; + } + } +} diff --git a/app/assets/stylesheets/sections/notes.scss b/app/assets/stylesheets/sections/notes.scss index 7eb42fddade..65ad46a4579 100644 --- a/app/assets/stylesheets/sections/notes.scss +++ b/app/assets/stylesheets/sections/notes.scss @@ -224,7 +224,6 @@ ul.notes { margin-bottom: 0; } - .note-preview-holder, .note_text { background: #FFF; border: 1px solid #ddd; @@ -243,15 +242,6 @@ ul.notes { .note_text { width: 100%; } - .nav-tabs { - margin-bottom: 0; - border: none; - - li a, - li.active a { - border: 1px solid #DDD; - } - } } /* loading indicator */ diff --git a/app/controllers/projects/notes_controller.rb b/app/controllers/projects/notes_controller.rb index 7b08b79d236..2f1d631c14a 100644 --- a/app/controllers/projects/notes_controller.rb +++ b/app/controllers/projects/notes_controller.rb @@ -61,10 +61,6 @@ class Projects::NotesController < Projects::ApplicationController end end - def preview - render text: view_context.markdown(params[:note]) - end - private def note diff --git a/app/controllers/projects_controller.rb b/app/controllers/projects_controller.rb index b3380a6ff23..aca091e7d2c 100644 --- a/app/controllers/projects_controller.rb +++ b/app/controllers/projects_controller.rb @@ -183,6 +183,10 @@ class ProjectsController < ApplicationController render json: { star_count: @project.star_count } end + def markdown_preview + render text: view_context.markdown(params[:md_text]) + end + private def upload_path diff --git a/app/views/projects/_issuable_form.html.haml b/app/views/projects/_issuable_form.html.haml index 6cdfab933b4..675b73a59cb 100644 --- a/app/views/projects/_issuable_form.html.haml +++ b/app/views/projects/_issuable_form.html.haml @@ -14,17 +14,20 @@ .form-group.issuable-description = f.label :description, 'Description', class: 'control-label' .col-sm-10 - = render 'projects/zen', f: f, attr: :description, - classes: 'description form-control' - .col-sm-12.hint - .pull-left - Parsed with - #{link_to 'GitLab Flavored Markdown', help_page_path('markdown', 'markdown'), target: '_blank'}. - .pull-right - Attach images (JPG, PNG, GIF) by dragging & dropping - or #{link_to 'selecting them', '#', class: 'markdown-selector' }. - .clearfix - .error-alert + + = render layout: 'projects/md_preview' do + = render 'projects/zen', f: f, attr: :description, + classes: 'description form-control' + .col-sm-12.hint + .pull-left + Parsed with + #{link_to 'GitLab Flavored Markdown', help_page_path('markdown', 'markdown'), target: '_blank'}. + .pull-right + Attach images (JPG, PNG, GIF) by dragging & dropping + or #{link_to 'selecting them', '#', class: 'markdown-selector' }. + + .clearfix + .error-alert %hr .form-group .issue-assignee diff --git a/app/views/projects/_md_preview.html.haml b/app/views/projects/_md_preview.html.haml new file mode 100644 index 00000000000..dbbf8e3bf97 --- /dev/null +++ b/app/views/projects/_md_preview.html.haml @@ -0,0 +1,12 @@ +%ul.nav.nav-tabs + %li.active + = link_to '#md-write-holder', class: 'js-md-write-button' do + Write + %li + = link_to '#md-preview-holder', class: 'js-md-preview-button', data: { url: markdown_preview_project_path(@project) } do + Preview +%div + .md-write-holder + = yield + .md-preview-holder.hide + .js-md-preview diff --git a/app/views/projects/merge_requests/_new_submit.html.haml b/app/views/projects/merge_requests/_new_submit.html.haml index d4666eacd7e..76813e688b5 100644 --- a/app/views/projects/merge_requests/_new_submit.html.haml +++ b/app/views/projects/merge_requests/_new_submit.html.haml @@ -21,12 +21,13 @@ .form-group .light = f.label :description, "Description" - = render 'projects/zen', f: f, attr: :description, - classes: 'description form-control' - .clearfix.hint - .pull-left Description is parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"), target: '_blank'}. - .pull-right Attach images (JPG, PNG, GIF) by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector' }. - .error-alert + = render layout: 'projects/md_preview' do + = render 'projects/zen', f: f, attr: :description, + classes: 'description form-control' + .clearfix.hint + .pull-left Description is parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"), target: '_blank'}. + .pull-right Attach images (JPG, PNG, GIF) by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector' }. + .error-alert .form-group .issue-assignee = f.label :assignee_id do diff --git a/app/views/projects/milestones/_form.html.haml b/app/views/projects/milestones/_form.html.haml index 5fb01a11cc5..0f51a347f01 100644 --- a/app/views/projects/milestones/_form.html.haml +++ b/app/views/projects/milestones/_form.html.haml @@ -18,13 +18,14 @@ .col-sm-10 = f.text_field :title, maxlength: 255, class: "form-control" %p.hint Required - .form-group + .form-group.milestone-description = f.label :description, "Description", class: "control-label" .col-sm-10 - = render 'projects/zen', f: f, attr: :description, classes: 'description form-control' - .hint - .pull-left Milestones are parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"), target: '_blank'}. - .pull-left Attach images (JPG, PNG, GIF) by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector' }. + = render layout: 'projects/md_preview' do + = render 'projects/zen', f: f, attr: :description, classes: 'description form-control' + .hint + .pull-left Milestones are parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"), target: '_blank'}. + .pull-left Attach images (JPG, PNG, GIF) by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector' }. .clearfix .error-alert .col-md-6 diff --git a/app/views/projects/notes/_form.html.haml b/app/views/projects/notes/_form.html.haml index c68b3817e79..05946162d3b 100644 --- a/app/views/projects/notes/_form.html.haml +++ b/app/views/projects/notes/_form.html.haml @@ -5,23 +5,13 @@ = f.hidden_field :noteable_id = f.hidden_field :noteable_type - %ul.nav.nav-tabs - %li.active - = link_to '#note-write-holder', class: 'js-note-write-button' do - Write - %li - = link_to '#note-preview-holder', class: 'js-note-preview-button', data: { url: preview_project_notes_path(@project) } do - Preview - %div - .note-write-holder - = render 'projects/zen', f: f, attr: :note, - classes: 'note_text js-note-text' - .light.clearfix - .pull-left Comments are parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"),{ target: '_blank', tabindex: -1 }} - .pull-right Attach images (JPG, PNG, GIF) by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector', tabindex: -1 }. + = render layout: 'projects/md_preview' do + = render 'projects/zen', f: f, attr: :note, + classes: 'note_text js-note-text' + .light.clearfix + .pull-left Comments are parsed with #{link_to "GitLab Flavored Markdown", help_page_path("markdown", "markdown"),{ target: '_blank', tabindex: -1 }} + .pull-right Attach images (JPG, PNG, GIF) by dragging & dropping or #{link_to "selecting them", '#', class: 'markdown-selector', tabindex: -1 }. - .note-preview-holder.hide - .js-note-preview .note-form-actions .buttons diff --git a/app/views/projects/notes/_note.html.haml b/app/views/projects/notes/_note.html.haml index 814bf19970c..aa52ff35d0c 100644 --- a/app/views/projects/notes/_note.html.haml +++ b/app/views/projects/notes/_note.html.haml @@ -38,7 +38,8 @@ .note-edit-form = form_for note, url: project_note_path(@project, note), method: :put, remote: true, authenticity_token: true do |f| - = f.text_area :note, class: 'note_text js-note-text js-gfm-input turn-on' + = render layout: 'projects/md_preview' do + = f.text_area :note, class: 'note_text js-note-text markdown-area js-gfm-input turn-on' .form-actions.clearfix = f.submit 'Save changes', class: "btn btn-primary btn-save js-comment-button" diff --git a/config/routes.rb b/config/routes.rb index 2534153758b..5dbb238ba6b 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -186,6 +186,7 @@ Gitlab::Application.routes.draw do post :unarchive post :upload_image post :toggle_star + post :markdown_preview get :autocomplete_sources get :import put :retry_import @@ -328,10 +329,6 @@ Gitlab::Application.routes.draw do member do delete :delete_attachment end - - collection do - post :preview - end end end end diff --git a/features/project/issues/issues.feature b/features/project/issues/issues.feature index 4db8551559b..e7fbe2bd6f1 100644 --- a/features/project/issues/issues.feature +++ b/features/project/issues/issues.feature @@ -159,3 +159,30 @@ Feature: Project Issues Given project "Shop" has "Tasks-closed" closed issue with task markdown When I visit issue page "Tasks-closed" Then Task checkboxes should be disabled + + # Issue description preview + + @javascript + Scenario: I can't preview without text + Given I click link "New Issue" + And I haven't written any description text + Then I should not see the Markdown preview button + + @javascript + Scenario: I can preview with text + Given I click link "New Issue" + And I write a description like "Nice" + Then I should see the Markdown preview button + + @javascript + Scenario: I preview an issue description + Given I click link "New Issue" + And I preview a description text like "Bug fixed :smile:" + Then I should see the Markdown preview + And I should not see the Markdown text field + + @javascript + Scenario: I can edit after preview + Given I click link "New Issue" + And I preview a description text like "Bug fixed :smile:" + Then I should see the Markdown edit button diff --git a/features/project/merge_requests.feature b/features/project/merge_requests.feature index d20358a7dc6..f1adf0bd34d 100644 --- a/features/project/merge_requests.feature +++ b/features/project/merge_requests.feature @@ -187,3 +187,34 @@ Feature: Project Merge Requests And I visit merge request page "MR-task-open" And I click link "Close" Then Task checkboxes should be disabled + + # Description preview + + @javascript + Scenario: I can't preview without text + Given I visit merge request page "Bug NS-04" + And I click link "Edit" + And I haven't written any description text + Then I should not see the Markdown preview button + + @javascript + Scenario: I can preview with text + Given I visit merge request page "Bug NS-04" + And I click link "Edit" + And I write a description like "Nice" + Then I should see the Markdown preview button + + @javascript + Scenario: I preview a merge request description + Given I visit merge request page "Bug NS-04" + And I click link "Edit" + And I preview a description text like "Bug fixed :smile:" + Then I should see the Markdown preview + And I should not see the Markdown text field + + @javascript + Scenario: I can edit after preview + Given I visit merge request page "Bug NS-04" + And I click link "Edit" + And I preview a description text like "Bug fixed :smile:" + Then I should see the Markdown edit button diff --git a/features/steps/project/merge_requests.rb b/features/steps/project/merge_requests.rb index fae0cec53a6..32bee9a563f 100644 --- a/features/steps/project/merge_requests.rb +++ b/features/steps/project/merge_requests.rb @@ -10,6 +10,10 @@ class Spinach::Features::ProjectMergeRequests < Spinach::FeatureSteps click_link "New Merge Request" end + step 'I click link "Edit"' do + click_link 'Edit' + end + step 'I click link "Bug NS-04"' do click_link "Bug NS-04" end diff --git a/features/steps/shared/diff_note.rb b/features/steps/shared/diff_note.rb index 10f3ed90b56..bd22e95daee 100644 --- a/features/steps/shared/diff_note.rb +++ b/features/steps/shared/diff_note.rb @@ -32,7 +32,7 @@ module SharedDiffNote click_diff_line(sample_commit.line_code) within("#{diff_file_selector} form[rel$='#{sample_commit.line_code}']") do fill_in "note[note]", with: "Should fix it :smile:" - find(".js-note-preview-button").trigger("click") + find('.js-md-preview-button').trigger('click') end end @@ -41,7 +41,7 @@ module SharedDiffNote within("#{diff_file_selector} form[rel$='#{sample_commit.del_line_code}']") do fill_in "note[note]", with: "DRY this up" - find(".js-note-preview-button").trigger("click") + find('.js-md-preview-button').trigger('click') end end @@ -73,7 +73,7 @@ module SharedDiffNote step 'I should not see the diff comment preview button' do within(diff_file_selector) do - page.should have_css(".js-note-preview-button", visible: false) + page.should have_css('.js-md-preview-button', visible: false) end end @@ -131,25 +131,25 @@ module SharedDiffNote step 'I should see the diff comment preview' do within("#{diff_file_selector} form") do - page.should have_css(".js-note-preview", visible: false) + page.should have_css('.js-md-preview', visible: false) end end step 'I should see the diff comment edit button' do within(diff_file_selector) do - page.should have_css(".js-note-write-button", visible: true) + page.should have_css('.js-md-write-button', visible: true) end end step 'I should see the diff comment preview button' do within(diff_file_selector) do - page.should have_css(".js-note-preview-button", visible: true) + page.should have_css('.js-md-preview-button', visible: true) end end step 'I should see two separate previews' do within(diff_file_selector) do - page.should have_css(".js-note-preview", visible: true, count: 2) + page.should have_css('.js-md-preview', visible: true, count: 2) page.should have_content("Should fix it") page.should have_content("DRY this up") end diff --git a/features/steps/shared/markdown.rb b/features/steps/shared/markdown.rb index 8bf138065b0..f3e61aa8e49 100644 --- a/features/steps/shared/markdown.rb +++ b/features/steps/shared/markdown.rb @@ -54,4 +54,43 @@ EOT 'div.description li.task-list-item input[type="checkbox"]:disabled' ) end + + step 'I should not see the Markdown preview' do + find('.gfm-form').should have_css('.js-md-preview', visible: false) + end + + step 'I should not see the Markdown preview button' do + find('.gfm-form').should have_css('.js-md-preview-button', visible: false) + end + + step 'I should not see the Markdown text field' do + find('.gfm-form').should have_css('textarea', visible: false) + end + + step 'I should see the Markdown edit button' do + find('.gfm-form').should have_css('.js-md-write-button', visible: true) + end + + step 'I should see the Markdown preview' do + find('.gfm-form').should have_css('.js-md-preview', visible: true) + end + + step 'I should see the Markdown preview button' do + find('.gfm-form').should have_css('.js-md-preview-button', visible: true) + end + + step 'I write a description like "Nice"' do + find('.gfm-form').fill_in 'Description', with: 'Nice' + end + + step 'I preview a description text like "Bug fixed :smile:"' do + within('.gfm-form') do + fill_in 'Description', with: 'Bug fixed :smile:' + find('.js-md-preview-button').trigger('click') + end + end + + step 'I haven\'t written any description text' do + find('.gfm-form').fill_in 'Description', with: '' + end end diff --git a/features/steps/shared/note.rb b/features/steps/shared/note.rb index 2b2cb47a715..e298312f065 100644 --- a/features/steps/shared/note.rb +++ b/features/steps/shared/note.rb @@ -23,7 +23,7 @@ module SharedNote step 'I preview a comment text like "Bug fixed :smile:"' do within(".js-main-target-form") do fill_in "note[note]", with: "Bug fixed :smile:" - find(".js-note-preview-button").trigger("click") + find('.js-md-preview-button').trigger('click') end end @@ -51,13 +51,13 @@ module SharedNote step 'I should not see the comment preview' do within(".js-main-target-form") do - page.should have_css(".js-note-preview", visible: false) + page.should have_css('.js-md-preview', visible: false) end end step 'I should not see the comment preview button' do within(".js-main-target-form") do - page.should have_css(".js-note-preview-button", visible: false) + page.should have_css('.js-md-preview-button', visible: false) end end @@ -81,19 +81,19 @@ module SharedNote step 'I should see the comment edit button' do within(".js-main-target-form") do - page.should have_css(".js-note-write-button", visible: true) + page.should have_css('.js-md-write-button', visible: true) end end step 'I should see the comment preview' do within(".js-main-target-form") do - page.should have_css(".js-note-preview", visible: true) + page.should have_css('.js-md-preview', visible: true) end end step 'I should see the comment preview button' do within(".js-main-target-form") do - page.should have_css(".js-note-preview-button", visible: true) + page.should have_css('.js-md-preview-button', visible: true) end end diff --git a/spec/features/notes_on_merge_requests_spec.rb b/spec/features/notes_on_merge_requests_spec.rb index 92f3a6c0929..bf3c12012e5 100644 --- a/spec/features/notes_on_merge_requests_spec.rb +++ b/spec/features/notes_on_merge_requests_spec.rb @@ -20,7 +20,7 @@ describe 'Comments' do should have_css(".js-main-target-form", visible: true, count: 1) find(".js-main-target-form input[type=submit]").value.should == "Add Comment" within(".js-main-target-form") { should_not have_link("Cancel") } - within(".js-main-target-form") { should have_css(".js-note-preview-button", visible: false) } + within('.js-main-target-form') { should have_css('.js-md-preview-button', visible: false) } end describe "with text" do @@ -32,7 +32,7 @@ describe 'Comments' do it 'should have enable submit button and preview button' do within(".js-main-target-form") { should_not have_css(".js-comment-button[disabled]") } - within(".js-main-target-form") { should have_css(".js-note-preview-button", visible: true) } + within('.js-main-target-form') { should have_css('.js-md-preview-button', visible: true) } end end end @@ -41,7 +41,7 @@ describe 'Comments' do before do within(".js-main-target-form") do fill_in "note[note]", with: "This is awsome!" - find(".js-note-preview-button").trigger("click") + find('.js-md-preview-button').trigger('click') click_button "Add Comment" end end @@ -49,7 +49,7 @@ describe 'Comments' do it 'should be added and form reset' do should have_content("This is awsome!") within(".js-main-target-form") { should have_no_field("note[note]", with: "This is awesome!") } - within(".js-main-target-form") { should have_css(".js-note-preview", visible: false) } + within('.js-main-target-form') { should have_css('.js-md-preview', visible: false) } within(".js-main-target-form") { should have_css(".js-note-text", visible: true) } end end @@ -172,11 +172,11 @@ describe 'Comments' do # add two separate texts and trigger previews on both within("tr[id='#{line_code}'] + .js-temp-notes-holder") do fill_in "note[note]", with: "One comment on line 7" - find(".js-note-preview-button").trigger("click") + find('.js-md-preview-button').trigger('click') end within("tr[id='#{line_code_2}'] + .js-temp-notes-holder") do fill_in "note[note]", with: "Another comment on line 10" - find(".js-note-preview-button").trigger("click") + find('.js-md-preview-button').trigger('click') end end end diff --git a/spec/routing/project_routing_spec.rb b/spec/routing/project_routing_spec.rb index 4b2eb42c709..112082d8890 100644 --- a/spec/routing/project_routing_spec.rb +++ b/spec/routing/project_routing_spec.rb @@ -53,14 +53,15 @@ shared_examples "RESTful project resources" do end end -# projects POST /projects(.:format) projects#create -# new_project GET /projects/new(.:format) projects#new -# fork_project POST /:id/fork(.:format) projects#fork -# files_project GET /:id/files(.:format) projects#files -# edit_project GET /:id/edit(.:format) projects#edit -# project GET /:id(.:format) projects#show -# PUT /:id(.:format) projects#update -# DELETE /:id(.:format) projects#destroy +# projects POST /projects(.:format) projects#create +# new_project GET /projects/new(.:format) projects#new +# fork_project POST /:id/fork(.:format) projects#fork +# files_project GET /:id/files(.:format) projects#files +# edit_project GET /:id/edit(.:format) projects#edit +# project GET /:id(.:format) projects#show +# PUT /:id(.:format) projects#update +# DELETE /:id(.:format) projects#destroy +# markdown_preview_project POST /:id/markdown_preview(.:format) projects#markdown_preview describe ProjectsController, "routing" do it "to #create" do post("/projects").should route_to('projects#create') @@ -93,6 +94,12 @@ describe ProjectsController, "routing" do it "to #destroy" do delete("/gitlab/gitlabhq").should route_to('projects#destroy', id: 'gitlab/gitlabhq') end + + it 'to #markdown_preview' do + post('/gitlab/gitlabhq/markdown_preview').should( + route_to('projects#markdown_preview', id: 'gitlab/gitlabhq') + ) + end end # pages_project_wikis GET /:project_id/wikis/pages(.:format) projects/wikis#pages @@ -392,15 +399,10 @@ describe Projects::IssuesController, "routing" do end end -# preview_project_notes POST /:project_id/notes/preview(.:format) notes#preview # project_notes GET /:project_id/notes(.:format) notes#index # POST /:project_id/notes(.:format) notes#create # project_note DELETE /:project_id/notes/:id(.:format) notes#destroy describe Projects::NotesController, "routing" do - it "to #preview" do - post("/gitlab/gitlabhq/notes/preview").should route_to('projects/notes#preview', project_id: 'gitlab/gitlabhq') - end - it_behaves_like "RESTful project resources" do let(:actions) { [:index, :create, :destroy] } let(:controller) { 'notes' } -- cgit v1.2.1 From cd3eabd71236d2be1430d2dbf23aad91d73aa783 Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Thu, 16 Oct 2014 22:45:13 -0500 Subject: Use GET instead of POST for Markdown previews --- app/assets/javascripts/markdown_area.js.coffee | 2 +- config/routes.rb | 2 +- spec/routing/project_routing_spec.rb | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/assets/javascripts/markdown_area.js.coffee b/app/assets/javascripts/markdown_area.js.coffee index a4bd4774dc9..0ca7070dc8b 100644 --- a/app/assets/javascripts/markdown_area.js.coffee +++ b/app/assets/javascripts/markdown_area.js.coffee @@ -48,7 +48,7 @@ $(document).ready -> preview.text "Nothing to preview." else preview.text "Loading..." - $.post($(this).data("url"), + $.get($(this).data("url"), md_text: mdText ).success (previewData) -> preview.html previewData diff --git a/config/routes.rb b/config/routes.rb index 5dbb238ba6b..3edc78cee33 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -186,7 +186,7 @@ Gitlab::Application.routes.draw do post :unarchive post :upload_image post :toggle_star - post :markdown_preview + get :markdown_preview get :autocomplete_sources get :import put :retry_import diff --git a/spec/routing/project_routing_spec.rb b/spec/routing/project_routing_spec.rb index 112082d8890..f1f5ac96a62 100644 --- a/spec/routing/project_routing_spec.rb +++ b/spec/routing/project_routing_spec.rb @@ -61,7 +61,7 @@ end # project GET /:id(.:format) projects#show # PUT /:id(.:format) projects#update # DELETE /:id(.:format) projects#destroy -# markdown_preview_project POST /:id/markdown_preview(.:format) projects#markdown_preview +# markdown_preview_project GET /:id/markdown_preview(.:format) projects#markdown_preview describe ProjectsController, "routing" do it "to #create" do post("/projects").should route_to('projects#create') @@ -96,7 +96,7 @@ describe ProjectsController, "routing" do end it 'to #markdown_preview' do - post('/gitlab/gitlabhq/markdown_preview').should( + get('/gitlab/gitlabhq/markdown_preview').should( route_to('projects#markdown_preview', id: 'gitlab/gitlabhq') ) end -- cgit v1.2.1 From e1491465de441b386c72726f0b869104d1c15680 Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Thu, 16 Oct 2014 23:10:50 -0500 Subject: Refactor Markdown preview tests Create a new shared module for common issue/merge request behavior, use `expect` syntax instead of `should`, and avoid `visible: false` in the `have_css` matcher. --- features/project/merge_requests.feature | 8 ++++---- features/steps/project/merge_requests.rb | 5 +---- features/steps/shared/diff_note.rb | 18 +++++++++--------- features/steps/shared/issuable.rb | 15 +++++++++++++++ features/steps/shared/markdown.rb | 14 +++++++------- features/steps/shared/note.rb | 12 ++++++------ spec/features/notes_on_merge_requests_spec.rb | 24 +++++++++++++++--------- 7 files changed, 57 insertions(+), 39 deletions(-) create mode 100644 features/steps/shared/issuable.rb diff --git a/features/project/merge_requests.feature b/features/project/merge_requests.feature index f1adf0bd34d..f8a43e1ee36 100644 --- a/features/project/merge_requests.feature +++ b/features/project/merge_requests.feature @@ -193,21 +193,21 @@ Feature: Project Merge Requests @javascript Scenario: I can't preview without text Given I visit merge request page "Bug NS-04" - And I click link "Edit" + And I click link "Edit" for the merge request And I haven't written any description text Then I should not see the Markdown preview button @javascript Scenario: I can preview with text Given I visit merge request page "Bug NS-04" - And I click link "Edit" + And I click link "Edit" for the merge request And I write a description like "Nice" Then I should see the Markdown preview button @javascript Scenario: I preview a merge request description Given I visit merge request page "Bug NS-04" - And I click link "Edit" + And I click link "Edit" for the merge request And I preview a description text like "Bug fixed :smile:" Then I should see the Markdown preview And I should not see the Markdown text field @@ -215,6 +215,6 @@ Feature: Project Merge Requests @javascript Scenario: I can edit after preview Given I visit merge request page "Bug NS-04" - And I click link "Edit" + And I click link "Edit" for the merge request And I preview a description text like "Bug fixed :smile:" Then I should see the Markdown edit button diff --git a/features/steps/project/merge_requests.rb b/features/steps/project/merge_requests.rb index 32bee9a563f..d5e060bdbe8 100644 --- a/features/steps/project/merge_requests.rb +++ b/features/steps/project/merge_requests.rb @@ -1,5 +1,6 @@ class Spinach::Features::ProjectMergeRequests < Spinach::FeatureSteps include SharedAuthentication + include SharedIssuable include SharedProject include SharedNote include SharedPaths @@ -10,10 +11,6 @@ class Spinach::Features::ProjectMergeRequests < Spinach::FeatureSteps click_link "New Merge Request" end - step 'I click link "Edit"' do - click_link 'Edit' - end - step 'I click link "Bug NS-04"' do click_link "Bug NS-04" end diff --git a/features/steps/shared/diff_note.rb b/features/steps/shared/diff_note.rb index bd22e95daee..8871b93edb6 100644 --- a/features/steps/shared/diff_note.rb +++ b/features/steps/shared/diff_note.rb @@ -32,7 +32,7 @@ module SharedDiffNote click_diff_line(sample_commit.line_code) within("#{diff_file_selector} form[rel$='#{sample_commit.line_code}']") do fill_in "note[note]", with: "Should fix it :smile:" - find('.js-md-preview-button').trigger('click') + find('.js-md-preview-button').click end end @@ -41,7 +41,7 @@ module SharedDiffNote within("#{diff_file_selector} form[rel$='#{sample_commit.del_line_code}']") do fill_in "note[note]", with: "DRY this up" - find('.js-md-preview-button').trigger('click') + find('.js-md-preview-button').click end end @@ -73,7 +73,7 @@ module SharedDiffNote step 'I should not see the diff comment preview button' do within(diff_file_selector) do - page.should have_css('.js-md-preview-button', visible: false) + expect(page).not_to have_css('.js-md-preview-button') end end @@ -131,27 +131,27 @@ module SharedDiffNote step 'I should see the diff comment preview' do within("#{diff_file_selector} form") do - page.should have_css('.js-md-preview', visible: false) + expect(page).to have_css('.js-md-preview') end end step 'I should see the diff comment edit button' do within(diff_file_selector) do - page.should have_css('.js-md-write-button', visible: true) + expect(page).to have_css('.js-md-write-button') end end step 'I should see the diff comment preview button' do within(diff_file_selector) do - page.should have_css('.js-md-preview-button', visible: true) + expect(page).to have_css('.js-md-preview-button') end end step 'I should see two separate previews' do within(diff_file_selector) do - page.should have_css('.js-md-preview', visible: true, count: 2) - page.should have_content("Should fix it") - page.should have_content("DRY this up") + expect(page).to have_css('.js-md-preview', count: 2) + expect(page).to have_content("Should fix it") + expect(page).to have_content("DRY this up") end end diff --git a/features/steps/shared/issuable.rb b/features/steps/shared/issuable.rb new file mode 100644 index 00000000000..a0150e90380 --- /dev/null +++ b/features/steps/shared/issuable.rb @@ -0,0 +1,15 @@ +module SharedIssuable + include Spinach::DSL + + def edit_issuable + find('.issue-btn-group').click_link 'Edit' + end + + step 'I click link "Edit" for the merge request' do + edit_issuable + end + + step 'I click link "Edit" for the issue' do + edit_issuable + end +end diff --git a/features/steps/shared/markdown.rb b/features/steps/shared/markdown.rb index f3e61aa8e49..df4514b5646 100644 --- a/features/steps/shared/markdown.rb +++ b/features/steps/shared/markdown.rb @@ -56,27 +56,27 @@ EOT end step 'I should not see the Markdown preview' do - find('.gfm-form').should have_css('.js-md-preview', visible: false) + expect(find('.gfm-form')).not_to have_css('.js-md-preview') end step 'I should not see the Markdown preview button' do - find('.gfm-form').should have_css('.js-md-preview-button', visible: false) + expect(find('.gfm-form')).not_to have_css('.js-md-preview-button') end step 'I should not see the Markdown text field' do - find('.gfm-form').should have_css('textarea', visible: false) + expect(find('.gfm-form')).not_to have_css('textarea') end step 'I should see the Markdown edit button' do - find('.gfm-form').should have_css('.js-md-write-button', visible: true) + expect(find('.gfm-form')).to have_css('.js-md-write-button') end step 'I should see the Markdown preview' do - find('.gfm-form').should have_css('.js-md-preview', visible: true) + expect(find('.gfm-form')).to have_css('.js-md-preview') end step 'I should see the Markdown preview button' do - find('.gfm-form').should have_css('.js-md-preview-button', visible: true) + expect(find('.gfm-form')).to have_css('.js-md-preview-button') end step 'I write a description like "Nice"' do @@ -86,7 +86,7 @@ EOT step 'I preview a description text like "Bug fixed :smile:"' do within('.gfm-form') do fill_in 'Description', with: 'Bug fixed :smile:' - find('.js-md-preview-button').trigger('click') + find('.js-md-preview-button').click() end end diff --git a/features/steps/shared/note.rb b/features/steps/shared/note.rb index e298312f065..a83f74228af 100644 --- a/features/steps/shared/note.rb +++ b/features/steps/shared/note.rb @@ -23,7 +23,7 @@ module SharedNote step 'I preview a comment text like "Bug fixed :smile:"' do within(".js-main-target-form") do fill_in "note[note]", with: "Bug fixed :smile:" - find('.js-md-preview-button').trigger('click') + find('.js-md-preview-button').click end end @@ -51,13 +51,13 @@ module SharedNote step 'I should not see the comment preview' do within(".js-main-target-form") do - page.should have_css('.js-md-preview', visible: false) + expect(page).not_to have_css('.js-md-preview') end end step 'I should not see the comment preview button' do within(".js-main-target-form") do - page.should have_css('.js-md-preview-button', visible: false) + expect(page).not_to have_css('.js-md-preview-button') end end @@ -81,19 +81,19 @@ module SharedNote step 'I should see the comment edit button' do within(".js-main-target-form") do - page.should have_css('.js-md-write-button', visible: true) + expect(page).to have_css('.js-md-write-button') end end step 'I should see the comment preview' do within(".js-main-target-form") do - page.should have_css('.js-md-preview', visible: true) + expect(page).to have_css('.js-md-preview') end end step 'I should see the comment preview button' do within(".js-main-target-form") do - page.should have_css('.js-md-preview-button', visible: true) + expect(page).to have_css('.js-md-preview-button') end end diff --git a/spec/features/notes_on_merge_requests_spec.rb b/spec/features/notes_on_merge_requests_spec.rb index bf3c12012e5..36394265abf 100644 --- a/spec/features/notes_on_merge_requests_spec.rb +++ b/spec/features/notes_on_merge_requests_spec.rb @@ -19,8 +19,10 @@ describe 'Comments' do it 'should be valid' do should have_css(".js-main-target-form", visible: true, count: 1) find(".js-main-target-form input[type=submit]").value.should == "Add Comment" - within(".js-main-target-form") { should_not have_link("Cancel") } - within('.js-main-target-form') { should have_css('.js-md-preview-button', visible: false) } + within('.js-main-target-form') do + expect(page).not_to have_link('Cancel') + expect(page).not_to have_css('.js-md-preview-button', visible: true) + end end describe "with text" do @@ -31,8 +33,10 @@ describe 'Comments' do end it 'should have enable submit button and preview button' do - within(".js-main-target-form") { should_not have_css(".js-comment-button[disabled]") } - within('.js-main-target-form') { should have_css('.js-md-preview-button', visible: true) } + within(".js-main-target-form") do + expect(page).not_to have_css(".js-comment-button[disabled]") + expect(page).to have_css('.js-md-preview-button') + end end end end @@ -41,15 +45,17 @@ describe 'Comments' do before do within(".js-main-target-form") do fill_in "note[note]", with: "This is awsome!" - find('.js-md-preview-button').trigger('click') + find('.js-md-preview-button').click click_button "Add Comment" end end it 'should be added and form reset' do should have_content("This is awsome!") - within(".js-main-target-form") { should have_no_field("note[note]", with: "This is awesome!") } - within('.js-main-target-form') { should have_css('.js-md-preview', visible: false) } + within(".js-main-target-form") do + expect(page).to have_no_field("note[note]", with: "This is awesome!") + expect(page).not_to have_css('.js-md-preview', visible: true) + end within(".js-main-target-form") { should have_css(".js-note-text", visible: true) } end end @@ -172,11 +178,11 @@ describe 'Comments' do # add two separate texts and trigger previews on both within("tr[id='#{line_code}'] + .js-temp-notes-holder") do fill_in "note[note]", with: "One comment on line 7" - find('.js-md-preview-button').trigger('click') + find('.js-md-preview-button').click end within("tr[id='#{line_code_2}'] + .js-temp-notes-holder") do fill_in "note[note]", with: "Another comment on line 10" - find('.js-md-preview-button').trigger('click') + find('.js-md-preview-button').click end end end -- cgit v1.2.1 From e06f0ead9843df2688ca2f341a3b37d4d56a955d Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Thu, 16 Oct 2014 23:36:52 -0500 Subject: Fix Markdown preview tests Update Spinach tests for Markdown previews for the new-ish tab UI that replaced the old preview/edit toggle button. --- features/project/commits/comments.feature | 8 ++++---- features/project/commits/diff_comments.feature | 6 +++--- features/project/issues/issues.feature | 8 ++++---- features/steps/shared/diff_note.rb | 12 +++++++----- features/steps/shared/markdown.rb | 24 +++++++++++++++--------- features/steps/shared/note.rb | 22 ++++++++++++---------- spec/features/notes_on_merge_requests_spec.rb | 1 - 7 files changed, 45 insertions(+), 36 deletions(-) diff --git a/features/project/commits/comments.feature b/features/project/commits/comments.feature index e176752cfbf..a45245917e3 100644 --- a/features/project/commits/comments.feature +++ b/features/project/commits/comments.feature @@ -16,12 +16,12 @@ Feature: Project Commits Comments @javascript Scenario: I can't preview without text Given I haven't written any comment text - Then I should not see the comment preview button + Then The comment preview tab should say there is nothing to do @javascript Scenario: I can preview with text - Given I write a comment like "Nice" - Then I should see the comment preview button + Given I write a comment like ":+1: Nice" + Then The comment preview tab should be display rendered Markdown @javascript Scenario: I preview a comment @@ -32,7 +32,7 @@ Feature: Project Commits Comments @javascript Scenario: I can edit after preview Given I preview a comment text like "Bug fixed :smile:" - Then I should see the comment edit button + Then I should see the comment write tab @javascript Scenario: I have a reset form after posting from preview diff --git a/features/project/commits/diff_comments.feature b/features/project/commits/diff_comments.feature index a145ec84b78..9c4cc723d1b 100644 --- a/features/project/commits/diff_comments.feature +++ b/features/project/commits/diff_comments.feature @@ -58,13 +58,13 @@ Feature: Project Commits Diff Comments Scenario: I can't preview without text Given I open a diff comment form And I haven't written any diff comment text - Then I should not see the diff comment preview button + Then The diff comment preview tab should say there is nothing to do @javascript Scenario: I can preview with text Given I open a diff comment form And I write a diff comment like ":-1: I don't like this" - Then I should see the diff comment preview button + Then The diff comment preview tab should display rendered Markdown @javascript Scenario: I preview a diff comment @@ -75,7 +75,7 @@ Feature: Project Commits Diff Comments @javascript Scenario: I can edit after preview Given I preview a diff comment text like "Should fix it :smile:" - Then I should see the diff comment edit button + Then I should see the diff comment write tab @javascript Scenario: The form gets removed after posting diff --git a/features/project/issues/issues.feature b/features/project/issues/issues.feature index e7fbe2bd6f1..9970be0c596 100644 --- a/features/project/issues/issues.feature +++ b/features/project/issues/issues.feature @@ -166,13 +166,13 @@ Feature: Project Issues Scenario: I can't preview without text Given I click link "New Issue" And I haven't written any description text - Then I should not see the Markdown preview button + Then The Markdown preview tab should say there is nothing to do @javascript Scenario: I can preview with text Given I click link "New Issue" - And I write a description like "Nice" - Then I should see the Markdown preview button + And I write a description like ":+1: Nice" + Then The Markdown preview tab should display rendered Markdown @javascript Scenario: I preview an issue description @@ -185,4 +185,4 @@ Feature: Project Issues Scenario: I can edit after preview Given I click link "New Issue" And I preview a description text like "Bug fixed :smile:" - Then I should see the Markdown edit button + Then I should see the Markdown write tab diff --git a/features/steps/shared/diff_note.rb b/features/steps/shared/diff_note.rb index 8871b93edb6..aa31a09e326 100644 --- a/features/steps/shared/diff_note.rb +++ b/features/steps/shared/diff_note.rb @@ -71,9 +71,10 @@ module SharedDiffNote end end - step 'I should not see the diff comment preview button' do + step 'The diff comment preview tab should say there is nothing to do' do within(diff_file_selector) do - expect(page).not_to have_css('.js-md-preview-button') + find('.js-md-preview-button').click + expect(find('.js-md-preview')).to have_content('Nothing to preview.') end end @@ -135,15 +136,16 @@ module SharedDiffNote end end - step 'I should see the diff comment edit button' do + step 'I should see the diff comment write tab' do within(diff_file_selector) do expect(page).to have_css('.js-md-write-button') end end - step 'I should see the diff comment preview button' do + step 'The diff comment preview tab should display rendered Markdown' do within(diff_file_selector) do - expect(page).to have_css('.js-md-preview-button') + find('.js-md-preview-button').click + expect(find('.js-md-preview')).to have_css('img.emoji') end end diff --git a/features/steps/shared/markdown.rb b/features/steps/shared/markdown.rb index df4514b5646..10da67a6ba8 100644 --- a/features/steps/shared/markdown.rb +++ b/features/steps/shared/markdown.rb @@ -56,18 +56,21 @@ EOT end step 'I should not see the Markdown preview' do - expect(find('.gfm-form')).not_to have_css('.js-md-preview') + expect(find('.gfm-form')).not_to have_css('.js-md-preview', visible: true) end - step 'I should not see the Markdown preview button' do - expect(find('.gfm-form')).not_to have_css('.js-md-preview-button') + step 'The Markdown preview tab should say there is nothing to do' do + within(".gfm-form") do + find('.js-md-preview-button').click + expect(find('.js-md-preview')).to have_content('Nothing to preview.') + end end step 'I should not see the Markdown text field' do - expect(find('.gfm-form')).not_to have_css('textarea') + expect(find('.gfm-form')).not_to have_css('textarea', visible: true) end - step 'I should see the Markdown edit button' do + step 'I should see the Markdown write tab' do expect(find('.gfm-form')).to have_css('.js-md-write-button') end @@ -75,12 +78,15 @@ EOT expect(find('.gfm-form')).to have_css('.js-md-preview') end - step 'I should see the Markdown preview button' do - expect(find('.gfm-form')).to have_css('.js-md-preview-button') + step 'The Markdown preview tab should display rendered Markdown' do + within(".gfm-form") do + find('.js-md-preview-button').click + expect(find('.js-md-preview')).to have_css('img.emoji') + end end - step 'I write a description like "Nice"' do - find('.gfm-form').fill_in 'Description', with: 'Nice' + step 'I write a description like ":+1: Nice"' do + find('.gfm-form').fill_in 'Description', with: ':+1: Nice' end step 'I preview a description text like "Bug fixed :smile:"' do diff --git a/features/steps/shared/note.rb b/features/steps/shared/note.rb index a83f74228af..9802614ec72 100644 --- a/features/steps/shared/note.rb +++ b/features/steps/shared/note.rb @@ -33,9 +33,9 @@ module SharedNote end end - step 'I write a comment like "Nice"' do + step 'I write a comment like ":+1: Nice"' do within(".js-main-target-form") do - fill_in "note[note]", with: "Nice" + fill_in "note[note]", with: ":+1: Nice" end end @@ -51,13 +51,14 @@ module SharedNote step 'I should not see the comment preview' do within(".js-main-target-form") do - expect(page).not_to have_css('.js-md-preview') + expect(page).not_to have_css('.js-md-preview', visible: true) end end - step 'I should not see the comment preview button' do + step 'The comment preview tab should say there is nothing to do' do within(".js-main-target-form") do - expect(page).not_to have_css('.js-md-preview-button') + find('.js-md-preview-button').click + expect(find('.js-md-preview')).to have_content('Nothing to preview.') end end @@ -79,21 +80,22 @@ module SharedNote end end - step 'I should see the comment edit button' do + step 'I should see the comment write tab' do within(".js-main-target-form") do expect(page).to have_css('.js-md-write-button') end end - step 'I should see the comment preview' do + step 'The comment preview tab should be display rendered Markdown' do within(".js-main-target-form") do - expect(page).to have_css('.js-md-preview') + find('.js-md-preview-button').click + expect(find('.js-md-preview')).to have_css('img.emoji') end end - step 'I should see the comment preview button' do + step 'I should see the comment preview' do within(".js-main-target-form") do - expect(page).to have_css('.js-md-preview-button') + expect(page).to have_css('.js-md-preview') end end diff --git a/spec/features/notes_on_merge_requests_spec.rb b/spec/features/notes_on_merge_requests_spec.rb index 36394265abf..3a99a260498 100644 --- a/spec/features/notes_on_merge_requests_spec.rb +++ b/spec/features/notes_on_merge_requests_spec.rb @@ -21,7 +21,6 @@ describe 'Comments' do find(".js-main-target-form input[type=submit]").value.should == "Add Comment" within('.js-main-target-form') do expect(page).not_to have_link('Cancel') - expect(page).not_to have_css('.js-md-preview-button', visible: true) end end -- cgit v1.2.1 From de53bc9d8470d94ec1b956cc2ea1df077c4d034d Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Thu, 16 Oct 2014 23:38:08 -0500 Subject: Add new Markdown preview test Add a test to make sure that Markdown previews are available when editing an existing issue. --- features/project/issues/issues.feature | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/features/project/issues/issues.feature b/features/project/issues/issues.feature index 9970be0c596..28ea44530fe 100644 --- a/features/project/issues/issues.feature +++ b/features/project/issues/issues.feature @@ -186,3 +186,10 @@ Feature: Project Issues Given I click link "New Issue" And I preview a description text like "Bug fixed :smile:" Then I should see the Markdown write tab + + @javascript + Scenario: I can preview when editing an existing issue + Given I click link "Release 0.4" + And I click link "Edit" for the issue + And I preview a description text like "Bug fixed :smile:" + Then I should see the Markdown write tab -- cgit v1.2.1 From f9e423b499795e599d25f76c3ef519cac8ac6db0 Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Sat, 18 Oct 2014 18:16:20 -0500 Subject: Fix long line in view --- app/views/projects/_md_preview.html.haml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app/views/projects/_md_preview.html.haml b/app/views/projects/_md_preview.html.haml index dbbf8e3bf97..cb75149434f 100644 --- a/app/views/projects/_md_preview.html.haml +++ b/app/views/projects/_md_preview.html.haml @@ -3,7 +3,8 @@ = link_to '#md-write-holder', class: 'js-md-write-button' do Write %li - = link_to '#md-preview-holder', class: 'js-md-preview-button', data: { url: markdown_preview_project_path(@project) } do + = link_to '#md-preview-holder', class: 'js-md-preview-button', + data: { url: markdown_preview_project_path(@project) } do Preview %div .md-write-holder -- cgit v1.2.1 From 74c82ae32583ebf335f310a29ffb22d75b356863 Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Sat, 18 Oct 2014 18:24:12 -0500 Subject: Fix houndci warnings --- features/steps/shared/diff_note.rb | 4 ++-- features/steps/shared/markdown.rb | 6 +++--- features/steps/shared/note.rb | 2 +- spec/features/notes_on_merge_requests_spec.rb | 8 ++++---- 4 files changed, 10 insertions(+), 10 deletions(-) diff --git a/features/steps/shared/diff_note.rb b/features/steps/shared/diff_note.rb index aa31a09e326..7f1dde16c17 100644 --- a/features/steps/shared/diff_note.rb +++ b/features/steps/shared/diff_note.rb @@ -152,8 +152,8 @@ module SharedDiffNote step 'I should see two separate previews' do within(diff_file_selector) do expect(page).to have_css('.js-md-preview', count: 2) - expect(page).to have_content("Should fix it") - expect(page).to have_content("DRY this up") + expect(page).to have_content('Should fix it') + expect(page).to have_content('DRY this up') end end diff --git a/features/steps/shared/markdown.rb b/features/steps/shared/markdown.rb index 10da67a6ba8..8dfb8ed72e9 100644 --- a/features/steps/shared/markdown.rb +++ b/features/steps/shared/markdown.rb @@ -60,7 +60,7 @@ EOT end step 'The Markdown preview tab should say there is nothing to do' do - within(".gfm-form") do + within('.gfm-form') do find('.js-md-preview-button').click expect(find('.js-md-preview')).to have_content('Nothing to preview.') end @@ -79,7 +79,7 @@ EOT end step 'The Markdown preview tab should display rendered Markdown' do - within(".gfm-form") do + within('.gfm-form') do find('.js-md-preview-button').click expect(find('.js-md-preview')).to have_css('img.emoji') end @@ -92,7 +92,7 @@ EOT step 'I preview a description text like "Bug fixed :smile:"' do within('.gfm-form') do fill_in 'Description', with: 'Bug fixed :smile:' - find('.js-md-preview-button').click() + find('.js-md-preview-button').click end end diff --git a/features/steps/shared/note.rb b/features/steps/shared/note.rb index 9802614ec72..52d8c7e50fa 100644 --- a/features/steps/shared/note.rb +++ b/features/steps/shared/note.rb @@ -35,7 +35,7 @@ module SharedNote step 'I write a comment like ":+1: Nice"' do within(".js-main-target-form") do - fill_in "note[note]", with: ":+1: Nice" + fill_in 'note[note]', with: ':+1: Nice' end end diff --git a/spec/features/notes_on_merge_requests_spec.rb b/spec/features/notes_on_merge_requests_spec.rb index 3a99a260498..6d3cc3ae159 100644 --- a/spec/features/notes_on_merge_requests_spec.rb +++ b/spec/features/notes_on_merge_requests_spec.rb @@ -32,8 +32,8 @@ describe 'Comments' do end it 'should have enable submit button and preview button' do - within(".js-main-target-form") do - expect(page).not_to have_css(".js-comment-button[disabled]") + within('.js-main-target-form') do + expect(page).not_to have_css('.js-comment-button[disabled]') expect(page).to have_css('.js-md-preview-button') end end @@ -51,8 +51,8 @@ describe 'Comments' do it 'should be added and form reset' do should have_content("This is awsome!") - within(".js-main-target-form") do - expect(page).to have_no_field("note[note]", with: "This is awesome!") + within('.js-main-target-form') do + expect(page).to have_no_field('note[note]', with: 'This is awesome!') expect(page).not_to have_css('.js-md-preview', visible: true) end within(".js-main-target-form") { should have_css(".js-note-text", visible: true) } -- cgit v1.2.1 From 5bb8aff5ddcc1debb4406303477c1ddbe618d058 Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Sat, 18 Oct 2014 18:43:45 -0500 Subject: Fix more Markdown preview tests --- features/project/merge_requests.feature | 8 ++++---- features/steps/project/issues/issues.rb | 1 + 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/features/project/merge_requests.feature b/features/project/merge_requests.feature index f8a43e1ee36..7c029f05d75 100644 --- a/features/project/merge_requests.feature +++ b/features/project/merge_requests.feature @@ -195,14 +195,14 @@ Feature: Project Merge Requests Given I visit merge request page "Bug NS-04" And I click link "Edit" for the merge request And I haven't written any description text - Then I should not see the Markdown preview button + Then The Markdown preview tab should say there is nothing to do @javascript Scenario: I can preview with text Given I visit merge request page "Bug NS-04" And I click link "Edit" for the merge request - And I write a description like "Nice" - Then I should see the Markdown preview button + And I write a description like ":+1: Nice" + Then The Markdown preview tab should display rendered Markdown @javascript Scenario: I preview a merge request description @@ -217,4 +217,4 @@ Feature: Project Merge Requests Given I visit merge request page "Bug NS-04" And I click link "Edit" for the merge request And I preview a description text like "Bug fixed :smile:" - Then I should see the Markdown edit button + Then I should see the Markdown write tab diff --git a/features/steps/project/issues/issues.rb b/features/steps/project/issues/issues.rb index 640603562dd..c0ae5208541 100644 --- a/features/steps/project/issues/issues.rb +++ b/features/steps/project/issues/issues.rb @@ -1,5 +1,6 @@ class Spinach::Features::ProjectIssues < Spinach::FeatureSteps include SharedAuthentication + include SharedIssuable include SharedProject include SharedNote include SharedPaths -- cgit v1.2.1 From 7a5072c5a8f03cd7342a5f8e74e1fde0250ce360 Mon Sep 17 00:00:00 2001 From: Vinnie Okada Date: Mon, 20 Oct 2014 21:53:17 -0500 Subject: Fix test assertions Make sure we're asserting the correct thing when testing visible and invisible DOM elements. --- features/steps/shared/diff_note.rb | 8 ++++---- features/steps/shared/markdown.rb | 10 +++++----- features/steps/shared/note.rb | 8 ++++---- spec/features/notes_on_merge_requests_spec.rb | 4 ++-- 4 files changed, 15 insertions(+), 15 deletions(-) diff --git a/features/steps/shared/diff_note.rb b/features/steps/shared/diff_note.rb index 7f1dde16c17..28964d54a8f 100644 --- a/features/steps/shared/diff_note.rb +++ b/features/steps/shared/diff_note.rb @@ -132,26 +132,26 @@ module SharedDiffNote step 'I should see the diff comment preview' do within("#{diff_file_selector} form") do - expect(page).to have_css('.js-md-preview') + expect(page).to have_css('.js-md-preview', visible: true) end end step 'I should see the diff comment write tab' do within(diff_file_selector) do - expect(page).to have_css('.js-md-write-button') + expect(page).to have_css('.js-md-write-button', visible: true) end end step 'The diff comment preview tab should display rendered Markdown' do within(diff_file_selector) do find('.js-md-preview-button').click - expect(find('.js-md-preview')).to have_css('img.emoji') + expect(find('.js-md-preview')).to have_css('img.emoji', visible: true) end end step 'I should see two separate previews' do within(diff_file_selector) do - expect(page).to have_css('.js-md-preview', count: 2) + expect(page).to have_css('.js-md-preview', visible: true, count: 2) expect(page).to have_content('Should fix it') expect(page).to have_content('DRY this up') end diff --git a/features/steps/shared/markdown.rb b/features/steps/shared/markdown.rb index 8dfb8ed72e9..e71700880cd 100644 --- a/features/steps/shared/markdown.rb +++ b/features/steps/shared/markdown.rb @@ -56,7 +56,7 @@ EOT end step 'I should not see the Markdown preview' do - expect(find('.gfm-form')).not_to have_css('.js-md-preview', visible: true) + expect(find('.gfm-form .js-md-preview')).not_to be_visible end step 'The Markdown preview tab should say there is nothing to do' do @@ -67,21 +67,21 @@ EOT end step 'I should not see the Markdown text field' do - expect(find('.gfm-form')).not_to have_css('textarea', visible: true) + expect(find('.gfm-form textarea')).not_to be_visible end step 'I should see the Markdown write tab' do - expect(find('.gfm-form')).to have_css('.js-md-write-button') + expect(find('.gfm-form')).to have_css('.js-md-write-button', visible: true) end step 'I should see the Markdown preview' do - expect(find('.gfm-form')).to have_css('.js-md-preview') + expect(find('.gfm-form')).to have_css('.js-md-preview', visible: true) end step 'The Markdown preview tab should display rendered Markdown' do within('.gfm-form') do find('.js-md-preview-button').click - expect(find('.js-md-preview')).to have_css('img.emoji') + expect(find('.js-md-preview')).to have_css('img.emoji', visible: true) end end diff --git a/features/steps/shared/note.rb b/features/steps/shared/note.rb index 52d8c7e50fa..17adec3eda1 100644 --- a/features/steps/shared/note.rb +++ b/features/steps/shared/note.rb @@ -51,7 +51,7 @@ module SharedNote step 'I should not see the comment preview' do within(".js-main-target-form") do - expect(page).not_to have_css('.js-md-preview', visible: true) + expect(find('.js-md-preview')).not_to be_visible end end @@ -82,20 +82,20 @@ module SharedNote step 'I should see the comment write tab' do within(".js-main-target-form") do - expect(page).to have_css('.js-md-write-button') + expect(page).to have_css('.js-md-write-button', visible: true) end end step 'The comment preview tab should be display rendered Markdown' do within(".js-main-target-form") do find('.js-md-preview-button').click - expect(find('.js-md-preview')).to have_css('img.emoji') + expect(find('.js-md-preview')).to have_css('img.emoji', visible: true) end end step 'I should see the comment preview' do within(".js-main-target-form") do - expect(page).to have_css('.js-md-preview') + expect(page).to have_css('.js-md-preview', visible: true) end end diff --git a/spec/features/notes_on_merge_requests_spec.rb b/spec/features/notes_on_merge_requests_spec.rb index 6d3cc3ae159..cac409b9139 100644 --- a/spec/features/notes_on_merge_requests_spec.rb +++ b/spec/features/notes_on_merge_requests_spec.rb @@ -34,7 +34,7 @@ describe 'Comments' do it 'should have enable submit button and preview button' do within('.js-main-target-form') do expect(page).not_to have_css('.js-comment-button[disabled]') - expect(page).to have_css('.js-md-preview-button') + expect(page).to have_css('.js-md-preview-button', visible: true) end end end @@ -53,7 +53,7 @@ describe 'Comments' do should have_content("This is awsome!") within('.js-main-target-form') do expect(page).to have_no_field('note[note]', with: 'This is awesome!') - expect(page).not_to have_css('.js-md-preview', visible: true) + expect(page).to have_css('.js-md-preview', visible: :hidden) end within(".js-main-target-form") { should have_css(".js-note-text", visible: true) } end -- cgit v1.2.1