Changes tab VUE refactoring

5 files changed, 127 insertions, 9 deletions

diff --git a/spec/features/projects/commit/user_comments_on_commit_spec.rb b/spec/features/projects/commit/user_comments_on_commit_spec.rb
new file mode 100644
index 00000000000..6397a8ad845
--- /dev/null
+++ b/spec/features/projects/commit/user_comments_on_commit_spec.rb
@@ -0,0 +1,109 @@
+require "spec_helper"
+
+describe "User comments on commit", :js do
+  include Spec::Support::Helpers::Features::NotesHelpers
+  include RepoHelpers
+
+  let(:project) { create(:project, :repository) }
+  let(:user) { create(:user) }
+  let(:comment_text) { "XML attached" }
+
+  before do
+    sign_in(user)
+    project.add_developer(user)
+
+    visit(project_commit_path(project, sample_commit.id))
+  end
+
+  context "when adding new comment" do
+    it "adds comment" do
+      emoji_code = ":+1:"
+
+      page.within(".js-main-target-form") do
+        expect(page).not_to have_link("Cancel")
+
+        fill_in("note[note]", with: "#{comment_text} #{emoji_code}")
+
+        # Check on `Preview` tab
+        click_link("Preview")
+
+        expect(find(".js-md-preview")).to have_content(comment_text).and have_css("gl-emoji")
+        expect(page).not_to have_css(".js-note-text")
+
+        # Check on `Write` tab
+        click_link("Write")
+
+        expect(page).to have_field("note[note]", with: "#{comment_text} #{emoji_code}")
+
+        # Submit comment from the `Preview` tab to get rid of a separate `it` block
+        # which would specially tests if everything gets cleared from the note form.
+        click_link("Preview")
+        click_button("Comment")
+      end
+
+      wait_for_requests
+
+      page.within(".note") do
+        expect(page).to have_content(comment_text).and have_css("gl-emoji")
+      end
+
+      page.within(".js-main-target-form") do
+        expect(page).to have_field("note[note]", with: "").and have_no_css(".js-md-preview")
+      end
+    end
+  end
+
+  context "when editing comment" do
+    before do
+      add_note(comment_text)
+    end
+
+    it "edits comment" do
+      new_comment_text = "+1 Awesome!"
+
+      page.within(".main-notes-list") do
+        note = find(".note")
+        note.hover
+
+        note.find(".js-note-edit").click
+      end
+
+      page.find(".current-note-edit-form textarea")
+
+      page.within(".current-note-edit-form") do
+        fill_in("note[note]", with: new_comment_text)
+        click_button("Save comment")
+      end
+
+      wait_for_requests
+
+      page.within(".note") do
+        expect(page).to have_content(new_comment_text)
+      end
+    end
+  end
+
+  context "when deleting comment" do
+    before do
+      add_note(comment_text)
+    end
+
+    it "deletes comment" do
+      page.within(".note") do
+        expect(page).to have_content(comment_text)
+      end
+
+      page.within(".main-notes-list") do
+        note = find(".note")
+        note.hover
+
+        find(".more-actions").click
+        find(".more-actions .dropdown-menu li", match: :first)
+
+        accept_confirm { find(".js-note-delete").click }
+      end
+
+      expect(page).not_to have_css(".note")
+    end
+  end
+end
diff --git a/spec/features/projects/merge_requests/user_comments_on_diff_spec.rb b/spec/features/projects/merge_requests/user_comments_on_diff_spec.rb
index e3f90a78cb5..1828b60fec7 100644
--- a/spec/features/projects/merge_requests/user_comments_on_diff_spec.rb
+++ b/spec/features/projects/merge_requests/user_comments_on_diff_spec.rb
@@ -91,7 +91,7 @@ describe 'User comments on a diff', :js do
 
           # Check the same comments in the side-by-side view.
           execute_script("window.scrollTo(0,0);")
-          click_link('Side-by-side')
+          click_button 'Side-by-side'
 
           wait_for_requests
 
@@ -120,7 +120,7 @@ describe 'User comments on a diff', :js do
         click_button('Comment')
       end
 
-      page.within('.diff-file:nth-of-type(5) .note') do
+      page.within('.diff-file:nth-of-type(5) .discussion .note') do
         find('.js-note-edit').click
 
         page.within('.current-note-edit-form') do
