1 files changed, 9 insertions, 4 deletions
diff --git a/spec/frontend/alert_management/components/alert_management_table_spec.js b/spec/frontend/alert_management/components/alert_management_table_spec.js
index 3e1438c37d6..7fb4f2d2463 100644
--- a/spec/frontend/alert_management/components/alert_management_table_spec.js
+++ b/spec/frontend/alert_management/components/alert_management_table_spec.js
@@ -1,4 +1,4 @@
-import { GlTable, GlAlert, GlLoadingIcon, GlDropdown, GlIcon, GlAvatar } from '@gitlab/ui';
+import { GlTable, GlAlert, GlLoadingIcon, GlDropdown, GlIcon, GlAvatar, GlLink } from '@gitlab/ui';
 import { mount } from '@vue/test-utils';
 import axios from 'axios';
 import MockAdapter from 'axios-mock-adapter';
@@ -31,6 +31,7 @@ describe('AlertManagementTable', () => {
   const findSearch = () => wrapper.findComponent(FilteredSearchBar);
   const findSeverityColumnHeader = () => wrapper.findByTestId('alert-management-severity-sort');
   const findFirstIDField = () => wrapper.findAllByTestId('idField').at(0);
+  const findFirstIDLink = () => wrapper.findAllByTestId('idField').at(0).findComponent(GlLink);
   const findAssignees = () => wrapper.findAllByTestId('assigneesField');
   const findSeverityFields = () => wrapper.findAllByTestId('severityField');
   const findIssueFields = () => wrapper.findAllByTestId('issueField');
@@ -135,10 +136,11 @@ describe('AlertManagementTable', () => {
       expect(findLoader().exists()).toBe(false);
       expect(findAlertsTable().exists()).toBe(true);
       expect(findAlerts()).toHaveLength(mockAlerts.length);
-      expect(findAlerts().at(0).classes()).toContain('gl-hover-bg-blue-50');
+      expect(findAlerts().at(0).classes()).toContain('gl-hover-bg-gray-50');
+      expect(findAlerts().at(0).classes()).not.toContain('gl-hover-border-blue-200');
     });
 
-    it('displays the alert ID and title formatted correctly', () => {
+    it('displays the alert ID and title as a link', () => {
       mountComponent({
         data: { alerts: { list: mockAlerts }, alertsCount, errored: false },
         loading: false,
@@ -146,6 +148,8 @@ describe('AlertManagementTable', () => {
 
       expect(findFirstIDField().exists()).toBe(true);
       expect(findFirstIDField().text()).toBe(`#${mockAlerts[0].iid} ${mockAlerts[0].title}`);
+      expect(findFirstIDLink().text()).toBe(`#${mockAlerts[0].iid} ${mockAlerts[0].title}`);
+      expect(findFirstIDLink().attributes('href')).toBe('/1527542/details');
     });
 
     it('displays status dropdown', () => {
@@ -266,7 +270,8 @@ describe('AlertManagementTable', () => {
             alerts: {
               list: [
                 {
-                  iid: 1,
+                  iid: '1',
+                  title: 'SyntaxError: Invalid or unexpected token',
                   status: 'acknowledged',
                   startedAt: '2020-03-17T23:18:14.996Z',
                   severity: 'high',