[APM] Fix cypress flakiness related to multiple tests (elastic#164708)

Relates to elastic#162032 Attempts to fix most of the Cypress Flaky tests as almost all reported Flaky tests have this piece in common which is the absolute time range selection logic. APM Cypress test running 50 times on the Flaky Test Runner - https://buildkite.com/elastic/kibana-flaky-test-suite-runner/builds/2990
kc13greiner · Aug 25, 2023 · 2595709 · 2595709
1 parent 9058d1e
commit 2595709
Show file tree

Hide file tree

Showing 4 changed files with 56 additions and 47 deletions.
diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/e2e/service_overview/instances_table.cy.ts b/x-pack/plugins/apm/ftr_e2e/cypress/e2e/service_overview/instances_table.cy.ts
@@ -108,7 +108,6 @@ describe('Instances table', () => {
 
       cy.wait('@instancesDetailsRequest');
       cy.getByTestSubj(`instanceDetailsButton_${serviceNodeName}`).realClick();
-      cy.getByTestSubj('loadingSpinner').should('be.visible');
       cy.wait('@instanceDetailsRequest').then(() => {
         cy.contains('Service');
       });

diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/e2e/service_overview/time_comparison.cy.ts b/x-pack/plugins/apm/ftr_e2e/cypress/e2e/service_overview/time_comparison.cy.ts
@@ -50,7 +50,7 @@ const apisToIntercept = [
   },
 ];
 
-describe.skip('Service overview: Time Comparison', () => {
+describe('Service overview: Time Comparison', () => {
   before(() => {
     synthtrace.index(
       opbeans({
@@ -108,48 +108,53 @@ describe.skip('Service overview: Time Comparison', () => {
     cy.getByTestSubj('comparisonSelect').should('have.value', '1w');
   });
 
-  it('changes comparison type when a new time range is selected', () => {
-    cy.visitKibana(serviceOverviewHref);
-    cy.contains('opbeans-java');
-    // Time comparison default value
-    cy.getByTestSubj('comparisonSelect').should('have.value', '1d');
-    cy.contains('Day before');
-    cy.contains('Week before');
-
-    cy.selectAbsoluteTimeRange(
-      '2021-10-10T00:00:00.000Z',
-      '2021-10-20T00:00:00.000Z'
-    );
-
-    cy.getByTestSubj('querySubmitButton').click();
-
-    cy.getByTestSubj('comparisonSelect').should('have.value', '864000000ms');
-    cy.getByTestSubj('comparisonSelect').should(
-      'not.contain.text',
-      'Day before'
-    );
-    cy.getByTestSubj('comparisonSelect').should(
-      'not.contain.text',
-      'Week before'
-    );
-
-    cy.changeTimeRange('Today');
-    cy.contains('Day before');
-    cy.contains('Week before');
+  describe('changes comparison type when a new time range is selected', () => {
+    it('when selecting a manual time range, comparison should display the custom time range', () => {
+      cy.visitKibana(serviceOverviewHref);
+      cy.contains('opbeans-java');
+      // Time comparison default value
+      cy.getByTestSubj('comparisonSelect').should('have.value', '1d');
+      cy.contains('Day before');
+      cy.contains('Week before');
+
+      cy.selectAbsoluteTimeRange(
+        '2021-10-10T00:00:00.000Z',
+        '2021-10-20T00:00:00.000Z'
+      );
 
-    cy.changeTimeRange('Last 24 hours');
-    cy.getByTestSubj('comparisonSelect').should('have.value', '1d');
-    cy.contains('Day before');
-    cy.contains('Week before');
+      cy.getByTestSubj('querySubmitButton').click();
 
-    cy.changeTimeRange('Last 7 days');
-    cy.getByTestSubj('comparisonSelect').should('have.value', '1w');
-    cy.getByTestSubj('comparisonSelect').should('contain.text', 'Week before');
-    cy.getByTestSubj('comparisonSelect').should(
-      'not.contain.text',
-      'Day before'
-    );
-    cy.contains('Week before');
+      cy.getByTestSubj('comparisonSelect').should('have.value', '864000000ms');
+      cy.getByTestSubj('comparisonSelect').should(
+        'not.contain.text',
+        'Day before'
+      );
+      cy.getByTestSubj('comparisonSelect').should(
+        'not.contain.text',
+        'Week before'
+      );
+    });
+    it('when selecting Today from time range, comparison should display both day and week options', () => {
+      cy.visitKibana(serviceOverviewHref);
+      cy.changeTimeRange('Today');
+      cy.getByTestSubj('comparisonSelect').should('have.value', '1d');
+      cy.contains('Day before');
+      cy.contains('Week before');
+    });
+    // Skipped as the test is Flaky
+    xit('when selecting Last Week from time range, comparison should only display week options', () => {
+      cy.visitKibana(serviceOverviewHref);
+      cy.changeTimeRange('Last 7 days');
+      cy.getByTestSubj('comparisonSelect').should('have.value', '1w');
+      cy.getByTestSubj('comparisonSelect').should(
+        'contain.text',
+        'Week before'
+      );
+      cy.getByTestSubj('comparisonSelect').should(
+        'not.contain.text',
+        'Day before'
+      );
+    });
   });
 
   it('hovers over throughput chart shows previous and current period', () => {

diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/e2e/storage_explorer/storage_explorer.cy.ts b/x-pack/plugins/apm/ftr_e2e/cypress/e2e/storage_explorer/storage_explorer.cy.ts
@@ -187,7 +187,6 @@ describe('Storage Explorer', () => {
       cy.contains('opbeans-node');
 
       cy.getByTestSubj('storageDetailsButton_opbeans-node').click();
-      cy.getByTestSubj('loadingSpinner').should('be.visible');
       cy.wait('@storageDetailsRequest');
 
       cy.contains('Service storage details');

diff --git a/x-pack/plugins/apm/ftr_e2e/cypress/support/commands.ts b/x-pack/plugins/apm/ftr_e2e/cypress/support/commands.ts
@@ -80,19 +80,25 @@ Cypress.Commands.add('visitKibana', (url: string) => {
   });
 });
 
+// This command expects from and to both values to be present on the URL where
+// this command is being executed. If from and to values are not present,
+// the date picker renders singleValueInput where this command won't work.
 Cypress.Commands.add(
   'selectAbsoluteTimeRange',
   (start: string, end: string) => {
     const format = 'MMM D, YYYY @ HH:mm:ss.SSS';
 
     cy.getByTestSubj('superDatePickerstartDatePopoverButton').click();
-    cy.getByTestSubj('superDatePickerAbsoluteDateInput')
-      .eq(0)
+    cy.contains('Start date')
+      .nextAll()
+      .find('[data-test-subj="superDatePickerAbsoluteDateInput"]')
       .clear({ force: true })
       .type(moment(start).format(format), { force: true });
+
     cy.getByTestSubj('superDatePickerendDatePopoverButton').click();
-    cy.getByTestSubj('superDatePickerAbsoluteDateInput')
-      .eq(1)
+    cy.contains('End date')
+      .nextAll()
+      .find('[data-test-subj="superDatePickerAbsoluteDateInput"]')
       .clear({ force: true })
       .type(moment(end).format(format), { force: true });
   }