Fixing an old UI test and changing broken selectors

Fixed an old ui test creating comments and resolving discussions.
There was need to delete and change some specific selectors using the
new way to define selectors.

app/assets/javascripts/diffs/components/diff_discussion_reply.vue

@@ -44,7 +44,6 @@ export default {
           class="d-none d-sm-block"
         />
         <reply-placeholder
-          class="qa-discussion-reply"
           :button-text="__('Start a new discussion...')"
           @onClick="$emit('showNewDiscussionForm')"
         />

app/assets/javascripts/diffs/components/diff_file_header.vue

@@ -263,6 +263,7 @@ export default {
               :disabled="!diffHasDiscussions(diffFile)"
               :class="{ active: hasExpandedDiscussions }"
               class="js-btn-vue-toggle-comments btn"
+              data-qa-selector="toggle_comments_button"
               type="button"
               @click="handleToggleDiscussions"
             >

app/assets/javascripts/notes/components/discussion_actions.vue

@@ -41,8 +41,8 @@ export default {
 <template>
   <div class="discussion-with-resolve-btn clearfix">
     <reply-placeholder
+      data-qa-selector="discussion_reply_tab"
       :button-text="s__('MergeRequests|Reply...')"
-      class="qa-discussion-reply"
       @onClick="$emit('showReplyForm')"
     />
 

app/assets/javascripts/notes/components/note_form.vue

@@ -293,12 +293,16 @@ export default {
                 <input
                   v-model="isUnresolving"
                   type="checkbox"
-                  class="qa-unresolve-review-discussion"
+                  data-qa-selector="unresolve_review_discussion_checkbox"
                 />
                 {{ __('Unresolve thread') }}
               </template>
               <template v-else>
-                <input v-model="isResolving" type="checkbox" class="qa-resolve-review-discussion" />
+                <input
+                  v-model="isResolving"
+                  type="checkbox"
+                  data-qa-selector="resolve_review_discussion_checkbox"
+                />
                 {{ __('Resolve thread') }}
               </template>
             </label>

app/views/projects/merge_requests/show.html.haml

@@ -32,7 +32,7 @@
     .merge-request-tabs-holder{ class: ("js-tabs-affix" unless ENV['RAILS_ENV'] == 'test') }
       .merge-request-tabs-container
         %ul.merge-request-tabs.nav-tabs.nav.nav-links
-          %li.notes-tab.qa-notes-tab
+          %li.notes-tab{ data: { qa_selector: 'notes_tab'} }
             = tab_link_for @merge_request, :show, force_link: @commit.present? do
               = _("Discussion")
               %span.badge.badge-pill= @merge_request.related_notes.user.count

ee/spec/javascripts/notes/components/note_form_spec.js

@@ -38,7 +38,9 @@ describe('issue_note_form component', () => {
 
   describe('without batch comments', () => {
     it('does not show resolve checkbox', () => {
-      expect(vm.$el.querySelector('.qa-resolve-review-discussion')).toBe(null);
+      expect(vm.$el.querySelector('[data-qa-selector="resolve_review_discussion_checkbox"]')).toBe(
+        null,
+      );
     });
 
     describe('on enter', () => {
@@ -70,7 +72,9 @@ describe('issue_note_form component', () => {
     });
 
     it('shows resolve checkbox', () => {
-      expect(vm.$el.querySelector('.qa-resolve-review-discussion')).not.toBe(null);
+      expect(
+        vm.$el.querySelector('[data-qa-selector="resolve_review_discussion_checkbox"]'),
+      ).not.toBe(null);
     });
 
     it('hides actions for commits', done => {

qa/qa/ee/page/merge_request/show.rb

@@ -22,8 +22,8 @@ module QA
               end
 
               view 'app/assets/javascripts/notes/components/note_form.vue' do
-                element :unresolve_review_discussion
-                element :resolve_review_discussion
+                element :unresolve_review_discussion_checkbox
+                element :resolve_review_discussion_checkbox
                 element :start_review
                 element :comment_now
               end
@@ -61,11 +61,11 @@ module QA
 
               def resolve_review_discussion
                 scroll_to_element :start_review
-                check_element :resolve_review_discussion
+                check_element :resolve_review_discussion_checkbox
               end
 
               def unresolve_review_discussion
-                check_element :unresolve_review_discussion
+                check_element :unresolve_review_discussion_checkbox
               end
 
               def approvers

qa/qa/page/component/note.rb

@@ -20,13 +20,17 @@ module QA
           end
 
           base.view 'app/assets/javascripts/notes/components/discussion_actions.vue' do
-            element :discussion_reply
+            element :discussion_reply_tab
           end
 
           base.view 'app/assets/javascripts/notes/components/toggle_replies_widget.vue' do
             element :expand_replies
             element :collapse_replies
           end
+
+          base.view 'app/assets/javascripts/diffs/components/diff_file_header.vue' do
+            element :toggle_comments_button
+          end
         end
 
         def start_discussion(text)
@@ -36,8 +40,12 @@ module QA
           click_element :comment_button
         end
 
+        def toggle_comments
+          all_elements(:toggle_comments_button).last.click
+        end
+
         def type_reply_to_discussion(reply_text)
-          all_elements(:discussion_reply).last.click
+          all_elements(:discussion_reply_tab).last.click
           fill_element :reply_input, reply_text
         end
 

qa/qa/specs/features/ee/browser_ui/3_create/merge_request/add_batch_comments_in_merge_request_spec.rb

@@ -3,8 +3,7 @@
 module QA
   context 'Create' do
     describe 'batch comments in merge request' do
-      # Failure issue: https://gitlab.com/gitlab-org/quality/staging/issues/60
-      it 'user submits, discards batch comments', :quarantine do
+      it 'user submits, discards batch comments' do
         Runtime::Browser.visit(:gitlab, Page::Main::Login)
         Page::Main::Login.perform(&:sign_in_using_credentials)
 
@@ -12,12 +11,14 @@ module QA
           project.name = 'project-with-merge-request'
         end
 
-        Resource::MergeRequest.fabricate! do |merge_request|
+        mr = Resource::MergeRequest.fabricate! do |merge_request|
           merge_request.title = 'This is a merge request'
           merge_request.description = 'Great feature'
           merge_request.project = project
         end
 
+        mr.visit!
+
         Page::MergeRequest::Show.perform do |show_page|
           show_page.click_discussions_tab
 
@@ -27,7 +28,7 @@ module QA
           show_page.type_reply_to_discussion("Could you please check this?")
           show_page.comment_now
           expect(show_page).to have_content("Could you please check this?")
-          expect(show_page).to have_content("0/1 discussion resolved")
+          expect(show_page).to have_content("0/1 thread resolved")
 
           show_page.type_reply_to_discussion("Could you also check that?")
           show_page.resolve_review_discussion
@@ -48,12 +49,13 @@ module QA
           expect(show_page).to have_content("Finish review 2")
 
           show_page.submit_pending_reviews
-          expect(show_page).to have_content("2/2 discussions resolved")
+          expect(show_page).to have_content("2/2 threads resolved")
 
+          show_page.toggle_comments
           show_page.type_reply_to_discussion("Unresolving this discussion")
           show_page.unresolve_review_discussion
           show_page.comment_now
-          expect(show_page).to have_content("1/2 discussions resolved")
+          expect(show_page).to have_content("1/2 threads resolved")
         end
 
         Page::MergeRequest::Show.perform do |show_page|