Replace commit diff note request specs with spinach features

features/project/commits/commit_diff_comments.feature

+Feature: Comments on commit diffs
+  Background:
+    Given I sign in as a user
+    And I own project "Shop"
+    And I visit project commit page
+
+  @javascript
+  Scenario: I can access add diff comment buttons
+    Then I should see add a diff comment button
+
+  @javascript
+  Scenario: I can comment on a commit diff
+    Given I leave a diff comment like "Typo, please fix"
+    Then I should see a diff comment saying "Typo, please fix"
+
+  @javascript
+  Scenario: I get a temporary form for the first comment on a diff line
+    Given I open a diff comment form
+    Then I should see a temporary diff comment form
+
+  @javascript
+  Scenario: I have a cancel button on the diff form
+    Given I open a diff comment form
+    Then I should see the cancel comment button
+
+  @javascript
+  Scenario: I can cancel a diff form
+    Given I open a diff comment form
+    And I cancel the diff comment
+    Then I should not see the diff comment form
+
+  @javascript
+  Scenario: I can't open a second form for a diff line
+    Given I open a diff comment form
+    And I open a diff comment form
+    Then I should only see one diff form
+
+  @javascript
+  Scenario: I can have multiple forms
+    Given I open a diff comment form
+    And I write a diff comment like ":-1: I don't like this"
+    And I open another diff comment form
+    Then I should see a diff comment form with ":-1: I don't like this"
+    And I should see an empty diff comment form
+
+  @javascript
+  Scenario: I can preview multiple forms separately
+    Given I preview a diff comment text like "Should fix it :smile:"
+    And I preview another diff comment text like "DRY this up"
+    Then I should see two separate previews
+
+  @javascript
+  Scenario: I have a reply button in discussions
+    Given I leave a diff comment like "Typo, please fix"
+    Then I should see a discussion reply button
+
+  @javascript
+  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
+
+  @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
+
+  @javascript
+  Scenario: I preview a diff comment
+    Given I preview a diff comment text like "Should fix it :smile:"
+    Then I should see the diff comment preview
+    And I should not see the diff comment text field
+
+  @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
+
+  @javascript
+  Scenario: The form gets removed after posting
+    Given I preview a diff comment text like "Should fix it :smile:"
+    And I submit the diff comment
+    Then I should not see the diff comment form
+    And I should see a discussion reply button
+
+  @javascript
+  Scenario: I can delete a discussion comment
+    Given I leave a diff comment like "Typo, please fix"
+    And I delete a diff comment
+    Then I should not see a diff comment saying "Typo, please fix"

features/steps/project/comments_on_commit_diffs.rb

+class CommentsOnCommitDiffs < Spinach::FeatureSteps
+  include SharedAuthentication
+  include SharedDiffNote
+  include SharedPaths
+  include SharedProject
+end

features/steps/shared/diff_note.rb

