Replace bootstrap alerts in app/views/projects/milestones/show.html.haml

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

@@ -10,11 +10,15 @@
 = render_if_exists 'shared/milestones/burndown', milestone: @milestone, project: @project
 
 - if can?(current_user, :read_issue, @project) && @milestone.total_issues_count == 0
-  .alert.alert-success.gl-mt-3
-    %span= _('Assign some issues to this milestone.')
+  .gl-alert.gl-alert-info.gl-mt-3.gl-mb-5{ data: { testid: 'no-issues-alert' } }
+    = sprite_icon('information-o', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+    .gl-alert-body
+      %span= _('Assign some issues to this milestone.')
 - elsif @milestone.complete? && @milestone.active?
-  .alert.alert-success.gl-mt-3
-    %span= _('All issues for this milestone are closed. You may close this milestone now.')
+  .gl-alert.gl-alert-success.gl-mt-3.gl-mb-5{ data: { testid: 'all-issues-closed-alert' } }
+    = sprite_icon('check-circle', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+    .gl-alert-body
+      %span= _('All issues for this milestone are closed. You may close this milestone now.')
 
 = render 'shared/milestones/tabs', milestone: @milestone
 = render 'shared/milestones/sidebar', milestone: @milestone, project: @project, affix_offset: 153

changelogs/unreleased/233681-replace-bootstrap-alerts-in-app-views-projects-milestones-show-htm.yml

+---
+title: Replace bootstrap alerts in app/views/projects/milestones/show.html.haml
+merge_request: 41396
+author: Gilang Gumilar
+type: changed

spec/features/milestone_spec.rb

@@ -25,7 +25,7 @@ RSpec.describe 'Milestone' do
 
       find('input[name="commit"]').click
 
-      expect(find('.alert-success')).to have_content('Assign some issues to this milestone.')
+      expect(find('[data-testid="no-issues-alert"]')).to have_content('Assign some issues to this milestone.')
       expect(page).to have_content('Nov 16, 2016–Dec 16, 2016')
     end
   end
@@ -37,7 +37,7 @@ RSpec.describe 'Milestone' do
       create(:issue, title: "Bugfix1", project: project, milestone: milestone, state: "closed")
       visit project_milestone_path(project, milestone)
 
-      expect(find('.alert-success')).to have_content('All issues for this milestone are closed. You may close this milestone now.')
+      expect(find('[data-testid="all-issues-closed-alert"]')).to have_content('All issues for this milestone are closed. You may close this milestone now.')
     end
   end