chore: Upgrade Cypress to 10.11.0 (#23813)

.github/workflows/bashlib.sh

@@ -159,11 +159,11 @@ cypress-run() {
 
   say "::group::Run Cypress for [$page]"
   if [[ -z $CYPRESS_KEY ]]; then
-    $cypress --spec "cypress/integration/$page" --browser "$browser"
+    $cypress --spec "cypress/e2e/$page" --browser "$browser"
   else
     export CYPRESS_RECORD_KEY=$(echo $CYPRESS_KEY | base64 --decode)
     # additional flags for Cypress dashboard recording
-    $cypress --spec "cypress/integration/$page" --browser "$browser" \
+    $cypress --spec "cypress/e2e/$page" --browser "$browser" \
       --record --group "$group" --tag "${GITHUB_REPOSITORY},${GITHUB_EVENT_NAME}" \
       --parallel --ci-build-id "${GITHUB_SHA:0:8}-${NONCE}"
   fi
@@ -232,7 +232,7 @@ cypress-run-applitools() {
   nohup flask run --no-debugger -p $port >"$flasklog" 2>&1 </dev/null &
   local flaskProcessId=$!
 
-  $cypress --spec "cypress/integration/*/**/*.applitools.test.ts" --browser "$browser" --headless --config ignoreTestFiles="[]"
+  $cypress --spec "cypress/e2e/*/**/*.applitools.test.ts" --browser "$browser" --headless --config ignoreTestFiles="[]"
 
   codecov -c -F "cypress" || true
 

CONTRIBUTING.md

@@ -859,10 +859,10 @@ npm install
 npm run cypress-run-chrome
 
 # run tests from a specific file
-npm run cypress-run-chrome -- --spec cypress/integration/explore/link.test.ts
+npm run cypress-run-chrome -- --spec cypress/e2e/explore/link.test.ts
 
 # run specific file with video capture
-npm run cypress-run-chrome -- --spec cypress/integration/dashboard/index.test.js --config video=true
+npm run cypress-run-chrome -- --spec cypress/e2e/dashboard/index.test.js --config video=true
 
 # to open the cypress ui
 npm run cypress-debug

docs/docs/contributing/testing-locally.mdx

@@ -111,10 +111,10 @@ npm install
 npm run cypress-run-chrome
 
 # run tests from a specific file
-npm run cypress-run-chrome -- --spec cypress/integration/explore/link.test.ts
+npm run cypress-run-chrome -- --spec cypress/e2e/explore/link.test.ts
 
 # run specific file with video capture
-npm run cypress-run-chrome -- --spec cypress/integration/dashboard/index.test.js --config video=true
+npm run cypress-run-chrome -- --spec cypress/e2e/dashboard/index.test.js --config video=true
 
 # to open the cypress ui
 npm run cypress-debug

superset-frontend/cypress-base/cypress.config.ts

@@ -0,0 +1,48 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { defineConfig } from 'cypress';
+
+export default defineConfig({
+  chromeWebSecurity: false,
+  defaultCommandTimeout: 8000,
+  numTestsKeptInMemory: 0,
+  experimentalFetchPolyfill: true,
+  requestTimeout: 10000,
+  video: false,
+  videoUploadOnPasses: false,
+  viewportWidth: 1280,
+  viewportHeight: 1024,
+  projectId: 'ukwxzo',
+  retries: {
+    runMode: 2,
+    openMode: 0,
+  },
+  e2e: {
+    // We've imported your old cypress plugins here.
+    // You may want to clean this up later by importing these.
+    setupNodeEvents(on, config) {
+      // eslint-disable-next-line global-require,import/extensions
+      return require('./cypress/plugins/index.js')(on, config);
+    },
+    baseUrl: 'http://localhost:8088',
+    excludeSpecPattern: ['**/*.applitools.test.ts'],
+    specPattern: ['cypress/e2e/**/*.{js,jsx,ts,tsx}'],
+  },
+});

superset-frontend/cypress-base/cypress.json

@@ -1,18 +0,0 @@
-{
-  "baseUrl": "http://localhost:8088",
-  "chromeWebSecurity": false,
-  "defaultCommandTimeout": 8000,
-  "numTestsKeptInMemory": 0,
-  "experimentalFetchPolyfill": true,
-  "requestTimeout": 10000,
-  "ignoreTestFiles": ["**/!(*.test.js|*.test.ts)", "*.applitools.test.ts"],
-  "video": false,
-  "videoUploadOnPasses": false,
-  "viewportWidth": 1280,
-  "viewportHeight": 1024,
-  "projectId": "ukwxzo",
-  "retries": {
-    "runMode": 2,
-    "openMode": 0
-  }
-}

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

@@ -153,7 +153,7 @@ function clearMetadata() {
     cy.wrap($jsonmetadata).find('.ace_content').click();
     cy.wrap($jsonmetadata)
       .find('.ace_text-input')
-      .type('{selectall} {backspace}');
+      .type('{selectall} {backspace}', { force: true });
   });
 }
 
@@ -162,7 +162,7 @@ function writeMetadata(metadata: string) {
     cy
       .wrap($jsonmetadata)
       .find('.ace_text-input')
-      .type(metadata, { parseSpecialCharSequences: false }),
+      .type(metadata, { parseSpecialCharSequences: false, force: true }),
   );
 }
 