+module SharedDiffNote
+  include Spinach::DSL
+
+  Given 'I cancel the diff comment' do
+    within(".diff_file") do
+      find(".js-close-discussion-note-form").trigger("click")
+    end
+  end
+
+  Given 'I delete a diff comment' do
+    within(".diff_file") do
+      first(".js-note-delete").trigger("click")
+    end
+  end
+
+  Given 'I haven\'t written any diff comment text' do
+    within(".diff_file") do
+      fill_in "note[note]", with: ""
+    end
+  end
+
+  Given 'I leave a diff comment like "Typo, please fix"' do
+    find("#0_29_14.line_holder .js-add-diff-note-button").trigger("click")
+    within(".diff_file") do
+      fill_in "note[note]", with: "Typo, please fix"
+      #click_button("Add Comment")
+      find(".js-comment-button").trigger("click")
+    end
+  end
+
+  Given 'I preview a diff comment text like "Should fix it :smile:"' do
+    find("#0_29_14.line_holder .js-add-diff-note-button").trigger("click")
+    within(".diff_file") do
+      fill_in "note[note]", with: "Should fix it :smile:"
+      find(".js-note-preview-button").trigger("click")
+    end
+  end
+
+  Given 'I preview another diff comment text like "DRY this up"' do
+    find("#0_57_41.line_holder .js-add-diff-note-button").trigger("click")
+    within(".diff_file") do
+      fill_in "note[note]", with: "DRY this up"
+      find(".js-note-preview-button").trigger("click")
+    end
+  end
+
+  Given 'I open a diff comment form' do
+    find("#0_29_14.line_holder .js-add-diff-note-button").trigger("click")
+  end
+
+  Given 'I open another diff comment form' do
+    find("#0_57_41.line_holder .js-add-diff-note-button").trigger("click")
+  end
+
+  Given 'I write a diff comment like ":-1: I don\'t like this"' do
+    within(".diff_file") do
+      fill_in "note[note]", with: ":-1: I don\'t like this"
+    end
+  end
+
+  Given 'I submit the diff comment' do
+    within(".diff_file") do
+      click_button("Add Comment")
+    end
+  end
+
+
+
+  Then 'I should not see the diff comment form' do
+    within(".diff_file") do
+      page.should_not have_css("form.new_note")
+    end
+  end
+
+  Then 'I should not see the diff comment preview button' do
+    within(".diff_file") do
+      page.should have_css(".js-note-preview-button", visible: false)
+    end
+  end
+
+  Then 'I should not see the diff comment text field' do
+    within(".diff_file") do
+      page.should have_css(".js-note-text", visible: false)
+    end
+  end
+
+  Then 'I should only see one diff form' do
+    within(".diff_file") do
+      page.should have_css("form.new_note", count: 1)
+    end
+  end
+
+  Then 'I should see a diff comment form with ":-1: I don\'t like this"' do
+    within(".diff_file") do
+      page.should have_field("note[note]", with: ":-1: I don\'t like this")
+    end
+  end
+
+  Then 'I should see a diff comment saying "Typo, please fix"' do
+    within(".diff_file .note") do
+      page.should have_content("Typo, please fix")
+    end
+  end
+
+  Then 'I should see a discussion reply button' do
+    within(".diff_file") do
+      page.should have_link("Reply")
+    end
+  end
+
+  Then 'I should see a temporary diff comment form' do
+    within(".diff_file") do
+      page.should have_css(".js-temp-notes-holder form.new_note")
+    end
+  end
+
+  Then 'I should see add a diff comment button' do
+    page.should have_css(".js-add-diff-note-button", visible: false)
+  end
+
+  Then 'I should see an empty diff comment form' do
+    within(".diff_file") do
+      page.should have_field("note[note]", with: "")
+    end
+  end
+
+  Then 'I should see the cancel comment button' do
+    within(".diff_file form") do
+      page.should have_css(".js-close-discussion-note-form", text: "Cancel")
+    end
+  end
+
+  Then 'I should see the diff comment preview' do
+    within(".diff_file form") do
+      page.should have_css(".js-note-preview", visible: false)
+    end
+  end
+
+  Then 'I should see the diff comment edit button' do
+    within(".diff_file") do
+      page.should have_css(".js-note-edit-button", visible: true)
+    end
+  end
+
+  Then 'I should see the diff comment preview button' do
+    within(".diff_file") do
+      page.should have_css(".js-note-preview-button", visible: true)
+    end
+  end
+
+  Then 'I should see two separate previews' do
+    within(".diff_file") do
+      page.should have_css(".js-note-preview", visible: true, count: 2)
+      page.should have_content("Should fix it")
+      page.should have_content("DRY this up")
+    end
+  end
+end

spec/requests/notes_on_commits_spec.rb

