chore(e2e): restructure e2e test helpers to better separate shared state and setup / teardown functions COMPASS-8361 (#6383)

* chore(e2e): restructure e2e test helpers to better separate shared state and setup / teardown functions

* chore: fix depcheck and var name

* chore: remove TEST_PACKAGED_APP env var usage

* chore: replset for test servers and better cleanup

* chore: eslint fixes

* chore(e2e): use DEFAULT_CONNECTIONS in connect form helpers

* chore: ts fix

* chore: update to non-esm version

* chore: fix glob

* chore: remove unused imports

* chore: more glob adjustments

* chore: uncomment retries

* chore: fix env var name

Author: gribnoysup

.evergreen/functions.yml

@@ -664,7 +664,7 @@ functions:
           DEBUG: ${debug|}
           MONGODB_VERSION: ${mongodb_version|}
           MONGODB_RUNNER_VERSION: ${mongodb_version|}
-          BROWSER_NAME: ${browser_name}
+          COMPASS_WEB_BROWSER_NAME: ${browser_name}
           E2E_TEST_GROUPS: ${e2e_test_groups}
           E2E_TEST_GROUP: ${e2e_test_group}
         script: |

package-lock.json

@@ -32,8 +32,6 @@
     "package-compass": "npm run package-compass --workspace=mongodb-compass --",
     "package-compass-debug": "npm run package-compass-debug --workspace=mongodb-compass --",
     "package-compass-nocompile": "npm run package-compass-nocompile --workspace=mongodb-compass --",
-    "prestart": "npm run compile --workspace=@mongodb-js/webpack-config-compass",
-    "prestart-web": "npm run prestart",
     "start": "npm run start --workspace=mongodb-compass",
     "start-web": "npm run start --workspace=@mongodb-js/compass-web",
     "test": "lerna run test --concurrency 1 --stream",

package.json

@@ -2,9 +2,12 @@ ignores:
   - '@mongodb-js/prettier-config-compass'
   - '@mongodb-js/tsconfig-compass'
   - '@wdio/types'
-  - 'mongodb-compass'
   - 'ps-list'
-  - 'mongodb-runner'
+# Avoiding recursive deps on monorepo workspaces
+  - 'mongodb-compass'
+  - '@mongodb-js/mocha-config-compass'
+  - 'compass-e2e-tests'
+  - '@mongodb-js/compass-web'
 # TODO(COMPASS-8312): depcheck doesn't count this dependency because it's a
 # types only import and the depcheck parser is resolving the @types/<name>
 # package as a dep instead

packages/compass-e2e-tests/.depcheckrc

@@ -2,5 +2,3 @@
 .log
 fixtures/*.csv
 fixtures/*.json
-write-electron-versions.js
-electron-versions.json

packages/compass-e2e-tests/.gitignore

@@ -3,7 +3,3 @@
 fixtures
 .nyc_output
 coverage
-
-# Generated files
-electron-versions.json
-write-electron-versions.js

packages/compass-e2e-tests/.prettierignore

@@ -3,15 +3,10 @@ import { expect } from 'chai';
 import type { CompassBrowser } from '../compass-browser';
 import * as Selectors from '../selectors';
 import type { ConnectFormState } from '../connect-form-state';
-import {
-  DEFAULT_CONNECTION_NAME_1,
-  DEFAULT_CONNECTION_NAME_2,
-  DEFAULT_CONNECTION_STRING_1,
-  DEFAULT_CONNECTION_STRING_2,
-  TEST_ATLAS_CLOUD_EXTERNAL_URL,
-  TEST_MULTIPLE_CONNECTIONS,
-} from '../compass';
+import { TEST_MULTIPLE_CONNECTIONS } from '../compass';
 import Debug from 'debug';
+import { DEFAULT_CONNECTIONS } from '../test-runner-context';
+import { getConnectionTitle } from '@mongodb-js/connection-info';
 const debug = Debug('compass-e2e-tests');
 
 export async function resetConnectForm(browser: CompassBrowser): Promise<void> {
@@ -939,29 +934,13 @@ export async function setConnectFormState(
 
 export async function saveConnection(
   browser: CompassBrowser,
-  state: ConnectFormState,
-
-  // TODO(COMPASS-8023): Just remove these once the single connection code is removed
-  favouriteName: string,
-  color: string
+  state: ConnectFormState
 ): Promise<void> {
   await browser.setConnectFormState(state);
-  if (TEST_MULTIPLE_CONNECTIONS) {
-    await browser.clickVisible(Selectors.ConnectionModalSaveButton);
-    await browser
-      .$(Selectors.ConnectionModal)
-      .waitForDisplayed({ reverse: true });
-  } else {
-    await browser.clickVisible(Selectors.ConnectionEditFavouriteButton);
-    await browser.$(Selectors.FavoriteModal).waitForDisplayed();
-    await browser.setValueVisible(Selectors.FavoriteNameInput, favouriteName);
-    await browser.clickVisible(
-      `${Selectors.FavoriteColorSelector} [data-testid="color-pick-${color}"]`
-    );
-    await browser.$(Selectors.FavoriteSaveButton).waitForEnabled();
-    await browser.clickVisible(Selectors.FavoriteSaveButton);
-    await browser.$(Selectors.FavoriteModal).waitForExist({ reverse: true });
-  }
+  await browser.clickVisible(Selectors.ConnectionModalSaveButton);
+  await browser
+    .$(Selectors.ConnectionModal)
+    .waitForDisplayed({ reverse: true });
 }
 
 export async function setupDefaultConnections(browser: CompassBrowser) {
@@ -987,45 +966,20 @@ export async function setupDefaultConnections(browser: CompassBrowser) {
   whereas we do have some tests that try and use those. We can easily change
   this in future if needed, though.
   */
-
-  // no need to setup connections if we are running against Atlas
-  if (TEST_ATLAS_CLOUD_EXTERNAL_URL) {
-    return;
-  }
-
-  for (const connectionName of [
-    DEFAULT_CONNECTION_NAME_1,
-    DEFAULT_CONNECTION_NAME_2,
-  ]) {
+  for (const connectionInfo of DEFAULT_CONNECTIONS) {
+    const connectionName = getConnectionTitle(connectionInfo);
     if (await browser.removeConnection(connectionName)) {
       debug('Removing existing connection so we do not create a duplicate', {
         connectionName,
       });
     }
   }
 
-  await browser.saveConnection(
-    {
-      connectionString: DEFAULT_CONNECTION_STRING_1,
-      // NOTE: no connectionName, we're going with the auto-generated one. Also no
-      // connectionColor. Passing a name and colour for single connection world,
-      // though, because that's the only way to create a favourite.
-    },
-    DEFAULT_CONNECTION_NAME_1,
-    'color1'
-  );
-
-  // no need for a second connection in single connection mode
-  if (TEST_MULTIPLE_CONNECTIONS) {
-    await browser.saveConnection(
-      {
-        connectionString: DEFAULT_CONNECTION_STRING_2,
-        // NOTE: filling in a name so that this one does _not_ have the auto-generated one
-        connectionName: DEFAULT_CONNECTION_NAME_2,
-        connectionColor: 'Iris',
-      },
-      DEFAULT_CONNECTION_NAME_2,
-      'color8'
-    );
+  for (const connectionInfo of DEFAULT_CONNECTIONS) {
+    await browser.saveConnection({
+      connectionString: connectionInfo.connectionOptions.connectionString,
+      connectionName: connectionInfo.favorite?.name,
+      connectionColor: connectionInfo.favorite?.color,
+    });
   }
 }

packages/compass-e2e-tests/helpers/commands/connect-form.ts

@@ -1,6 +1,6 @@
 import path from 'path';
 import type { CompassBrowser } from '../compass-browser';
-import { SCREENSHOTS_PATH } from '../compass';
+import { LOG_SCREENSHOTS_PATH } from '../test-runner-context';
 
 const withTimeout = (millis: number, promise: Promise<any>) => {
   let timeoutPid: NodeJS.Timeout;
@@ -26,7 +26,7 @@ export async function screenshot(
   // are still in progress or not.
   await browser.pause(1000);
 
-  const fullPath = path.join(SCREENSHOTS_PATH, filename);
+  const fullPath = path.join(LOG_SCREENSHOTS_PATH, filename);
   try {
     await withTimeout(10000, browser.saveScreenshot(fullPath));
   } catch (err: any) {