@@ -131,7 +131,7 @@ describe 'User comments on a diff', :js do
         expect(page).not_to have_button('Save comment', disabled: true)
       end
 
-      page.within('.diff-file:nth-of-type(5) .note') do
+      page.within('.diff-file:nth-of-type(5) .discussion .note') do
         expect(page).to have_content('Typo, please fix').and have_no_content('Line is wrong')
       end
     end
@@ -150,7 +150,7 @@ describe 'User comments on a diff', :js do
         expect(page).to have_content('1')
       end
 
-      page.within('.diff-file:nth-of-type(5) .note') do
+      page.within('.diff-file:nth-of-type(5) .discussion .note') do
         find('.more-actions').click
         find('.more-actions .dropdown-menu li', match: :first)
 
diff --git a/spec/features/projects/merge_requests/user_comments_on_merge_request_spec.rb b/spec/features/projects/merge_requests/user_comments_on_merge_request_spec.rb
index 2eb652147ce..f90aaba3caf 100644
--- a/spec/features/projects/merge_requests/user_comments_on_merge_request_spec.rb
+++ b/spec/features/projects/merge_requests/user_comments_on_merge_request_spec.rb
@@ -16,7 +16,7 @@ describe 'User comments on a merge request', :js do
 
   it 'adds a comment' do
     page.within('.js-main-target-form') do
-      fill_in(:note_note, with: '# Comment with a header')
+      fill_in('note[note]', with: '# Comment with a header')
       click_button('Comment')
     end
 
@@ -32,7 +32,6 @@ describe 'User comments on a merge request', :js do
     # Add new comment in background in order to check
     # if it's going to be loaded automatically for current user.
     create(:diff_note_on_merge_request, project: project, noteable: merge_request, author: user, note: 'Line is wrong')
-
     # Trigger a refresh of notes.
     execute_script("$(document).trigger('visibilitychange');")
     wait_for_requests
diff --git a/spec/features/projects/merge_requests/user_views_diffs_spec.rb b/spec/features/projects/merge_requests/user_views_diffs_spec.rb
index d36aafdbc54..b1bfe9e5de3 100644
--- a/spec/features/projects/merge_requests/user_views_diffs_spec.rb
+++ b/spec/features/projects/merge_requests/user_views_diffs_spec.rb
@@ -16,7 +16,7 @@ describe 'User views diffs', :js do
     it 'unfolds diffs' do
       first('.js-unfold').click
 
-      expect(first('.text-file')).to have_content('.bundle')
+      expect(find('.file-holder[id="a5cc2925ca8258af241be7e5b0381edf30266302"] .text-file')).to have_content('.bundle')
     end
   end
 
@@ -36,7 +36,7 @@ describe 'User views diffs', :js do
 
   context 'when in the side-by-side view' do
     before do
-      click_link('Side-by-side')
+      click_button 'Side-by-side'
 
       wait_for_requests
     end
@@ -45,6 +45,14 @@ describe 'User views diffs', :js do
       expect(page).to have_css('.parallel')
     end
 
+    it 'toggles container class' do
+      expect(page).not_to have_css('.content-wrapper > .container-fluid.container-limited')
+
+      click_link 'Commits'
+
+      expect(page).to have_css('.content-wrapper > .container-fluid.container-limited')
+    end
+
     include_examples 'unfold diffs'
   end
 end
diff --git a/spec/features/projects/view_on_env_spec.rb b/spec/features/projects/view_on_env_spec.rb
index 7f547a4ca1f..84ec32b3fac 100644
--- a/spec/features/projects/view_on_env_spec.rb
+++ b/spec/features/projects/view_on_env_spec.rb
@@ -59,7 +59,9 @@ describe 'View on environment', :js do
 
         it 'has a "View on env" button' do
           within '.diffs' do
-            expect(page).to have_link('View on feature.review.example.com', href: 'http://feature.review.example.com/ruby/feature')
+            text = 'View on feature.review.example.com'
+            url = 'http://feature.review.example.com/ruby/feature'
+            expect(page).to have_selector("a[data-original-title='#{text}'][href='#{url}']")
           end
         end
       end