-require 'spec_helper'
-
-describe "On a commit diff", js: true do
-  let!(:project) { create(:project) }
-  let!(:commit) { project.repository.commit("bcf03b5de6c33f3869ef70d68cf06e679d1d7f9a") }
-
-  before do
-    login_as :user
-    project.team << [@user, :reporter]
-
-    visit project_commit_path(project, commit)
-  end
-
-  subject { page }
-
-  describe "when adding a note" do
-    before do
-      find("#0_185_185.line_holder .js-add-diff-note-button").trigger("click")
-    end
-
-    describe "the notes holder" do
-      it { should have_css("#0_185_185.line_holder + .js-temp-notes-holder") }
-
-      it { within(".js-temp-notes-holder") { should have_css(".new_note") } }
-    end
-
-    describe "the note form" do
-      # set up hidden fields correctly
-      it { within(".js-temp-notes-holder") { find("#note_noteable_type").value.should == "Commit" } }
-      it { within(".js-temp-notes-holder") { find("#note_noteable_id").value.should == "" } }
-      it { within(".js-temp-notes-holder") { find("#note_commit_id").value.should == "bcf03b5de6c33f3869ef70d68cf06e679d1d7f9a" } }
-      it { within(".js-temp-notes-holder") { find("#note_line_code").value.should == "0_185_185" } }
-
-      # buttons
-      it { should have_button("Add Comment") }
-      it { should have_css(".js-close-discussion-note-form", text: "Cancel") }
-
-      # notification options
-      it { should have_unchecked_field("Project team") }
-      it { should have_checked_field("Commit author") }
-
-      it "shouldn't add a second form for same row" do
-        find("#0_185_185.line_holder .js-add-diff-note-button").trigger("click")
-
-        should have_css("#0_185_185.line_holder + .js-temp-notes-holder form", count: 1)
-      end
-
-      it "should be removed when canceled" do
-        find(".js-close-discussion-note-form").trigger("click")
-
-        should have_no_css(".js-temp-notes-holder")
-      end
-    end
-  end
-
-  describe "with muliple note forms" do
-    before do
-      find("#0_185_185.line_holder .js-add-diff-note-button").trigger("click")
-      find("#1_18_17.line_holder .js-add-diff-note-button").trigger("click")
-    end
-
-    # has two line forms
-    it { should have_css(".js-temp-notes-holder", count: 2) }
-
-    describe "previewing them separately" do
-      before do
-        # add two separate texts and trigger previews on both
-        within("#0_185_185.line_holder + .js-temp-notes-holder") do
-          fill_in "note[note]", with: "One comment on line 185"
-          find(".js-note-preview-button").trigger("click")
-        end
-        within("#1_18_17.line_holder + .js-temp-notes-holder") do
-          fill_in "note[note]", with: "Another comment on line 17"
-          find(".js-note-preview-button").trigger("click")
-        end
-      end
-
-      # check if previews were rendered separately
-      it { within("#0_185_185.line_holder + .js-temp-notes-holder") { should have_css(".js-note-preview", text: "One comment on line 185") } }
-      it { within("#1_18_17.line_holder + .js-temp-notes-holder") { should have_css(".js-note-preview", text: "Another comment on line 17") } }
-    end
-
-    describe "posting a note" do
-      before do
-        within("#1_18_17.line_holder + .js-temp-notes-holder") do
-          fill_in "note[note]", with: "Another comment on line 17"
-          click_button("Add Comment")
-        end
-      end
-
-      # removed form after submit
-      it { should have_no_css("#1_18_17.line_holder + .js-temp-notes-holder") }
-
-      # added discussion
-      it { should have_content("Another comment on line 17") }
-      it { should have_css("#1_18_17.line_holder + .notes_holder") }
-      it { should have_css("#1_18_17.line_holder + .notes_holder .note", count: 1) }
-      it { should have_link("Reply") }
-
-      it "should remove last note of a discussion" do
-        within("#1_18_17.line_holder + .notes_holder") do
-          find(".js-note-delete").trigger("click")
-        end
-
-        # removed whole discussion
-        should_not have_css(".note_holder")
-        should have_css("#1_18_17.line_holder + #1_18_18.line_holder")
-      end
-    end
-  end
-
-  describe "when replying to a note" do
-    before do
-      # create first note
-      find("#0_184_184.line_holder .js-add-diff-note-button").trigger("click")
-      within("#0_184_184.line_holder + .js-temp-notes-holder") do
-        fill_in "note[note]", with: "One comment on line 184"
-        click_button("Add Comment")
-      end
-      # create second note
-      within("#0_184_184.line_holder + .notes_holder") do
-        find(".js-discussion-reply-button").trigger("click")
-        fill_in "note[note]", with: "An additional comment in reply"
-        click_button("Add Comment")
-      end
-    end
-
-    # inserted note
-    it { should have_content("An additional comment in reply") }
-    it { within("#0_184_184.line_holder + .notes_holder") { should have_css(".note", count: 2) } }
-
-    # removed form after reply
-    it { within("#0_184_184.line_holder + .notes_holder") { should have_no_css("form") } }
-    it { within("#0_184_184.line_holder + .notes_holder") { should have_link("Reply") } }
-  end
-end
- 
\ No newline at end of file