Merge branch '30622-resolve-note-loading-icon-gone' into 'master'

Resolve "Resolve note loading icon gone"

Closes #30622

See merge request !10628

app/assets/stylesheets/pages/notes.scss

@@ -627,7 +627,6 @@ ul.notes {
   }
 
   &:not(.is-disabled):hover,
-  &:not(.is-disabled):focus,
   &.is-active {
     color: $gl-text-green;
 
@@ -641,6 +640,11 @@ ul.notes {
     height: 15px;
     width: 15px;
   }
+
+  .loading {
+    margin: 0;
+    height: auto;
+  }
 }
 
 .discussion-next-btn {

app/views/projects/notes/_note.html.haml

@@ -52,11 +52,10 @@
                     ":aria-label" => "buttonText",
                     "@click" => "resolve",
                     ":title" => "buttonText",
-                    "v-show" => "!loading",
                     ":ref" => "'button'" }
-                  = icon("spin spinner", "v-show" => "loading")
 
-                  = render "shared/icons/icon_status_success.svg"
+                  = icon("spin spinner", "v-show" => "loading", class: 'loading')
+                  %div{ 'v-show' => '!loading' }= render "shared/icons/icon_status_success.svg"
 
             - if current_user
               - if note.emoji_awardable?

spec/features/merge_requests/diff_notes_resolve_spec.rb

@@ -198,6 +198,8 @@ feature 'Diff notes resolve', feature: true, js: true do
       it 'does not mark discussion as resolved when resolving single note' do
         page.first '.diff-content .note' do
           first('.line-resolve-btn').click
+
+          expect(page).to have_selector('.note-action-button .loading')
           expect(first('.line-resolve-btn')['data-original-title']).to eq("Resolved by #{user.name}")
         end