superset-frontend/cypress-base/cypress/e2e/dashboard/utils.ts

@@ -260,8 +260,8 @@ export function fillNativeFilterForm(
     .find(nativeFilters.filtersPanel.filterName)
     .last()
     .click({ scrollBehavior: false })
-    .clear()
-    .type(name, { scrollBehavior: false });
+    .clear({ force: true })
+    .type(name, { scrollBehavior: false, force: true });
   if (dataset) {
     cy.get(nativeFilters.modal.container)
       .find(nativeFilters.filtersPanel.datasetName)

superset-frontend/cypress-base/cypress/e2e/explore/chart.test.js

@@ -17,7 +17,7 @@
  * under the License.
  */
 import { CHART_LIST } from 'cypress/utils/urls';
-import { interceptGet as interceptDashboardGet } from 'cypress/integration/dashboard/utils';
+import { interceptGet as interceptDashboardGet } from 'cypress/e2e/dashboard/utils';
 import { FORM_DATA_DEFAULTS, NUM_METRIC } from './visualizations/shared.helper';
 import {
   interceptFiltering,

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

@@ -70,7 +70,7 @@ export function saveChartToDashboard(dashboardName: string) {
     .click();
   cy.get(
     '.ant-select-selection-search-input[aria-label="Select a dashboard"]',
-  ).type(dashboardName.slice(0, 3));
+  ).type(dashboardName.slice(0, 3), { force: true });
   cy.get(`.ant-select-item-option[title="${dashboardName}"]`).click();
   cy.getBySel('btn-modal-save').click();
 

superset-frontend/cypress-base/package.json

@@ -2,16 +2,22 @@
   "name": "superset-cypress",
   "version": "1.0.0",
   "description": "run cypress against superset",
+  "license": "Apache-2.0",
+  "author": "Apache",
   "scripts": {
     "cypress": "cypress",
-    "cypress-run-chrome": "cypress run --browser chrome --headless",
-    "cypress-debug": "cypress open --config watchForFileChanges=true"
+    "cypress-debug": "cypress open --config watchForFileChanges=true",
+    "cypress-run-chrome": "cypress run --browser chrome --headless"
+  },
+  "nyc": {
+    "reporter": [
+      "html",
+      "json"
+    ]
   },
-  "author": "Apache",
-  "license": "Apache-2.0",
   "dependencies": {
     "@applitools/eyes-cypress": "^3.29.1",
-    "@cypress/code-coverage": "^3.9.11",
+    "@cypress/code-coverage": "^3.10.4",
     "@superset-ui/core": "^0.18.8",
     "brace": "^0.11.1",
     "cy-verify-downloads": "^0.1.6",
@@ -22,13 +28,7 @@
   },
   "devDependencies": {
     "@types/querystringify": "^2.0.0",
-    "cypress": "^7.0.0",
+    "cypress": "^10.11.0",
     "eslint-plugin-cypress": "^2.12.1"
-  },
-  "nyc": {
-    "reporter": [
-      "html",
-      "json"
-    ]
   }
 }

superset-frontend/cypress_build.sh

@@ -38,7 +38,7 @@ cd cypress-base
 time npm ci
 export CYPRESS_BASE_URL="http://localhost:${PORT}"
 if [ -n "$1" ]; then
-    CYPRESS_PATH='cypress/integration/'${1}'/*'
+    CYPRESS_PATH='cypress/e2e/'${1}'/*'
     time npm run cypress-run-chrome -- --spec "$CYPRESS_PATH" --record false --config video=false || true
 else
     time npm run cypress-run-chrome -- --record false --config video=false || true