fix: Most common flaky Cypress tests (#21941)

Author: geido

superset-frontend/cypress-base/cypress/integration/chart_list/list.test.ts

@@ -88,15 +88,14 @@ describe('Charts list', () => {
       saveChartToDashboard('1 - Sample dashboard');
       saveChartToDashboard('2 - Sample dashboard');
       saveChartToDashboard('3 - Sample dashboard');
-      saveChartToDashboard('4 - Sample dashboard');
       visitChartList();
       cy.getBySel('count-crosslinks').should('be.visible');
       cy.getBySel('crosslinks')
         .first()
         .trigger('mouseover')
         .then(() => {
           cy.get('.ant-tooltip')
-            .contains('4 - Sample dashboard')
+            .contains('3 - Sample dashboard')
             .invoke('removeAttr', 'target')
             .click();
           cy.wait('@get');

superset-frontend/cypress-base/cypress/integration/dashboard/editmode.test.ts

@@ -62,6 +62,7 @@ function dragComponent(
     cy.getBySel('dashboard-charts-filter-search-input').type(component);
     cy.wait('@filtering');
   }
+  cy.wait(500);
   drag(`[data-test="${target}"]`, component).to(
     '[data-test="grid-content"] [data-test="dragdroppable-object"]',
   );
@@ -148,16 +149,21 @@ function assertMetadata(text: string) {
     });
 }
 function clearMetadata() {
-  cy.wait(500);
   cy.get('#json_metadata').then($jsonmetadata => {
-    cy.wrap($jsonmetadata).type('{selectall} {backspace}');
+    cy.wrap($jsonmetadata).find('.ace_content').click();
+    cy.wrap($jsonmetadata)
+      .find('.ace_text-input')
+      .type('{selectall} {backspace}');
   });
 }
 
 function writeMetadata(metadata: string) {
-  cy.get('#json_metadata').then($jsonmetadata => {
-    cy.wrap($jsonmetadata).type(metadata, { parseSpecialCharSequences: false });
-  });
+  cy.get('#json_metadata').then($jsonmetadata =>
+    cy
+      .wrap($jsonmetadata)
+      .find('.ace_text-input')
+      .type(metadata, { parseSpecialCharSequences: false }),
+  );
 }
 
 function openExplore(chartName: string) {

superset-frontend/cypress-base/cypress/integration/dashboard/nativeFilters.test.ts

@@ -593,13 +593,13 @@ describe('Native filters', () => {
     });
 
     it('User can cancel changes in native filter', () => {
-      visitDashboard();
-      enterNativeFilterEditModal(false);
-      fillNativeFilterForm(
-        testItems.filterType.value,
-        'suffix',
-        testItems.datasetForNativeFilter,
-      );
+      prepareDashboardFilters([
+        { name: 'country_name', column: 'country_name', datasetId: 2 },
+      ]);
+      enterNativeFilterEditModal();
+      cy.getBySel('filters-config-modal__name-input').type('|EDITED', {
+        force: true,
+      });
       cancelNativeFilterSettings();
       enterNativeFilterEditModal();
       cy.get(nativeFilters.filtersList.removeIcon).first().click();

superset-frontend/cypress-base/cypress/integration/explore/advanced_analytics.test.ts

@@ -29,7 +29,9 @@ describe('Advanced analytics', () => {
     cy.visitChartByName('Num Births Trend');
     cy.verifySliceSuccess({ waitAlias: '@postJson' });
 
-    cy.get('.ant-collapse-header').contains('Advanced Analytics').click();
+    cy.get('.ant-collapse-header')
+      .contains('Advanced Analytics')
+      .click({ force: true });
 
     cy.get('[data-test=time_compare]').find('.ant-select').click();
     cy.get('[data-test=time_compare]')
@@ -43,13 +45,16 @@ describe('Advanced analytics', () => {
     cy.get('button[data-test="run-query-button"]').click();
     cy.wait('@postJson');
     cy.wait('@putExplore');
+
     cy.reload();
     cy.verifySliceSuccess({
       waitAlias: '@postJson',
       chartSelector: 'svg',
     });
     cy.wait('@getExplore');
-    cy.get('.ant-collapse-header').contains('Advanced Analytics').click();
+    cy.get('.ant-collapse-header')
+      .contains('Advanced Analytics')
+      .click({ force: true });
     cy.get('[data-test=time_compare]')
       .find('.ant-select-selector')
       .contains('28 days');

superset-frontend/cypress-base/cypress/integration/explore/control.test.ts

@@ -23,29 +23,22 @@ import { interceptChart } from 'cypress/utils';
 import { FORM_DATA_DEFAULTS, NUM_METRIC } from './visualizations/shared.helper';
 
 describe('Datasource control', () => {
+  beforeEach(() => {
+    cy.preserveLogin();
+  });
+
   const newMetricName = `abc${Date.now()}`;
 
   it('should allow edit dataset', () => {
-    let numScripts = 0;
-
-    cy.login();
     interceptChart({ legacy: true }).as('chartData');
 
     cy.visitChartByName('Num Births Trend');
     cy.verifySliceSuccess({ waitAlias: '@chartData' });
 
     cy.get('[data-test="datasource-menu-trigger"]').click();
 
-    cy.get('script').then(nodes => {
-      numScripts = nodes.length;
-    });
-
     cy.get('[data-test="edit-dataset"]').click();
 
-    // should load additional scripts for the modal
-    cy.get('script').then(nodes => {
-      expect(nodes.length).to.greaterThan(numScripts);
-    });
     cy.get('[data-test="edit-dataset-tabs"]').within(() => {
       cy.contains('Metrics').click();
     });
@@ -205,6 +198,7 @@ describe('Time range filter', () => {
           cy.get('input[value="now"]');
         });
         cy.get('[data-test=cancel-button]').click();
+        cy.wait(500);
         cy.get('.ant-popover').should('not.be.visible');
       });
   });

superset-frontend/cypress-base/cypress/integration/explore/utils.ts

@@ -17,6 +17,8 @@
  * under the License.
  */
 
+import { interceptGet as interceptDashboardGet } from '../dashboard/utils';
+
 export function interceptFiltering() {
   cy.intercept('GET', `/api/v1/chart/?q=*`).as('filtering');
 }
@@ -41,6 +43,10 @@ export function interceptExploreJson() {
   cy.intercept('POST', `/superset/explore_json/**`).as('getJson');
 }
 
+export function interceptExploreGet() {
+  cy.intercept('GET', `/api/v1/explore/?slice_id=**`).as('getExplore');
+}
+
 export function setFilter(filter: string, option: string) {
   interceptFiltering();
 
@@ -51,6 +57,10 @@ export function setFilter(filter: string, option: string) {
 }
 
 export function saveChartToDashboard(dashboardName: string) {
+  interceptDashboardGet();
+  interceptUpdate();
+  interceptExploreGet();
+
   cy.getBySel('query-save-button').click();
   cy.get(
     '[data-test="save-chart-modal-select-dashboard-form"] [aria-label="Select a dashboard"]',
@@ -59,13 +69,16 @@ export function saveChartToDashboard(dashboardName: string) {
     .click();
   cy.get(
     '.ant-select-selection-search-input[aria-label="Select a dashboard"]',
-  ).type(dashboardName);
+  ).type(dashboardName.slice(0, 3));
   cy.get(`.ant-select-item-option[title="${dashboardName}"]`).click();
   cy.getBySel('btn-modal-save').click();
+
+  cy.wait('@update');
+  cy.wait('@get');
+  cy.wait('@getExplore');
 }
 
 export function visitSampleChartFromList(chartName: string) {
   cy.getBySel('table-row').contains(chartName).click();
   cy.intercept('POST', '/superset/explore_json/**').as('getJson');
-  cy.wait(500);
 }

superset-frontend/cypress-base/cypress/integration/sqllab/tabs.test.ts

@@ -39,11 +39,11 @@ describe('SqlLab query tabs', () => {
       );
 
       // add two new tabs
-      cy.get('[data-test="add-tab-icon"]:visible:last').click();
+      cy.get('[data-test="add-tab-icon"]:visible:last').click({ force: true });
       cy.contains('[role="tab"]', `Untitled Query ${initialUntitledCount + 1}`);
       cy.get(tabSelector).should('have.length', initialTabCount + 1);
 
-      cy.get('[data-test="add-tab-icon"]:visible:last').click();
+      cy.get('[data-test="add-tab-icon"]:visible:last').click({ force: true });
       cy.contains('[role="tab"]', `Untitled Query ${initialUntitledCount + 2}`);
       cy.get(tabSelector).should('have.length', initialTabCount + 2);