Icu 14039 accounts list, read, and set-password test (#2537)

* test: 💍 update test selectors for accounts list

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-14039

* test: 💍 update test selectors for accounts read

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-14039

* test: 💍 update test selectors for accounts set password

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-14039

ui/admin/app/components/auth-methods/auth-method/accounts/account/actions/index.hbs

@@ -4,7 +4,7 @@
 }}
 
 {{#if (can 'delete account' @model)}}
-  <Hds::Dropdown data-test-manage-account-auth-methods as |dd|>
+  <Hds::Dropdown data-test-manage-account-auth-method as |dd|>
     <dd.ToggleButton @text={{t 'actions.manage'}} @color='secondary' />
     <dd.Interactive
       @text={{t 'resources.account.actions.delete'}}

ui/admin/app/components/auth-methods/auth-method/actions/index.hbs

@@ -40,7 +40,7 @@
   </Rose::Dropdown>
 {{/if}}
 
-<Hds::Dropdown data-test-manage-auth-methods-dropdown as |dd|>
+<Hds::Dropdown data-test-manage-auth-method as |dd|>
   <dd.ToggleButton @text={{t 'actions.manage'}} @color='secondary' />
   {{#if @model.isPrimary}}
     <dd.Interactive

ui/admin/tests/acceptance/accounts/list-test.js

@@ -4,7 +4,7 @@
  */
 
 import { module, test } from 'qunit';
-import { visit, click, find } from '@ember/test-helpers';
+import { visit, click } from '@ember/test-helpers';
 import { setupApplicationTest } from 'ember-qunit';
 import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
 import {
@@ -13,27 +13,24 @@ import {
   //currentSession,
   //invalidateSession,
 } from 'ember-simple-auth/test-support';
+import * as selectors from './selectors';
+import * as commonSelectors from 'admin/tests/helpers/selectors';
 
 module('Acceptance | accounts | list', function (hooks) {
   setupApplicationTest(hooks);
   setupMirage(hooks);
 
-  const MANAGE_DROPDOWN_SELECTOR =
-    '[data-test-manage-auth-methods-dropdown] div:first-child button';
-  const CREATE_ACCOUNT_SELECTOR =
-    '[data-test-manage-auth-methods-dropdown] ul li:nth-child(2) a';
-
   const instances = {
     scopes: {
       global: null,
       org: null,
     },
-    authMethods: null,
+    authMethod: null,
     account: null,
   };
   const urls = {
     orgScope: null,
-    authMethods: null,
+    authMethod: null,
     accounts: null,
     newAccount: null,
     account: null,
@@ -55,46 +52,43 @@ module('Acceptance | accounts | list', function (hooks) {
     });
     // Generate route URLs for resources
     urls.orgScope = `/scopes/${instances.scopes.org.id}`;
-    urls.authMethods = `${urls.orgScope}/auth-methods`;
-    urls.authMethod = `${urls.authMethods}/${instances.authMethod.id}`;
+    urls.authMethod = `${urls.orgScope}/auth-methods/${instances.authMethod.id}`;
     urls.accounts = `${urls.authMethod}/accounts`;
     urls.newAccount = `${urls.accounts}/new`;
     urls.account = `${urls.accounts}/${instances.account.id}`;
   });
 
-  hooks.afterEach(async function () {
-    const notification = find('.rose-notification');
-    if (notification) {
-      await click('.rose-notification-dismiss');
-    }
-  });
-
   test('Users can navigate to accounts with proper authorization', async function (assert) {
     await visit(urls.authMethod);
+
     assert.ok(
       instances.authMethod.authorized_collection_actions.accounts.includes(
         'list',
       ),
     );
-    assert.ok(find(`[href="${urls.accounts}"]`));
+    assert.dom(commonSelectors.HREF(urls.accounts)).isVisible();
   });
 
   test('User cannot navigate to index without either list or create actions', async function (assert) {
     instances.authMethod.authorized_collection_actions.accounts = [];
     await visit(urls.authMethod);
+
     assert.notOk(
       instances.authMethod.authorized_collection_actions.accounts.includes(
         'list',
       ),
     );
-    assert.notOk(find(`[href="${urls.accounts}"]`));
+    assert.dom(commonSelectors.HREF(urls.accounts)).doesNotExist();
   });
 
   test('User can navigate to index with only create action', async function (assert) {
     instances.authMethod.authorized_collection_actions.accounts = ['create'];
     await visit(urls.authMethod);
-    assert.ok(find(`[href="${urls.accounts}"]`));
-    await click(MANAGE_DROPDOWN_SELECTOR);
-    assert.dom(CREATE_ACCOUNT_SELECTOR).hasAttribute('href', urls.newAccount);
+
+    assert.dom(commonSelectors.HREF(urls.accounts)).isVisible();
+    await click(selectors.MANAGE_DROPDOWN_AUTH_METHOD);
+    assert
+      .dom(selectors.MANAGE_DROPDOWN_CREATE_ACCOUNT)
+      .hasAttribute('href', urls.newAccount);
   });
 });

ui/admin/tests/acceptance/accounts/read-test.js

@@ -4,7 +4,7 @@
  */
 
 import { module, test } from 'qunit';
-import { visit, currentURL, click, find } from '@ember/test-helpers';
+import { visit, currentURL, click } from '@ember/test-helpers';
 import { setupApplicationTest } from 'ember-qunit';
 import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
 import a11yAudit from 'ember-a11y-testing/test-support/audit';
@@ -14,25 +14,22 @@ import {
   //currentSession,
   //invalidateSession,
 } from 'ember-simple-auth/test-support';
+import * as commonSelectors from 'admin/tests/helpers/selectors';
 
 module('Acceptance | accounts | read', function (hooks) {
   setupApplicationTest(hooks);
   setupMirage(hooks);
 
-  const ACCOUNT_SELECTOR = 'main tbody .hds-table__td:nth-child(1) a';
-
   const instances = {
     scopes: {
       global: null,
       org: null,
     },
-    authMethods: null,
     authMethod: null,
     account: null,
   };
   const urls = {
     orgScope: null,
-    authMethods: null,
     authMethod: null,
     accounts: null,
     account: null,
@@ -54,22 +51,14 @@ module('Acceptance | accounts | read', function (hooks) {
     });
     // Generate route URLs for resources
     urls.orgScope = `/scopes/${instances.scopes.org.id}`;
-    urls.authMethods = `${urls.orgScope}/auth-methods`;
-    urls.authMethod = `${urls.authMethods}/${instances.authMethod.id}`;
+    urls.authMethod = `${urls.orgScope}/auth-methods/${instances.authMethod.id}`;
     urls.accounts = `${urls.authMethod}/accounts`;
     urls.account = `${urls.accounts}/${instances.account.id}`;
   });
 
-  hooks.afterEach(async function () {
-    const notification = find('.rose-notification');
-    if (notification) {
-      await click('.rose-notification-dismiss');
-    }
-  });
-
   test('can navigate to an account form', async function (assert) {
     await visit(urls.accounts);
-    await click(ACCOUNT_SELECTOR);
+    await click(commonSelectors.TABLE_FIRST_ROW_RESOURCE_LINK);
 
     await a11yAudit();
     assert.strictEqual(currentURL(), urls.account);
@@ -79,7 +68,8 @@ module('Acceptance | accounts | read', function (hooks) {
     instances.account.authorized_actions =
       instances.account.authorized_actions.filter((item) => item !== 'read');
     await visit(urls.accounts);
-    assert.dom(ACCOUNT_SELECTOR).doesNotExist();
+
+    assert.dom(commonSelectors.TABLE_FIRST_ROW_RESOURCE_LINK).doesNotExist();
   });
 
   test('user can navigate to account and incorrect url autocorrects', async function (assert) {

ui/admin/tests/acceptance/accounts/selectors.js

@@ -7,11 +7,13 @@ export const APP_HEADER_DROPDOWN =
   '.rose-header-utilities details:first-child summary';
 
 export const MANAGE_DROPDOWN_AUTH_METHOD =
-  '[data-test-manage-auth-methods-dropdown] button';
+  '[data-test-manage-auth-method] button';
 export const MANAGE_DROPDOWN_ACCOUNT =
-  '[data-test-manage-account-auth-methods] button';
+  '[data-test-manage-account-auth-method] button';
 export const MANAGE_DROPDOWN_DELETE_ACCOUNT =
-  '[data-test-manage-account-auth-methods] ul li button';
+  '[data-test-manage-account-auth-method] ul li button';
+export const MANAGE_DROPDOWN_CREATE_ACCOUNT =
+  '[data-test-manage-auth-method] ul li:nth-child(2) a';
 
 export const FIELD_CURRENT_PASSWORD = '[name=currentPassword]';
 export const FIELD_CURRENT_PASSWORD_VALUE = 'current password';

ui/admin/tests/acceptance/accounts/set-password-test.js

@@ -4,7 +4,7 @@
  */
 
 import { module, test } from 'qunit';
-import { visit, currentURL, click, find, fillIn } from '@ember/test-helpers';
+import { visit, currentURL, click, fillIn } from '@ember/test-helpers';
 import { setupApplicationTest } from 'ember-qunit';
 import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
 import a11yAudit from 'ember-a11y-testing/test-support/audit';
@@ -15,6 +15,8 @@ import {
   //currentSession,
   //invalidateSession,
 } from 'ember-simple-auth/test-support';
+import * as selectors from './selectors';
+import * as commonSelectors from 'admin/tests/helpers/selectors';
 
 module('Acceptance | accounts | set password', function (hooks) {
   setupApplicationTest(hooks);
@@ -25,13 +27,13 @@ module('Acceptance | accounts | set password', function (hooks) {
       global: null,
       org: null,
     },
-    authMethods: null,
+    authMethod: null,
     account: null,
   };
   const urls = {
     orgScope: null,
-    authMethods: null,
-    accounts: null,
+    authMethod: null,
+    account: null,
     setPassword: null,
   };
 
@@ -51,24 +53,22 @@ module('Acceptance | accounts | set password', function (hooks) {
     });
     // Generate route URLs for resources
     urls.orgScope = `/scopes/${instances.scopes.org.id}`;
-    urls.authMethods = `${urls.orgScope}/auth-methods`;
-    urls.authMethod = `${urls.authMethods}/${instances.authMethod.id}`;
-    urls.accounts = `${urls.authMethod}/accounts`;
-    urls.account = `${urls.accounts}/${instances.account.id}`;
+    urls.authMethod = `${urls.orgScope}/auth-methods/${instances.authMethod.id}`;
+    urls.account = `${urls.authMethod}/accounts/${instances.account.id}`;
     urls.setPassword = `${urls.account}/set-password`;
   });
 
   test('visiting account set password', async function (assert) {
     await visit(urls.setPassword);
+
     await a11yAudit();
     assert.strictEqual(currentURL(), urls.setPassword);
   });
 
   test('can navigate to route with proper authorization', async function (assert) {
     await visit(urls.account);
-    assert.ok(
-      find(`.rose-layout-page-navigation [href="${urls.setPassword}"]`),
-    );
+
+    assert.dom(commonSelectors.HREF(urls.setPassword)).isVisible();
   });
 
   test('cannot navigate to route without proper authorization', async function (assert) {
@@ -76,10 +76,10 @@ module('Acceptance | accounts | set password', function (hooks) {
       (item) => item !== 'set-password',
     );
     instances.account.update({ authorized_actions });
+
     await visit(urls.account);
-    assert.notOk(
-      find(`.rose-layout-page-navigation [href="${urls.setPassword}"]`),
-    );
+
+    assert.dom(commonSelectors.HREF(urls.setPassword)).doesNotExist();
   });
 
   test('can set a new password for account', async function (assert) {
@@ -97,20 +97,21 @@ module('Acceptance | accounts | set password', function (hooks) {
         return { id };
       },
     );
+
     await visit(urls.setPassword);
-    await fillIn('[name="password"]', 'update password');
-    await click('form [type="submit"]:not(:disabled)');
+
+    await fillIn(selectors.FIELD_PASSWORD, 'update password');
+    await click(commonSelectors.SAVE_BTN);
     await a11yAudit();
   });
 
-  // NOTE: since set password is a tabbed route with easy navigation away
-  // from the form, and the form does not directly operate on a model instance,
-  // a "cancel" flow doesn't make much sense.  Disabling for now.
-  test.skip('can cancel setting new password', async function (assert) {
+  test('can cancel setting new password by navigating away', async function (assert) {
     await visit(urls.setPassword);
-    await fillIn('[name="password"]', 'update password');
-    await click('form button:not([type="submit"])');
-    assert.notOk(find('[name="password"]').textContent.trim());
+
+    await fillIn(selectors.FIELD_PASSWORD, selectors.FIELD_PASSWORD_VALUE);
+    await click(commonSelectors.HREF(urls.account));
+
+    assert.strictEqual(currentURL(), urls.account);
   });
 
   test('errors are displayed when setting password fails', async function (assert) {
@@ -125,10 +126,12 @@ module('Acceptance | accounts | set password', function (hooks) {
         },
       );
     });
+
     await visit(urls.setPassword);
-    await fillIn('[name="password"]', 'update password');
-    await click('form [type="submit"]');
+    await fillIn(selectors.FIELD_PASSWORD, selectors.FIELD_PASSWORD_VALUE);
+    await click(commonSelectors.SAVE_BTN);
+
+    assert.dom(commonSelectors.ALERT_TOAST).isVisible();
     await a11yAudit();
-    assert.ok(find('[role="alert"]'));
   });
 });

ui/admin/tests/acceptance/auth-methods/create-test.js

@@ -48,9 +48,9 @@ module('Acceptance | auth-methods | create', function (hooks) {
   const TOGGLE_SELECTOR = '[name="prompts"]';
 
   const MANAGE_DROPDOWN_SELECTOR =
-    '[data-test-manage-auth-methods-dropdown] div:first-child button';
+    '[data-test-manage-auth-method] div:first-child button';
   const MAKE_PRIMARY_SELECTOR =
-    '[data-test-manage-auth-methods-dropdown] ul li:first-child button';
+    '[data-test-manage-auth-method] ul li:first-child button';
 
   let getAuthMethodsCount;
   let featuresService;

ui/admin/tests/acceptance/auth-methods/delete-test.js

@@ -31,9 +31,9 @@ module('Acceptance | auth-methods | delete', function (hooks) {
   const ERROR_MSG_SELECTOR = '.rose-notification-body';
 
   const MANAGE_DROPDOWN_SELECTOR =
-    '[data-test-manage-auth-methods-dropdown] div:first-child button';
+    '[data-test-manage-auth-method] div:first-child button';
   const DELETE_ACTION_SELECTOR =
-    '[data-test-manage-auth-methods-dropdown] ul li:last-child button';
+    '[data-test-manage-auth-method] ul li:last-child button';
 
   const instances = {
     scopes: {

ui/admin/tests/acceptance/managed-groups/create-test.js

@@ -30,8 +30,7 @@ module('Acceptance | managed-groups | create', function (hooks) {
   const DESC_INPUT_SELECTOR = '[name="description"]';
   const ERROR_MSG_SELECTOR = '.rose-notification-body';
   const FIELD_ERROR_TEXT_SELECTOR = '.hds-form-error__message';
-  const MANAGE_DROPDOWN_SELECTOR =
-    '[data-test-manage-auth-methods-dropdown] div button';
+  const MANAGE_DROPDOWN_SELECTOR = '[data-test-manage-auth-method] div button';
 
   const instances = {
     scopes: {

ui/admin/tests/acceptance/managed-groups/list-test.js

@@ -20,8 +20,7 @@ module('Acceptance | managed-groups | list', function (hooks) {
   setupIndexedDb(hooks);
 
   let featuresService;
-  const MANAGE_DROPDOWN_SELECTOR =
-    '[data-test-manage-auth-methods-dropdown] div button';
+  const MANAGE_DROPDOWN_SELECTOR = '[data-test-manage-auth-method] div button';
 
   const instances = {
     scopes: {