test: 💍 use selectors in update credential-libraries (#2624)

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

ui/admin/app/components/form/credential-library/vault-generic/index.hbs

@@ -24,7 +24,7 @@
     {{#if @model.errors.name}}
       <F.Error as |E|>
         {{#each @model.errors.name as |error|}}
-          <E.Message data-test-error-message-name>
+          <E.Message>
             {{error.message}}
           </E.Message>
         {{/each}}
@@ -107,7 +107,9 @@
     {{#if @model.errors.path}}
       <F.Error as |E|>
         {{#each @model.errors.path as |error|}}
-          <E.Message>{{error.message}}</E.Message>
+          <E.Message
+            data-test-error-message-vault-path
+          >{{error.message}}</E.Message>
         {{/each}}
       </F.Error>
     {{/if}}

ui/admin/app/components/form/credential-library/vault-ssh-certificate/index.hbs

@@ -26,7 +26,7 @@
     {{#if @model.errors.name}}
       <F.Error as |E|>
         {{#each @model.errors.name as |error|}}
-          <E.Message data-test-error-message-name>
+          <E.Message>
             {{error.message}}
           </E.Message>
         {{/each}}
@@ -108,7 +108,9 @@
     {{#if @model.errors.path}}
       <F.Error as |E|>
         {{#each @model.errors.path as |error|}}
-          <E.Message>{{error.message}}</E.Message>
+          <E.Message
+            data-test-error-message-vault-path
+          >{{error.message}}</E.Message>
         {{/each}}
       </F.Error>
     {{/if}}

ui/admin/tests/acceptance/credential-library/create-test.js

@@ -247,8 +247,8 @@ module('Acceptance | credential-libraries | create', function (hooks) {
           details: {
             request_fields: [
               {
-                name: 'name',
-                description: 'Name is required.',
+                name: 'path',
+                description: 'Vault path is required',
               },
             ],
           },
@@ -262,7 +262,9 @@ module('Acceptance | credential-libraries | create', function (hooks) {
     assert
       .dom(commonSelectors.ALERT_TOAST_BODY)
       .hasText('The request was invalid');
-    assert.dom(commonSelectors.FIELD_NAME_ERROR).hasText('Name is required.');
+    assert
+      .dom(selectors.FIELD_VAULT_PATH_ERROR)
+      .hasText('Vault path is required');
   });
 
   test('cannot select vault ssh cert when feature is disabled', async function (assert) {

ui/admin/tests/acceptance/credential-library/selectors.js

@@ -8,6 +8,7 @@ export const FIELD_CRED_TYPE_VALUE = 'ssh_private_key';
 
 export const FIELD_VAULT_PATH = '[name=vault_path]';
 export const FIELD_VAULT_PATH_VALUE = 'path';
+export const FIELD_VAULT_PATH_ERROR = '[data-test-error-message-vault-path]';
 
 export const FIELD_USERNAME = '[name=username]';
 export const FIELD_USERNAME_VALUE = 'username';

ui/admin/tests/acceptance/credential-library/update-test.js

@@ -4,35 +4,19 @@
  */
 
 import { module, test } from 'qunit';
-import {
-  visit,
-  click,
-  fillIn,
-  currentURL,
-  find,
-  select,
-} from '@ember/test-helpers';
+import { visit, click, fillIn, currentURL, select } from '@ember/test-helpers';
 import { setupApplicationTest } from 'admin/tests/helpers';
 import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
 import { authenticateSession } from 'ember-simple-auth/test-support';
 import { Response } from 'miragejs';
 import { TYPE_CREDENTIAL_LIBRARY_VAULT_SSH_CERTIFICATE } from 'api/models/credential-library';
+import * as selectors from './selectors';
+import * as commonSelectors from 'admin/tests/helpers/selectors';
 
 module('Acceptance | credential-libraries | update', function (hooks) {
   setupApplicationTest(hooks);
   setupMirage(hooks);
 
-  const BUTTON_SELECTOR = '.rose-form-actions [type="button"]';
-  const SAVE_BTN_SELECTOR = '.rose-form-actions [type="submit"]';
-  const NAME_INPUT_SELECTOR = '[name="name"]';
-  const FIELD_ERROR_TEXT_SELECTOR = '.hds-form-error__message';
-  const DESC_INPUT_SELECTOR = '[name="description"]';
-  const VAULT_PATH_SELECTOR = '[name="vault_path"]';
-  const CRED_TYPE_SELECTOR = '[name="credential_type"]';
-  const CRED_MAPPING_OVERRIDES_SELECT =
-    '[name="credential_mapping_overrides"] tbody td:nth-of-type(1) select';
-  const CRED_MAPPING_OVERRIDES_INPUT =
-    '[name="credential_mapping_overrides"] tbody td:nth-of-type(2) input';
   const instances = {
     scopes: {
       global: null,
@@ -89,48 +73,60 @@ module('Acceptance | credential-libraries | update', function (hooks) {
       instances.credentialLibrary.authorized_actions.filter(
         (item) => item !== 'update',
       );
+
     await visit(urls.credentialLibrary);
-    assert.notOk(find(BUTTON_SELECTOR));
+
+    assert.dom(commonSelectors.EDIT_BTN).doesNotExist();
   });
 
   test('can update a credential library and cancel changes', async function (assert) {
     await visit(urls.credentialLibrary);
-    await click(BUTTON_SELECTOR, 'Activate edit mode');
-    await fillIn(NAME_INPUT_SELECTOR, 'random string');
-    await click(BUTTON_SELECTOR);
+    await click(commonSelectors.EDIT_BTN, 'Activate edit mode');
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
+    await click(commonSelectors.CANCEL_BTN);
+
     assert.notEqual(
       this.server.schema.credentialLibraries.all().models[0].name,
-      'random string',
-    );
-    assert.strictEqual(
-      find(NAME_INPUT_SELECTOR).value,
-      instances.credentialLibrary.name,
+      commonSelectors.FIELD_NAME_VALUE,
     );
+    assert
+      .dom(commonSelectors.FIELD_NAME)
+      .hasValue(instances.credentialLibrary.name);
   });
 
   test('can update a vault generic credential library and save changes', async function (assert) {
-    await visit(
-      `${urls.credentialLibraries}/${instances.credentialLibrary.id}`,
+    await visit(urls.credentialLibrary);
+
+    await click(commonSelectors.EDIT_BTN);
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
+    await fillIn(
+      commonSelectors.FIELD_DESCRIPTION,
+      commonSelectors.FIELD_DESCRIPTION_VALUE,
     );
+    await fillIn(selectors.FIELD_VAULT_PATH, selectors.FIELD_VAULT_PATH_VALUE);
+    await select(
+      selectors.FIELD_CRED_MAP_OVERRIDES_SELECT,
+      selectors.FIELD_CRED_MAP_OVERRIDES_SELECT_VALUE,
+    );
+    await fillIn(selectors.FIELD_CRED_MAP_OVERRIDES_INPUT, 'key');
+    await click(selectors.FIELD_CRED_MAP_OVERRIDES_BTN);
+    await click(commonSelectors.SAVE_BTN);
 
-    await click(BUTTON_SELECTOR);
-
-    await fillIn(NAME_INPUT_SELECTOR, 'random string');
-    await fillIn(DESC_INPUT_SELECTOR, 'description');
-    await fillIn(VAULT_PATH_SELECTOR, 'path');
-
-    await select(CRED_MAPPING_OVERRIDES_SELECT, 'private_key_attribute');
-    await fillIn(CRED_MAPPING_OVERRIDES_INPUT, 'key');
-
-    await click('[name="credential_mapping_overrides"] button');
-
-    await click(SAVE_BTN_SELECTOR);
     const credentialLibrary = this.server.schema.credentialLibraries.findBy({
-      name: 'random string',
+      name: commonSelectors.FIELD_NAME_VALUE,
     });
-    assert.strictEqual(credentialLibrary.name, 'random string');
-    assert.strictEqual(credentialLibrary.description, 'description');
-    assert.strictEqual(credentialLibrary.attributes.path, 'path');
+    assert.strictEqual(
+      credentialLibrary.name,
+      commonSelectors.FIELD_NAME_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.description,
+      commonSelectors.FIELD_DESCRIPTION_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.attributes.path,
+      selectors.FIELD_VAULT_PATH_VALUE,
+    );
     assert.deepEqual(credentialLibrary.credentialMappingOverrides, {
       private_key_attribute: 'key',
     });
@@ -148,8 +144,8 @@ module('Acceptance | credential-libraries | update', function (hooks) {
           details: {
             request_fields: [
               {
-                name: 'name',
-                description: 'Name is required',
+                name: 'path',
+                description: 'Vault path is required',
               },
             ],
           },
@@ -157,38 +153,45 @@ module('Acceptance | credential-libraries | update', function (hooks) {
       );
     });
     await visit(urls.credentialLibrary);
-    await click(BUTTON_SELECTOR, 'Activate edit mode');
-    await fillIn(NAME_INPUT_SELECTOR, 'random string');
-    await click(SAVE_BTN_SELECTOR);
+    await click(commonSelectors.EDIT_BTN, 'Activate edit mode');
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
+    await click(commonSelectors.SAVE_BTN);
+
     assert
-      .dom('[data-test-toast-notification] .hds-alert__description')
+      .dom(commonSelectors.ALERT_TOAST_BODY)
       .hasText('The request was invalid.');
-    assert.ok(
-      find(FIELD_ERROR_TEXT_SELECTOR).textContent.trim(),
-      'Name is required.',
-    );
+    assert
+      .dom(selectors.FIELD_VAULT_PATH_ERROR)
+      .hasText('Vault path is required');
   });
 
   test('can discard unsaved credential library changes via dialog', async function (assert) {
     assert.expect(5);
     const confirmService = this.owner.lookup('service:confirm');
     confirmService.enabled = true;
-    assert.notEqual(instances.credentialLibrary.name, 'random string');
+
+    assert.notEqual(
+      instances.credentialLibrary.name,
+      commonSelectors.FIELD_NAME_VALUE,
+    );
 
     await visit(urls.credentialLibrary);
-    await click(BUTTON_SELECTOR, 'Activate edit mode');
-    await fillIn(NAME_INPUT_SELECTOR, 'random string');
+    await click(commonSelectors.EDIT_BTN, 'Activate edit mode');
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
+
     assert.strictEqual(currentURL(), urls.credentialLibrary);
 
     try {
       await visit(urls.credentialLibraries);
     } catch (e) {
-      assert.ok(find('.rose-dialog'));
-      await click('.rose-dialog-footer button:first-child', 'Click Discard');
+      assert.dom(commonSelectors.DIALOG_UNSAVED_CHANGES).isVisible();
+
+      await click(commonSelectors.DIALOG_UNSAVED_CHANGES_DISCARD);
+
       assert.strictEqual(currentURL(), urls.credentialLibraries);
       assert.notEqual(
         this.server.schema.credentialLibraries.all().models[0].name,
-        'random string',
+        commonSelectors.FIELD_NAME_VALUE,
       );
     }
   });
@@ -197,29 +200,38 @@ module('Acceptance | credential-libraries | update', function (hooks) {
     assert.expect(5);
     const confirmService = this.owner.lookup('service:confirm');
     confirmService.enabled = true;
-    assert.notEqual(instances.credentialLibrary.name, 'random string');
+
+    assert.notEqual(
+      instances.credentialLibrary.name,
+      commonSelectors.FIELD_NAME_VALUE,
+    );
+
     await visit(urls.credentialLibrary);
-    await click(BUTTON_SELECTOR, 'Activate edit mode');
-    await fillIn(NAME_INPUT_SELECTOR, 'random string');
+    await click(commonSelectors.EDIT_BTN, 'Activate edit mode');
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
+
     assert.strictEqual(currentURL(), urls.credentialLibrary);
 
     try {
       await visit(urls.credentialLibraries);
-    } catch (e) {
-      assert.ok(find('.rose-dialog'));
-      await click('.rose-dialog-footer button:last-child');
+    } catch {
+      assert.dom(commonSelectors.DIALOG_UNSAVED_CHANGES).isVisible();
+
+      await click(commonSelectors.DIALOG_UNSAVED_CHANGES_CANCEL);
+
       assert.strictEqual(currentURL(), urls.credentialLibrary);
       assert.notEqual(
         this.server.schema.credentialLibraries.all().models[0].name,
-        'random string',
+        commonSelectors.FIELD_NAME_VALUE,
       );
     }
   });
 
   test('cannot update credential type in a vault generic credential library', async function (assert) {
     await visit(urls.credentialLibrary);
-    await click(BUTTON_SELECTOR, 'Activate edit mode');
-    assert.dom(CRED_TYPE_SELECTOR).isDisabled();
+    await click(commonSelectors.EDIT_BTN, 'Activate edit mode');
+
+    assert.dom(selectors.FIELD_CRED_TYPE).isDisabled();
   });
 
   test('can update a vault ssh cert credential library and save changes', async function (assert) {
@@ -231,47 +243,61 @@ module('Acceptance | credential-libraries | update', function (hooks) {
     await visit(
       `${urls.credentialLibraries}/${instances.credentialLibrary.id}`,
     );
-    await click(BUTTON_SELECTOR, 'Activate edit mode');
-    await fillIn(NAME_INPUT_SELECTOR, 'name');
-    await fillIn(DESC_INPUT_SELECTOR, 'description');
-    await fillIn(VAULT_PATH_SELECTOR, 'path');
-    await fillIn('[name="username"]', 'username');
-    await select('[name="key_type"]', 'rsa');
-    await fillIn('[name="key_bits"]', 100);
-    await fillIn('[name="ttl"]', 'ttl');
-    await fillIn('[name="key_id"]', 'key_id');
+    await click(commonSelectors.EDIT_BTN, 'Activate edit mode');
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
     await fillIn(
-      '[name="critical_options"] tbody td:nth-of-type(1) input',
-      'co_key',
-    );
-    await fillIn(
-      '[name="critical_options"] tbody td:nth-of-type(2) input',
-      'co_value',
-    );
-    await click('[name="critical_options"] button');
-    await fillIn(
-      '[name="extensions"] tbody td:nth-of-type(1) input',
-      'ext_key',
-    );
-    await fillIn(
-      '[name="extensions"] tbody td:nth-of-type(2) input',
-      'ext_value',
+      commonSelectors.FIELD_DESCRIPTION,
+      commonSelectors.FIELD_DESCRIPTION_VALUE,
     );
+    await fillIn(selectors.FIELD_VAULT_PATH, selectors.FIELD_VAULT_PATH_VALUE);
+    await fillIn(selectors.FIELD_USERNAME, selectors.FIELD_USERNAME_VALUE);
+    await fillIn(selectors.FIELD_KEY_TYPE, selectors.FIELD_KEY_TYPE_VALUE);
+    await fillIn(selectors.FIELD_KEY_BITS, selectors.FIELD_KEY_BITS_VALUE);
+    await fillIn(selectors.FIELD_TTL, selectors.FIELD_TTL_VALUE);
+    await fillIn(selectors.FIELD_KEY_ID, selectors.FIELD_KEY_ID_VALUE);
+    await fillIn(selectors.FIELD_CRIT_OPTS_KEY, 'co_key');
+    await fillIn(selectors.FIELD_CRIT_OPTS_VALUE, 'co_value');
+    await click(selectors.FIELD_CRIT_OPTS_BTN);
+    await fillIn(selectors.FIELD_EXT_KEY, 'ext_key');
+    await fillIn(selectors.FIELD_EXT_VALUE, 'ext_value');
+    await click(selectors.FIELD_EXT_BTN);
+    await click(commonSelectors.SAVE_BTN);
 
-    await click('[name="extensions"] button');
-
-    await click(SAVE_BTN_SELECTOR);
     const credentialLibrary = this.server.schema.credentialLibraries.findBy({
       type: TYPE_CREDENTIAL_LIBRARY_VAULT_SSH_CERTIFICATE,
     });
-    assert.strictEqual(credentialLibrary.name, 'name');
-    assert.strictEqual(credentialLibrary.description, 'description');
-    assert.strictEqual(credentialLibrary.attributes.path, 'path');
-    assert.strictEqual(credentialLibrary.attributes.username, 'username');
-    assert.strictEqual(credentialLibrary.attributes.key_type, 'rsa');
-    assert.strictEqual(credentialLibrary.attributes.key_bits, 100);
-    assert.strictEqual(credentialLibrary.attributes.ttl, 'ttl');
-    assert.strictEqual(credentialLibrary.attributes.key_id, 'key_id');
+    assert.strictEqual(
+      credentialLibrary.name,
+      commonSelectors.FIELD_NAME_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.description,
+      commonSelectors.FIELD_DESCRIPTION_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.attributes.path,
+      selectors.FIELD_VAULT_PATH_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.attributes.username,
+      selectors.FIELD_USERNAME_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.attributes.key_type,
+      selectors.FIELD_KEY_TYPE_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.attributes.key_bits,
+      selectors.FIELD_KEY_BITS_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.attributes.ttl,
+      selectors.FIELD_TTL_VALUE,
+    );
+    assert.strictEqual(
+      credentialLibrary.attributes.key_id,
+      selectors.FIELD_KEY_ID_VALUE,
+    );
     assert.deepEqual(credentialLibrary.attributes.critical_options, {
       co_key: 'co_value',
     });