Merge pull request #545 from DavidRajnoha/incident-new-ui-and-data-test-selectors

OBSINTA-795: Data Test Selectors for Incidents Page

Author: jgbernalp

web/cypress/e2e/incidents/00.coo_incidents_e2e.cy.ts

@@ -39,26 +39,24 @@ describe('BVT: Incidents - e2e', () => {
   it('1. Admin perspective - Incidents page - Incident with custom alert lifecycle', () => {
     cy.log('1.1 Navigate to Incidents page and clear filters');
     incidentsPage.goTo();
-    commonPages.titleShouldHaveText('Incidents');
     incidentsPage.clearAllFilters();
 
     const intervalMs = 60_000;
     const maxMinutes = 30; 
 
     cy.log('1.2 Wait for incident with custom alert to appear');
-    cy.waitUntilWithCustomTimeout(
+    cy.waitUntil(
       () => incidentsPage.findIncidentWithAlert(currentAlertName),
       { 
         interval: intervalMs, 
         timeout: maxMinutes * intervalMs,
-        timeoutMessage: `Custom timeout: Incident with alert "${currentAlertName}" did not appear within ${maxMinutes} minutes.`
       }
     );
 
     cy.log('1.3 Verify custom alert appears in alerts table');
     incidentsPage
       .elements
-      .alertsTable()
+      .incidentsTable()
       .contains(currentAlertName)
       .should('exist');
   });

web/cypress/e2e/incidents/01.incidents.cy.ts

@@ -40,7 +40,6 @@ describe('BVT: Incidents - UI', () => {
   beforeEach(() => {
     cy.log('Navigate to Observe → Incidents');
     incidentsPage.goTo();
-    commonPages.titleShouldHaveText('Incidents');
   });
 
   it('1. Admin perspective - Incidents page - Toolbar and charts toggle functionality', () => {
@@ -59,18 +58,18 @@ describe('BVT: Incidents - UI', () => {
     cy.log('2.1 Set days filter to 3 days');
     incidentsPage.setDays('3 days');
 
-    cy.log('2.2 Verify filter and URL update');
-    incidentsPage.elements.daysSelect().should('contain.text', '3 days');
-    cy.url().should('match', /[?&]days=3\+days/);
+    cy.log('2.2 Verify filter selection is updated');
+    incidentsPage.elements.daysSelectToggle().should('contain.text', '3 days');
   });
 
   it('3. Admin perspective - Incidents page - Critical filter functionality', () => {
     cy.log('3.1 Clear filters and toggle Critical filter');
     incidentsPage.clearAllFilters();
     incidentsPage.toggleFilter('Critical');
-    
-    cy.log('3.2 Verify URL is updated with incident filters');
-    cy.url().should('match', /incidentFilters=.*Critical/);
+    // Visibility verification of the filter chip is too complex. The functionality will be 
+    // better verified in the filtering specific test.
+    cy.log('3.2 Verify filter can be removed');
+    incidentsPage.removeFilter('Severity', 'Critical');
   });
 
   it('4. Admin perspective - Incidents page - Charts and alerts empty state', () => {
@@ -84,17 +83,17 @@ describe('BVT: Incidents - UI', () => {
     incidentsPage.elements.alertsChartEmptyState().should('exist');
   });
 
-  it('5. Admin perspective - Incidents page - Incident selection and alert details', () => {
-    cy.mockIncidentFixture('incident-scenarios/1-single-incident-firing-critical-and-warning-alerts.yaml');
-
-    cy.log('5.1 Select incident and verify alert details');
+  it('5. Admin perspective - Incidents page - Traverse Incident Table', () => {
+    cy.log('5.1 Traverse incident table');
     incidentsPage.clearAllFilters();
-    incidentsPage.selectIncidentByBarIndex(0);
-    cy.url().should('match', /[?&]groupId=/);
-    incidentsPage.elements.alertsChartSvg().find('path').should('exist');
 
-    cy.log('5.2 Verify alerts table and expand first row');
-    incidentsPage.elements.alertsTable().should('exist');
-    incidentsPage.expandRow(0);
+    cy.log('5.2 Verify traversing incident table works when the alert is not present');
+    cy.mockIncidentFixture('incident-scenarios/1-single-incident-firing-critical-and-warning-alerts.yaml');
+    incidentsPage.findIncidentWithAlert('TargetAlert').should('be.false');
+
+    incidentsPage.clearAllFilters
+    cy.log('5.3 Verify traversing incident table works when the alert is present');
+    cy.mockIncidentFixture('incident-scenarios/6-multi-incident-target-alert-scenario.yaml');
+    incidentsPage.findIncidentWithAlert('TargetAlert').should('be.true');    
   });
 });

web/cypress/e2e/incidents/02.incidents-mocking-example.cy.ts

@@ -35,7 +35,6 @@ describe('Incidents - Mocking Examples', () => {
   beforeEach(() => {
     cy.log('Navigate to Observe → Incidents');
     incidentsPage.goTo();
-    commonPages.titleShouldHaveText('Incidents');
   });
 
   it('1. Mock healthy cluster from fixture', () => {
@@ -48,7 +47,6 @@ describe('Incidents - Mocking Examples', () => {
   it('2. Mock single incident with critical and warning alerts', () => {
     cy.log('Setting up single incident with critical and warning alerts from fixture');
     cy.mockIncidentFixture('incident-scenarios/1-single-incident-firing-critical-and-warning-alerts.yaml');
-    
     cy.log('Single incident with mixed severity alerts should be visible');
     cy.pause();
   });

web/cypress/fixtures/incident-scenarios/6-multi-incident-target-alert-scenario.yaml

@@ -0,0 +1,98 @@
+name: "Multi-Incident Cross-Namespace Target Alert Scenario"
+description: "Multiple incidents with varying components and severities. The final incident contains alerts from multiple namespaces including a TargetAlert for test query validation."
+incidents:
+  - id: "storage-resolved-001"
+    component: "storage"
+    layer: "core"
+    timeline:
+      start: "6d"
+      end: "4d"
+    alerts:
+      - name: "PersistentVolumeClaimPending001"
+        namespace: "openshift-storage"
+        severity: "critical"
+        firing: false
+        timeline:
+          start: "6d"
+          end: "4d"
+      - name: "StorageNodeDiskSpaceLow001"
+        namespace: "openshift-storage"
+        severity: "warning"
+        firing: false
+        timeline:
+          start: "138h"
+          end: "102h"
+
+  - id: "network-mixed-severity-001"
+    component: "network"
+    layer: "core"
+    timeline:
+      start: "3d"
+    alerts:
+      - name: "NetworkInterfaceDown001"
+        namespace: "openshift-network"
+        severity: "critical"
+        firing: true
+        timeline:
+          start: "3d"
+      - name: "NetworkLatencyHigh001"
+        namespace: "openshift-network"
+        severity: "warning"
+        firing: true
+        timeline:
+          start: "60h"
+      - name: "NetworkBandwidthUtilizationHigh001"
+        namespace: "openshift-network"
+        severity: "info"
+        firing: true
+        timeline:
+          start: "48h"
+
+  - id: "multi-namespace-target-001"
+    component: "monitoring"
+    layer: "core"
+    timeline:
+      start: "2d"
+    alerts:
+      - name: "AlertmanagerReceiversNotConfigured001"
+        namespace: "openshift-monitoring"
+        severity: "critical"
+        firing: true
+        timeline:
+          start: "2d"
+      - name: "PrometheusTargetDown001"
+        namespace: "openshift-monitoring"
+        severity: "warning"
+        firing: true
+        timeline:
+          start: "42h"
+      - name: "TargetAlert"
+        namespace: "openshift-user-workload-monitoring"
+        severity: "critical"
+        firing: true
+        timeline:
+          start: "36h"
+      - name: "KubeDeploymentReplicasMismatch001"
+        namespace: "openshift-kube-apiserver"
+        severity: "warning"
+        firing: true
+        timeline:
+          start: "30h"
+      - name: "EtcdMemberCommunicationSlow001"
+        namespace: "openshift-etcd"
+        severity: "info"
+        firing: true
+        timeline:
+          start: "24h"
+      - name: "NodeExporterDown001"
+        namespace: "openshift-monitoring"
+        severity: "warning"
+        firing: true
+        timeline:
+          start: "18h"
+      - name: "ApplicationHealthCheckFailing001"
+        namespace: "test-application"
+        severity: "critical"
+        firing: true
+        timeline:
+          start: "12h"

web/cypress/support/incidents_prometheus_query_mocks/mock-generators.ts

@@ -93,7 +93,6 @@ function buildTimelineValues(
  */
 export function createIncidentMock(incidents: IncidentDefinition[], query?: string): PrometheusResult[] {
   const now = nowInClusterTimezone();
-
   const results: PrometheusResult[] = [];
 
   // Parse query to extract label selectors if provided

web/cypress/support/incidents_prometheus_query_mocks/prometheus-mocks.ts

@@ -33,7 +33,6 @@ export function mockPrometheusQueryRange(incidents: IncidentDefinition[]): void
     }
 
     results = query.includes('cluster:health:components:map') ? createIncidentMock(incidents, query) : createAlertDetailsMock(incidents, query);
-
     const response: PrometheusResponse = {
         status: 'success',
         data: {
@@ -50,20 +49,21 @@ export function mockPrometheusQueryRange(incidents: IncidentDefinition[]): void
 
 Cypress.Commands.add('mockIncidents', (incidents: IncidentDefinition[]) => {
   cy.log(`=== SETTING UP INCIDENT MOCKING (${incidents.length} incidents) ===`);
-    if (!Array.isArray(incidents)) {
-      throw new Error('mockIncidents expects an array of IncidentDefinition objects');
-    }
+  if (!Array.isArray(incidents)) {
+    throw new Error('mockIncidents expects an array of IncidentDefinition objects');
+  }
 
-    incidents.forEach((incident, index) => {
-      if (!incident.id || !incident.component || !incident.layer || !incident.alerts) {
-        throw new Error(`Invalid incident at index ${index}: missing required fields
-          (id, component, layer, alerts)`);
-      }
-    });
+  incidents.forEach((incident, index) => {
+    if (!incident.id || !incident.component || !incident.layer || !incident.alerts) {
+      throw new Error(`Invalid incident at index ${index}: missing required fields
+        (id, component, layer, alerts)`);
+    }
+  });
 
-    cy.log(`=== SETTING UP INCIDENT MOCKING (${incidents.length} incidents) ===`);
-    // The mocking is not applied until the page is reloaded and the components fetch the new data
-    cy.reload();
+  cy.log(`=== SETTING UP INCIDENT MOCKING (${incidents.length} incidents) ===`);
+  mockPrometheusQueryRange(incidents);
+  // The mocking is not applied until the page is reloaded and the components fetch the new data
+  cy.reload();
 });
 
 Cypress.Commands.add('mockIncidentFixture', (fixturePath: string) => {
@@ -83,6 +83,6 @@ Cypress.Commands.add('mockIncidentFixture', (fixturePath: string) => {
   }
 
 
-    // The mocking is not applied until the page is reloaded and the components fetch the new data
-    cy.reload();
+  // The mocking is not applied until the page is reloaded and the components fetch the new data
+  cy.reload();
 });

web/cypress/support/incidents_prometheus_query_mocks/utils.ts

@@ -69,4 +69,4 @@ export function nowInClusterTimezone(): number {
   const timezone = Cypress.env('TIMEZONE') || 'UTC';
   const now = Math.floor(TZDate.tz(timezone).getTime() / 1000);
   return now;
-}
+}