Add Markdown preview to more forms

Enable Markdown previews when creating and editing issues, merge
requests, and milestones, and when editing notes.

6 files changed, 114 insertions, 13 deletions

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