Add tooltip to DAST scan profiles delete button

This commit adds a hover / focus tooltip to the delete button
on the DAST on-demand scans profile page.

ee/app/assets/javascripts/security_configuration/dast_profiles/components/dast_profiles_list.vue

@@ -146,11 +146,12 @@ export default {
         <template #cell(actions)="{ item }">
           <div class="gl-text-right">
             <gl-button
+              v-gl-tooltip.hover.focus
               icon="remove"
               variant="danger"
               category="secondary"
               class="gl-mr-3"
-              :aria-label="__('Delete')"
+              :title="s__('DastProfiles|Delete profile')"
               @click="prepareProfileDeletion(item.id)"
             />
             <gl-button v-if="item.editPath" :href="item.editPath">{{ __('Edit') }}</gl-button>

ee/changelogs/unreleased/249516-in-the-dast-site-profile-and-scanner-profile-lists-the-delete-b.yml

+---
+title: Add tooltip to DAST scan profiles delete button
+merge_request: 44876
+author:
+type: added

ee/spec/frontend/security_configuration/dast_profiles/components/dast_profiles_list_spec.js

@@ -2,6 +2,7 @@ import { merge } from 'lodash';
 import { mount, shallowMount, createWrapper } from '@vue/test-utils';
 import { within } from '@testing-library/dom';
 import { GlModal } from '@gitlab/ui';
+import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
 import DastProfilesList from 'ee/security_configuration/dast_profiles/components/dast_profiles_list.vue';
 
 const TEST_ERROR_MESSAGE = 'something went wrong';
@@ -27,6 +28,11 @@ describe('EE - DastProfilesList', () => {
           propsData: defaultProps,
         },
         options,
+        {
+          directives: {
+            GlTooltip: createMockDirective(),
+          },
+        },
       ),
     );
   };
@@ -195,6 +201,13 @@ describe('EE - DastProfilesList', () => {
       const getCurrentProfileDeleteButton = () =>
         getDeleteButtonWithin(getTableRowForProfile(profile));
 
+      it('shows a tooltip on the delete button', () => {
+        expect(getBinding(getCurrentProfileDeleteButton().element, 'gl-tooltip')).not.toBe(
+          undefined,
+        );
+        expect(getCurrentProfileDeleteButton().attributes().title).toBe('Delete profile');
+      });
+
       it('opens a modal with the correct title when a delete button is clicked', async () => {
         expect(getModal().html()).toBe('');
 

locale/gitlab.pot

@@ -8133,6 +8133,9 @@ msgstr ""
 msgid "DastProfiles|Debug messages"
 msgstr ""
 
+msgid "DastProfiles|Delete profile"
+msgstr ""
+
 msgid "DastProfiles|Do you want to discard this scanner profile?"
 msgstr ""