Add test ensuring the right connect button is displayed

Author: kraenhansen

packages/compass-e2e-tests/helpers/compass.ts

@@ -65,12 +65,12 @@ const packageCompassAsync = promisify(packageCompass);
 // should we test compass-web (true) or compass electron (false)?
 export const TEST_COMPASS_WEB = isTestingWeb();
 
-/*
-A helper so we can easily find all the tests we're skipping in compass-web.
-Reason is there so you can fill it in and have it show up in search results
-in a scannable manner. It is not being output at present because the tests will
-be logged as pending anyway.
-*/
+/**
+ * A helper so we can easily find all the tests we're skipping in compass-web.
+ * Reason is there so you can fill it in and have it show up in search results
+ * in a scannable manner. It is not being output at present because the tests will
+ * be logged as pending anyway.
+ */
 export function skipForWeb(
   test: Mocha.Runnable | Mocha.Context,
   // eslint-disable-next-line @typescript-eslint/no-unused-vars

packages/compass-e2e-tests/helpers/selectors.ts

@@ -283,7 +283,8 @@ export const Multiple = {
   ConnectionsTitle: '[data-testid="connections-header"]',
   ConnectButton: '[data-action="connection-connect"]',
   ConnectInNewWindowButton: '[data-action="connection-connect-in-new-window"]',
-  ConnectDropdownButton: '[aria-label="see more connection options"]',
+  ConnectDropdownButton:
+    '[data-testid="sidebar-navigation-item-actions-connection-connect-action"] + button',
   SidebarNewConnectionButton: '[data-action="add-new-connection"]',
   ConnectionMenu: '[data-testid="sidebar-navigation-item-actions"]',
   CreateDatabaseButton:

packages/compass-e2e-tests/tests/connection.test.ts

@@ -20,7 +20,10 @@ import {
 import type { Compass } from '../helpers/compass';
 import type { ConnectFormState } from '../helpers/connect-form-state';
 import * as Selectors from '../helpers/selectors';
-import { DEFAULT_CONNECTION_NAMES } from '../helpers/test-runner-context';
+import {
+  DEFAULT_CONNECTION_NAMES,
+  isTestingWeb,
+} from '../helpers/test-runner-context';
 
 async function disconnect(browser: CompassBrowser) {
   try {
@@ -662,6 +665,7 @@ describe('Connect in a new window', () => {
 
   it('can connect in new window', async function (this) {
     skipForWeb(this, 'connecting in new window is not supported on web');
+
     const connectionName = DEFAULT_CONNECTION_NAMES[0];
     const connectionSelector = Selectors.sidebarConnection(connectionName);
     await browser.hover(connectionSelector);
@@ -685,6 +689,22 @@ describe('Connect in a new window', () => {
     });
   });
 
+  it('shows correct connect button', async function (this) {
+    const connectionName = DEFAULT_CONNECTION_NAMES[0];
+    const connectionSelector = Selectors.sidebarConnection(connectionName);
+    await browser.hover(connectionSelector);
+
+    const connectionElement = browser.$(connectionSelector);
+    await connectionElement
+      .$(Selectors.Multiple.ConnectButton)
+      .waitForDisplayed();
+    await connectionElement
+      .$(Selectors.Multiple.ConnectDropdownButton)
+      .waitForExist({
+        reverse: isTestingWeb(),
+      });
+  });
+
   // TODO: Add a test for we to ensure the SplitButton isn't visible on Web
 });