Refactor authentication test selectors (#2887)

ui/admin/tests/acceptance/authentication-test.js

@@ -137,6 +137,7 @@ module('Acceptance | authentication', function (hooks) {
   test('visiting auth methods authenticate route redirects to first auth method', async function (assert) {
     await visit(authenticateURL);
     await a11yAudit();
+
     assert.strictEqual(currentURL(), authMethodAuthenticateURL);
   });
 
@@ -146,91 +147,108 @@ module('Acceptance | authentication', function (hooks) {
     });
     await visit(authMethodAuthenticateURL);
     await a11yAudit();
+
     assert.strictEqual(currentURL(), authMethodAuthenticateURL);
   });
 
   test('visiting any authentication parent route while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(indexURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
+
     await visit(scopesURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting change password while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(changePasswordURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting orgs while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(orgsURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting org edit while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(orgEditURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting projects while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(projectsURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting new project while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(newProjectURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting users while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(usersURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting roles while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(rolesURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting groups while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(groupsURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting host catalogs while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(hostCatalogsURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting targets while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(targetsURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting sessions while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(sessionsURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting auth methods while unauthenticated redirects to first global authenticate method', async function (assert) {
     await visit(authMethodsURL);
+
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('visiting auth method authenticate route', async function (assert) {
     await visit(authMethodAuthenticateURL);
+
     await a11yAudit();
     assert.strictEqual(currentURL(), authMethodAuthenticateURL);
   });
@@ -238,14 +256,23 @@ module('Acceptance | authentication', function (hooks) {
   test('visiting any authentication parent route while already authenticated with an org redirects to projects', async function (assert) {
     await authenticateSession({ scope });
     await visit(indexURL);
+
     assert.strictEqual(currentURL(), projectsURL);
+
     await visit(scopesURL);
+
     assert.strictEqual(currentURL(), projectsURL);
+
     await visit(orgScopeURL);
+
     assert.strictEqual(currentURL(), projectsURL);
+
     await visit(authenticateURL);
+
     assert.strictEqual(currentURL(), projectsURL);
+
     await visit(authMethodAuthenticateURL);
+
     assert.strictEqual(currentURL(), projectsURL);
     assert.ok(currentSession().isAuthenticated);
   });
@@ -255,43 +282,61 @@ module('Acceptance | authentication', function (hooks) {
       scope: { id: globalScope.id, type: globalScope.type },
     });
     await visit(indexURL);
+
     assert.strictEqual(currentURL(), orgsURL);
+
     await visit(scopesURL);
+
     assert.strictEqual(currentURL(), orgsURL);
+
     await visit(globalAuthenticateURL);
+
     assert.strictEqual(currentURL(), orgsURL);
     assert.ok(currentSession().isAuthenticated);
   });
 
   test('failed authentication shows a notification message', async function (assert) {
     await visit(authMethodAuthenticateURL);
+
     assert.notOk(currentSession().isAuthenticated);
-    await fillIn('[name="identification"]', 'error');
-    await click('[type="submit"]');
-    assert
-      .dom('[data-test-toast-notification].hds-alert--color-critical')
-      .isVisible();
+
+    await fillIn(commonSelectors.FIELD_IDENTIFICATION, 'error');
+    await click(commonSelectors.SAVE_BTN);
+
+    assert.dom(commonSelectors.ALERT_TOAST);
     assert.notOk(currentSession().isAuthenticated);
   });
 
   test('successful authentication with the global scope redirects to orgs', async function (assert) {
     await visit(authMethodGlobalAuthenticateURL);
+
     assert.notOk(currentSession().isAuthenticated);
     assert.strictEqual(currentURL(), authMethodGlobalAuthenticateURL);
-    await fillIn('[name="identification"]', 'test');
-    await fillIn('[name="password"]', 'test');
-    await click('[type="submit"]');
+
+    await fillIn(commonSelectors.FIELD_IDENTIFICATION, 'test');
+    await fillIn(
+      commonSelectors.FIELD_PASSWORD,
+      commonSelectors.FIELD_PASSWORD_VALUE,
+    );
+    await click(commonSelectors.SAVE_BTN);
+
     assert.strictEqual(currentURL(), orgsURL);
     assert.ok(currentSession().isAuthenticated);
   });
 
   test('successful authentication with an org scope redirects to projects', async function (assert) {
     await visit(authMethodAuthenticateURL);
+
     assert.notOk(currentSession().isAuthenticated);
     assert.strictEqual(currentURL(), authMethodAuthenticateURL);
-    await fillIn('[name="identification"]', 'test');
-    await fillIn('[name="password"]', 'test');
-    await click('[type="submit"]');
+
+    await fillIn(commonSelectors.FIELD_IDENTIFICATION, 'test');
+    await fillIn(
+      commonSelectors.FIELD_PASSWORD,
+      commonSelectors.FIELD_PASSWORD_VALUE,
+    );
+    await click(commonSelectors.SAVE_BTN);
+
     assert.strictEqual(currentURL(), projectsURL);
     assert.ok(currentSession().isAuthenticated);
   });
@@ -301,12 +346,15 @@ module('Acceptance | authentication', function (hooks) {
       scope: { id: globalScope.id, type: globalScope.type },
     });
     await visit(orgsURL);
+
     assert.ok(
       currentSession().isAuthenticated,
       'Session begins authenticated, before encountering 401',
     );
+
     this.server.get('/users', () => new Response(401));
     await visit(usersURL);
+
     assert.notOk(
       currentSession().isAuthenticated,
       'Session is unauthenticated, after encountering 401',
@@ -328,7 +376,7 @@ module('Acceptance | authentication', function (hooks) {
     await click(commonSelectors.SIDEBAR_USER_DROPDOWN);
 
     // toggle system default
-    await click('[value="system-default-theme"]');
+    await click(commonSelectors.TOGGLE_THEME_DEFAULT);
 
     assert.strictEqual(
       currentSession().get('data.theme'),
@@ -338,14 +386,14 @@ module('Acceptance | authentication', function (hooks) {
     assert.notOk(getRootElement().classList.contains('rose-theme-dark'));
 
     // toggle dark mode
-    await click('[value="dark"]');
+    await click(commonSelectors.TOGGLE_THEME_DARK);
 
     assert.strictEqual(currentSession().get('data.theme'), 'dark');
     assert.notOk(getRootElement().classList.contains('rose-theme-light'));
     assert.ok(getRootElement().classList.contains('rose-theme-dark'));
 
     // toggle system default
-    await click('[value="system-default-theme"]');
+    await click(commonSelectors.TOGGLE_THEME_DEFAULT);
 
     assert.strictEqual(
       currentSession().get('data.theme'),
@@ -374,16 +422,18 @@ module('Acceptance | authentication', function (hooks) {
       },
     );
     await visit(authMethodOIDCAuthenticateURL);
-    await click('form [type="submit"]');
+
+    await click(commonSelectors.SAVE_BTN);
   });
 
   // TODO:  test OIDC retry and cancel
-
   test('org scopes with no auth methods are not visible in dropdown', async function (assert) {
     await visit(authMethodGlobalAuthenticateURL);
 
-    await click('.hds-dropdown-toggle-button');
+    await click(commonSelectors.AUTH_SCOPE_DROPDOWN);
 
-    assert.dom('.hds-dropdown-list-item a').exists({ count: 3 });
+    assert
+      .dom(commonSelectors.AUTH_SCOPE_DROPDOWN_OPTIONS)
+      .exists({ count: 3 });
   });
 });

ui/admin/tests/helpers/selectors.js

@@ -18,6 +18,8 @@ export const FIELD_DESCRIPTION_VALUE = 'description';
 export const FIELD_PASSWORD = '[name=password]';
 export const FIELD_PASSWORD_VALUE = 'password';
 
+export const FIELD_IDENTIFICATION = '[name=identification]';
+
 export const TABLE_RESOURCE_LINK = (url) => `tbody [href="${url}"]`;
 export const TABLE_ROWS = 'tbody tr';
 export const TABLE_ROW = (row) => `tbody tr:nth-child(${row})`;
@@ -45,6 +47,12 @@ export const SIDEBAR_NAV_LINK = (url) =>
 export const SIDEBAR_NAV_CONTENT = '.hds-side-nav__content';
 export const SIDEBAR_USER_DROPDOWN =
   '[data-test-side-nav-user-dropdown] button';
+export const TOGGLE_THEME_DEFAULT =
+  '[data-test-side-nav-user-dropdown] [value=system-default-theme]';
+export const TOGGLE_THEME_LIGHT =
+  '[data-test-side-nav-user-dropdown] [value=light]';
+export const TOGGLE_THEME_DARK =
+  '[data-test-side-nav-user-dropdown] [value=dark]';
 
 export const ALERT_TOAST = '[data-test-toast-notification]';
 export const ALERT_TOAST_BODY =
@@ -60,6 +68,9 @@ export const MODAL_WARNING_CANCEL_BTN =
 export const MODAL_WARNING_TITLE = '.hds-modal__header';
 export const MODAL_WARNING_MESSAGE = '.hds-modal__body';
 
+export const AUTH_SCOPE_DROPDOWN = '.hds-dropdown button';
+export const AUTH_SCOPE_DROPDOWN_OPTIONS = '.hds-dropdown a';
+
 // Search filtering selectors
 export const SEARCH_INPUT = '.search-filtering [type="search"]';
 export const FILTER_DROPDOWN = (filterName) =>