Allow alerts to open on new tab

app/assets/javascripts/alert_management/components/alert_management_table.vue

@@ -267,8 +267,8 @@ export default {
         this.searchTerm = trimmedInput;
       }
     }, 500),
-    navigateToAlertDetails({ iid }) {
-      return visitUrl(joinPaths(window.location.pathname, iid, 'details'));
+    navigateToAlertDetails({ iid }, index, { metaKey }) {
+      return visitUrl(joinPaths(window.location.pathname, iid, 'details'), metaKey);
     },
     trackPageViews() {
       const { category, action } = trackAlertListViewsOptions;

changelogs/unreleased/225655-alert-new-page.yml

+---
+title: Allow alerts to open on new tab
+merge_request: 42691
+author:
+type: changed

spec/frontend/alert_management/components/alert_management_table_spec.js

@@ -295,10 +295,30 @@ describe('AlertManagementTable', () => {
         loading: false,
       });
 
+      expect(visitUrl).not.toHaveBeenCalled();
+
       findAlerts()
         .at(0)
         .trigger('click');
-      expect(visitUrl).toHaveBeenCalledWith('/1527542/details');
+      expect(visitUrl).toHaveBeenCalledWith('/1527542/details', false);
+    });
+
+    it('navigates to the detail page in new tab when alert row is clicked with the metaKey', () => {
+      mountComponent({
+        props: { alertManagementEnabled: true, userCanEnableAlertManagement: true },
+        data: { alerts: { list: mockAlerts }, alertsCount, hasError: false },
+        loading: false,
+      });
+
+      expect(visitUrl).not.toHaveBeenCalled();
+
+      findAlerts()
+        .at(0)
+        .trigger('click', {
+          metaKey: true,
+        });
+
+      expect(visitUrl).toHaveBeenCalledWith('/1527542/details', true);
     });
 
     describe('alert issue links', () => {