[E2E] Regroup and move all related files to the root (metabase#28749)

* Register new E2E path alias

* Move E2E support files

* Move E2E runner files

* Move E2E snapshot related files

* Move E2E visual regression tests

* Move E2E `downloads` scenarios

* Move E2E `admin` scenarios

* Move E2E `auditing` scenarios

* Move E2E `bining` scenarios

* Move E2E `ccollections` scenarios

* Move E2E `cross-version` scenarios

* Move E2E `custom-column` scenarios

* Move E2E `dashboard` scenarios

* Move E2E `dashboard-filters` scenarios

* Move E2E `dashboard` reproductions

* Move E2E `embedding` scenarios

* Move E2E `filters` scenarios

* Move E2E `joins` scenarios

* Move E2E `models` scenarios

* Move E2E `native-filters` scenarios

* Move E2E `native` scenarios

* Move E2E `onboarding` scenarios

* Move E2E `organization` scenarios

* Move E2E `permissions` scenarios

* Move E2E `question` scenarios

* Move E2E `visualizations` scenarios

* Move E2E `sharing` scenarios

* Move E2E `docker-compose`

* Fix commands imports

* Fix helpers imports

* Fix downloads reproductions imports

* Fix integration imports

* Move visual regression tests

* Various fixes

* Move `validate-e2e-files` script

* Add eslint rules for E2E folder

* Improve file paths

* Move `cross-version` tests into scenarios

* Path fixes

* Register E2E alias in tsconfig

* Fix failing tests after rebase

.github/file-paths.yaml

@@ -25,7 +25,7 @@ frontend_sources: &frontend_sources
 
 frontend_specs: &frontend_specs
   - *shared_specs
-  - "frontend/test/!(__support__|__runner__)/**"
+  - "frontend/test/**"
   - "frontend/**/*.unit.*"
   - "jest.unit.conf.json"
   - "jest.tz.unit.conf.json"
@@ -70,8 +70,9 @@ sources: &sources
 
 e2e_specs: &e2e_specs
   - "**/*.cy.*.js"
-  - "frontend/test/__support__/e2e/**"
-  - "frontend/test/__runner__/*cypress*"
+  - "e2e/runner/**"
+  - "e2e/support/**"
+  - "e2e/snapshot*/**"
 
 e2e_all:
   - *default

.github/workflows/e2e-cross-version.yml

@@ -58,8 +58,8 @@ jobs:
       run: |
         yarn cypress run \
           --browser chrome \
-          --config-file frontend/test/metabase/scenarios/cross-version/source/shared/cross-version-source.config.js \
-          --spec frontend/test/metabase/scenarios/cross-version/source/**/*.cy.spec.js
+          --config-file e2e/test/scenarios/cross-version/source/shared/cross-version-source.config.js \
+          --spec e2e/test/scenarios/cross-version/source/**/*.cy.spec.js
     - name: Stop Metabase ${{ matrix.version.source }}
       run: docker stop metabase-${{ matrix.version.source }}
 
@@ -85,8 +85,8 @@ jobs:
       run: |
         yarn cypress run \
           --browser chrome \
-          --config-file frontend/test/metabase/scenarios/cross-version/target/shared/cross-version-target.config.js \
-          --spec frontend/test/metabase/scenarios/cross-version/target/**/*.cy.spec.js
+          --config-file e2e/test/scenarios/cross-version/target/shared/cross-version-target.config.js \
+          --spec e2e/test/scenarios/cross-version/target/**/*.cy.spec.js
     - name: Upload Cypress Artifacts upon failure
       uses: actions/upload-artifact@v3
       if: failure()

.github/workflows/e2e-tests.yml

@@ -169,7 +169,7 @@ jobs:
         run: |
           yarn run test-cypress-run \
           --env grepTags=@OSS \
-          --spec './frontend/test/metabase/scenarios/**/*.cy.spec.js'
+          --spec './e2e/test/scenarios/**/*.cy.spec.js'
         env:
           TERM: xterm
 

.gitignore

@@ -34,6 +34,7 @@
 /deploy/artifacts/*
 /docs/uberdoc.html
 /frontend/test/snapshots/*
+/e2e/snapshots/*
 /lein-plugins/*/target
 /local
 /locales/metabase-*.pot

docs/developers-guide/e2e-tests.md

@@ -8,7 +8,7 @@ Metabase uses Cypress for “end-to-end testing”, that is, tests that are exec
 
 ## Getting Started
 
-Metabase’s Cypress tests are located in the `frontend/test/metabase/scenarios` source tree, in a structure that roughly mirrors Metabase’s URL structure. For example, tests for the admin “datamodel” pages are located in `frontend/test/metabase/scenarios/admin/datamodel`.
+Metabase’s Cypress tests are located in the `e2e/test/scenarios` source tree, in a structure that roughly mirrors Metabase’s URL structure. For example, tests for the admin “datamodel” pages are located in `e2e/test/scenarios/admin/datamodel`.
 
 During development you will want to run `yarn build-hot` to continuously build the frontend, and `yarn test-cypress-open` to open the Cypress application where you can execute the tests you are working on.
 
@@ -17,7 +17,7 @@ To run all Cypress tests programmatically in the terminal:
 yarn run test-cypress-run
 ```
 
-You can run a specific set of scenarios by using the `--folder` flag, which will pick up the chosen scenarios under `frontend/test/metabase/scenarios/`.
+You can run a specific set of scenarios by using the `--folder` flag, which will pick up the chosen scenarios under `e2e/test/scenarios/`.
 
 ```
 yarn run test-cypress-run --folder sharing
@@ -26,7 +26,7 @@ yarn run test-cypress-run --folder sharing
 You can quickly test a single file only by using the `--spec` flag.
 
 ```
-yarn test-cypress-run --spec frontend/test/metabase/scenarios/question/new.cy.spec.js
+yarn test-cypress-run --spec e2e/test/scenarios/question/new.cy.spec.js
 ```
 
 Cypress test files are structured like Mocha tests, where `describe` blocks are used to group related tests, and `it` blocks are the tests themselves.

docs/developers-guide/visual-tests.md

@@ -35,7 +35,7 @@ To recap:
 
 We use Cypress to write Percy tests so we can fully use all existing helpers and custom commands.
 
-Visual regression tests live inside the `frontend/test/metabase-visual` directory. Writing a Percy test consists of creating a desired page state and executing `cy.createPercySnapshot()` command.
+Visual regression tests live inside the `e2e/test/visual` directory. Writing a Percy test consists of creating a desired page state and executing `cy.createPercySnapshot()` command.
 
 ### Goal
 
@@ -45,7 +45,7 @@ Each visual test should cover as many as possible different elements, variants o
 
 1. Run Metabase in the dev mode locally (`yarn dev` or similar commands).
 2. Run `yarn test-visual-open` to open Cypress locally. You do not need to export any `PERCY_TOKEN`.
-3. Create a spec inside `frontend/test/metabase-visual` and run it via Cypress runner.
+3. Create a spec inside `e2e/test/visual` and run it via Cypress runner.
 
 At this step, if you added `percySnapshot` command somewhere in your test, you will see `percyHealthCheck` step in your test:
 

e2e/.eslintrc

@@ -0,0 +1,11 @@
+{
+  "rules": {
+    "import/no-commonjs": 0,
+    "no-color-literals": 0
+  },
+  "env": {
+    "cypress/globals": true,
+    "node": true
+  },
+  "plugins": ["cypress"]
+}

frontend/test/__runner__/cypress-runner-backend.js → e2e/runner/cypress-runner-backend.js

@@ -27,7 +27,7 @@ const CypressBackend = {
         "-Dh2.bindAddress=localhost", // fix H2 randomly not working (?)
         "-Djava.awt.headless=true", // when running on macOS prevent little Java icon from popping up in Dock
         "-Duser.timezone=US/Pacific",
-        `-Dlog4j.configurationFile=file:${__dirname}/log4j2.xml`,
+        `-Dlog4j.configurationFile=file:${__dirname}/../../frontend/test/__runner__/log4j2.xml`,
       ];
 
       const metabaseConfig = {

frontend/test/__runner__/cypress-runner-generate-snapshots.js → e2e/runner/cypress-runner-generate-snapshots.js

@@ -3,7 +3,7 @@ const cypress = require("cypress");
 const getConfig = baseUrl => {
   return {
     browser: "chrome",
-    configFile: "frontend/test/__support__/e2e/cypress-snapshots.config.js",
+    configFile: "e2e/support/cypress-snapshots.config.js",
     config: {
       baseUrl,
     },

frontend/test/__runner__/cypress-runner-get-version.js → e2e/runner/cypress-runner-get-version.js

@@ -4,7 +4,7 @@ const { printBold, printCyan } = require("./cypress-runner-utils.js");
 const getVersion = async () => {
   try {
     const version = fs.readFileSync(
-      __dirname + "/../../../resources/version.properties",
+      __dirname + "/../../resources/version.properties",
     );
 
     printBold("Running e2e test runner with this build:");

frontend/test/__runner__/cypress-runner-run-tests.js → e2e/runner/cypress-runner-run-tests.js

@@ -32,7 +32,7 @@ const parseArguments = async () => {
 };
 
 const getSourceFolder = folder => {
-  return `./frontend/test/metabase/scenarios/${folder}/**/*.cy.spec.js`;
+  return `./e2e/test/scenarios/${folder}/**/*.cy.spec.js`;
 };
 
 const runCypress = async (baseUrl, exitFunction) => {
@@ -43,7 +43,7 @@ const runCypress = async (baseUrl, exitFunction) => {
 
   const defaultConfig = {
     browser: "chrome",
-    configFile: "frontend/test/__support__/e2e/cypress.config.js",
+    configFile: "e2e/support/cypress.config.js",
     config: {
       baseUrl,
     },

frontend/test/snapshot-creators/default.cy.snap.js → e2e/snapshot-creators/default.cy.snap.js

@@ -1,12 +1,12 @@
 import _ from "underscore";
-import { snapshot, restore, withSampleDatabase } from "__support__/e2e/helpers";
+import { snapshot, restore, withSampleDatabase } from "e2e/support/helpers";
 import {
   USERS,
   USER_GROUPS,
   SAMPLE_DB_ID,
   SAMPLE_DB_TABLES,
   METABASE_SECRET_KEY,
-} from "__support__/e2e/cypress_data";
+} from "e2e/support/cypress_data";
 
 const {
   STATIC_ORDERS_ID,
@@ -42,7 +42,7 @@ describe("snapshots", () => {
         hideNewSampleTables(SAMPLE_DATABASE);
         createQuestionsAndDashboards(SAMPLE_DATABASE);
         cy.writeFile(
-          "frontend/test/__support__/e2e/cypress_sample_database.json",
+          "e2e/support/cypress_sample_database.json",
           SAMPLE_DATABASE,
         );
       });

frontend/test/snapshot-creators/qa-db.cy.snap.js → e2e/snapshot-creators/qa-db.cy.snap.js

@@ -5,7 +5,7 @@ import {
   addMongoDatabase,
   addMySQLDatabase,
   setupWritableDB,
-} from "__support__/e2e/helpers";
+} from "e2e/support/helpers";
 
 describe("qa databases snapshots", { tags: "@external" }, () => {
   beforeEach(() => {

frontend/test/__support__/e2e/commands/api/composite/createDashboardWithQuestions.js → e2e/support/commands/api/composite/createDashboardWithQuestions.js

@@ -1,4 +1,4 @@
-import { cypressWaitAll } from "__support__/e2e/helpers";
+import { cypressWaitAll } from "e2e/support/helpers";
 
 Cypress.Commands.add(
   "createDashboardWithQuestions",

frontend/test/__support__/e2e/commands/api/composite/createTimelineWithEvents.js → e2e/support/commands/api/composite/createTimelineWithEvents.js

@@ -1,4 +1,4 @@
-import { cypressWaitAll } from "__support__/e2e/helpers";
+import { cypressWaitAll } from "e2e/support/helpers";
 
 Cypress.Commands.add("createTimelineWithEvents", ({ timeline, events }) => {
   return cy.createTimeline(timeline).then(({ body: timeline }) => {

frontend/test/__support__/e2e/commands/api/question.js → e2e/support/commands/api/question.js

@@ -1,4 +1,4 @@
-import { SAMPLE_DB_ID } from "__support__/e2e/cypress_data";
+import { SAMPLE_DB_ID } from "e2e/support/cypress_data";
 
 Cypress.Commands.add("createQuestion", (questionDetails, customOptions) => {
   const { name, query } = questionDetails;

frontend/test/__support__/e2e/commands/permissions/sandboxTable.js → e2e/support/commands/permissions/sandboxTable.js

@@ -1,4 +1,4 @@
-import { USER_GROUPS, SAMPLE_DB_TABLES } from "__support__/e2e/cypress_data";
+import { USER_GROUPS, SAMPLE_DB_TABLES } from "e2e/support/cypress_data";
 
 const { STATIC_ORDERS_ID } = SAMPLE_DB_TABLES;
 

frontend/test/__support__/e2e/commands/permissions/updatePermissions.js → e2e/support/commands/permissions/updatePermissions.js

@@ -1,4 +1,4 @@
-import { SAMPLE_DB_ID, USER_GROUPS } from "__support__/e2e/cypress_data";
+import { SAMPLE_DB_ID, USER_GROUPS } from "e2e/support/cypress_data";
 
 const { COLLECTION_GROUP } = USER_GROUPS;
 

frontend/test/__support__/e2e/commands/user/authentication.js → e2e/support/commands/user/authentication.js

@@ -1,4 +1,4 @@
-import { USERS } from "__support__/e2e/cypress_data";
+import { USERS } from "e2e/support/cypress_data";
 
 Cypress.Commands.add("signIn", (user = "admin") => {
   const { email: username, password } = USERS[user];

frontend/test/__support__/e2e/commands/user/createUser.js → e2e/support/commands/user/createUser.js

@@ -1,4 +1,4 @@
-import { USERS } from "__support__/e2e/cypress_data";
+import { USERS } from "e2e/support/cypress_data";
 
 Cypress.Commands.add("createUserFromRawData", user => {
   return cy.request("POST", "/api/user", user).then(({ body }) => {

frontend/test/__support__/e2e/config.js → e2e/support/config.js

@@ -83,13 +83,12 @@ const defaultConfig = {
      ********************************************************************/
 
     if (!isQaDatabase) {
-      config.excludeSpecPattern =
-        "frontend/test/snapshot-creators/qa-db.cy.snap.js";
+      config.excludeSpecPattern = "e2e/snapshot-creators/qa-db.cy.snap.js";
     }
 
     // `grepIntegrationFolder` needs to point to the root!
     // See: https://github.com/cypress-io/cypress/issues/24452#issuecomment-1295377775
-    config.env.grepIntegrationFolder = "../../../../";
+    config.env.grepIntegrationFolder = "../";
     config.env.grepFilterSpecs = true;
 
     config.env.HAS_ENTERPRISE_TOKEN = hasEnterpriseToken;
@@ -102,7 +101,7 @@ const defaultConfig = {
 
     return config;
   },
-  supportFile: "frontend/test/__support__/e2e/cypress.js",
+  supportFile: "e2e/support/cypress.js",
   videoUploadOnPasses: false,
   chromeWebSecurity: false,
   modifyObstructiveCode: false,
@@ -113,7 +112,7 @@ const mainConfig = {
   // New `specPattern` is the combination of the old:
   //   1. testFiles and
   //   2. integrationFolder
-  specPattern: "frontend/test/**/*.cy.spec.js",
+  specPattern: "e2e/test/**/*.cy.spec.js",
   projectId: "KetpiS",
   viewportHeight: 800,
   viewportWidth: 1280,
@@ -133,21 +132,19 @@ const mainConfig = {
 
 const snapshotsConfig = {
   ...defaultConfig,
-  specPattern: "frontend/test/snapshot-creators/**/*.cy.snap.js",
+  specPattern: "e2e/snapshot-creators/**/*.cy.snap.js",
 };
 
 const crossVersionSourceConfig = {
   ...defaultConfig,
   baseUrl: "http://localhost:3000",
-  specPattern:
-    "frontend/test/metabase/scenarios/cross-version/source/**/*.cy.spec.js",
+  specPattern: "e2e/test/scenarios/cross-version/source/**/*.cy.spec.js",
 };
 
 const crossVersionTargetConfig = {
   ...defaultConfig,
   baseUrl: "http://localhost:3001",
-  specPattern:
-    "frontend/test/metabase/scenarios/cross-version/target/**/*.cy.spec.js",
+  specPattern: "e2e/test/scenarios/cross-version/target/**/*.cy.spec.js",
 };
 
 module.exports = {

frontend/test/__support__/e2e/cypress_sample_database.js → e2e/support/cypress_sample_database.js

@@ -1,6 +1,6 @@
 /**
  *  This JSON file gets recreated every time Cypress starts.
- *  See: `frontend/test/snapshot-creators/default.cy.snap.js:19`
+ *  See: `e2e/snapshot-creators/default.cy.snap.js:19`
  *
  *  - It had to be added to `.gitignore`.
  *  - It contains extracted metadata from sample database (table ids and field ids)

frontend/test/__support__/e2e/helpers/e2e-action-helpers.js → e2e/support/helpers/e2e-action-helpers.js

@@ -1,5 +1,5 @@
 import { capitalize } from "inflection";
-import { SAMPLE_DB_ID } from "__support__/e2e/cypress_data";
+import { SAMPLE_DB_ID } from "e2e/support/cypress_data";
 export function enableActionsForDB(dbId = SAMPLE_DB_ID) {
   return cy.request("PUT", `/api/database/${dbId}`, {
     settings: {

frontend/test/__support__/e2e/helpers/e2e-ad-hoc-question-helpers.js → e2e/support/helpers/e2e-ad-hoc-question-helpers.js

@@ -1,5 +1,5 @@
-import { SAMPLE_DB_ID, SAMPLE_DB_TABLES } from "__support__/e2e/cypress_data";
-import { runNativeQuery } from "__support__/e2e/helpers/e2e-misc-helpers";
+import { SAMPLE_DB_ID, SAMPLE_DB_TABLES } from "e2e/support/cypress_data";
+import { runNativeQuery } from "e2e/support/helpers/e2e-misc-helpers";
 
 const {
   STATIC_ORDERS_ID,

frontend/test/__support__/e2e/helpers/e2e-bi-basics-helpers.js → e2e/support/helpers/e2e-bi-basics-helpers.js

@@ -1,4 +1,4 @@
-import { popover } from "__support__/e2e/helpers";
+import { popover } from "e2e/support/helpers";
 
 /**
  * Initiate Summarize action

frontend/test/__support__/e2e/helpers/e2e-collection-helpers.js → e2e/support/helpers/e2e-collection-helpers.js

@@ -1,4 +1,4 @@
-import { getFullName, popover } from "__support__/e2e/helpers";
+import { getFullName, popover } from "e2e/support/helpers";
 
 /**
  * Clicks the "+" icon on the collection page and selects one of the menu options

frontend/test/__support__/e2e/helpers/e2e-data-model-helpers.js → e2e/support/helpers/e2e-data-model-helpers.js

@@ -1,6 +1,6 @@
 export function remapDisplayValueToFK({ display_value, name, fk } = {}) {
   // Both display_value and fk are expected to be field IDs
-  // You can get them from frontend/test/__support__/e2e/cypress_sample_database.json
+  // You can get them from e2e/support/cypress_sample_database.json
   cy.request("POST", `/api/field/${display_value}/dimension`, {
     field_id: display_value,
     name,

frontend/test/__support__/e2e/helpers/e2e-database-metadata-helpers.js → e2e/support/helpers/e2e-database-metadata-helpers.js

@@ -1,4 +1,4 @@
-import { SAMPLE_DB_ID } from "__support__/e2e/cypress_data";
+import { SAMPLE_DB_ID } from "e2e/support/cypress_data";
 
 export function withDatabase(databaseId, f) {
   cy.request(

frontend/test/__support__/e2e/helpers/e2e-embedding-helpers.js → e2e/support/helpers/e2e-embedding-helpers.js

@@ -1,7 +1,6 @@
-import { METABASE_SECRET_KEY } from "__support__/e2e/cypress_data";
+import { METABASE_SECRET_KEY } from "e2e/support/cypress_data";
 
-const jwtSignLocation =
-  "frontend/test/__support__/e2e/external/e2e-jwt-sign.js";
+const jwtSignLocation = "e2e/support/external/e2e-jwt-sign.js";
 
 /**
  * Programatically generate token and visit the embedded page for question or dashboard

frontend/test/__support__/e2e/helpers/e2e-filter-helpers.js → e2e/support/helpers/e2e-filter-helpers.js

@@ -1,7 +1,4 @@
-import {
-  modal,
-  popover,
-} from "__support__/e2e/helpers/e2e-ui-elements-helpers";
+import { modal, popover } from "e2e/support/helpers/e2e-ui-elements-helpers";
 
 export function setDropdownFilterType() {
   cy.findByText("Dropdown list").click();

frontend/test/__support__/e2e/helpers/e2e-misc-helpers.js → e2e/support/helpers/e2e-misc-helpers.js

@@ -1,4 +1,4 @@
-import { modal } from "__support__/e2e/helpers/e2e-ui-elements-helpers";
+import { modal } from "e2e/support/helpers/e2e-ui-elements-helpers";
 
 // Find a text field by label text, type it in, then blur the field.
 // Commonly used in our Admin section as we auto-save settings.

frontend/test/__support__/e2e/helpers/e2e-notebook-helpers.js → e2e/support/helpers/e2e-notebook-helpers.js

@@ -1,4 +1,4 @@
-import { popover } from "__support__/e2e/helpers/e2e-ui-elements-helpers";
+import { popover } from "e2e/support/helpers/e2e-ui-elements-helpers";
 
 export function openNotebook() {
   return cy.icon("notebook").click();

frontend/test/__support__/e2e/helpers/e2e-permissions-helpers.js → e2e/support/helpers/e2e-permissions-helpers.js

@@ -1,4 +1,4 @@
-import { popover } from "__support__/e2e/helpers";
+import { popover } from "e2e/support/helpers";
 
 export function selectSidebarItem(item) {
   cy.findAllByRole("menuitem").contains(item).click();

frontend/test/__support__/e2e/helpers/e2e-qa-databases-helpers.js → e2e/support/helpers/e2e-qa-databases-helpers.js

@@ -6,7 +6,7 @@ import {
   WRITABLE_DB_CONFIG,
   WRITABLE_DB_ID,
   QA_DB_CONFIG,
-} from "__support__/e2e/cypress_data";
+} from "e2e/support/cypress_data";
 
 /*****************************************
  **            QA DATABASES             **

frontend/test/__support__/e2e/integration/visit-dashboard.cy.spec.js → e2e/support/integration/visit-dashboard.cy.spec.js

@@ -1,5 +1,5 @@
-import { restore, visitDashboard } from "../helpers";
-import { USERS } from "../cypress_data";
+import { restore, visitDashboard } from "e2e/support/helpers";
+import { USERS } from "e2e/support/cypress_data";
 
 import { setup } from "./visit-dashboard";