refactor: 💅 Aliases: create-test (#2685)

* refactor: 💡 Create aliases test suite

Refactor test suite for creating aliases

✅ Closes: ICU-15454

* use FIELD_TEXT_ERROR selector

* revert SAVE_BTN

* revert auth-method changes

* revert scopes changes

* revert scopes changes

* revert targets changes

* add FIELD prefix to const

* remove selector suffix

* revert read-test

* remove FIELD_TEXT_ERROR

* add data-test att to component

* fix merge conflict

ui/admin/app/components/form/alias/index.hbs

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

ui/admin/tests/acceptance/aliases/create-test.js

@@ -12,6 +12,7 @@ import { Response } from 'miragejs';
 import { authenticateSession } from 'ember-simple-auth/test-support';
 import { setupIndexedDb } from 'api/test-support/helpers/indexed-db';
 import * as commonSelectors from 'admin/tests/helpers/selectors';
+import * as selectors from './selectors';
 
 module('Acceptance | aliases | create', function (hooks) {
   setupApplicationTest(hooks);
@@ -21,14 +22,6 @@ module('Acceptance | aliases | create', function (hooks) {
   let features;
   let getAliasCount;
 
-  const SAVE_BTN_SELECTOR = '[type="submit"]';
-  const CANCEL_BTN_SELECTOR = '.rose-form-actions [type="button"]';
-  const NAME_FIELD_SELECTOR = '[name="name"]';
-  const DESTINATION_ID_SELECTOR = '[name="destination_id"]';
-  const HOST_ID_SELECTOR = '[name="authorize_session_arguments"]';
-  const FIELD_ERROR_TEXT_SELECTOR = '.hds-form-error__message';
-  const NAME_FIELD_TEXT = 'random string';
-
   const instances = {
     scopes: {
       global: null,
@@ -56,37 +49,37 @@ module('Acceptance | aliases | create', function (hooks) {
     const aliasCount = getAliasCount();
     await visit(urls.newAlias);
 
-    await fillIn(NAME_FIELD_SELECTOR, NAME_FIELD_TEXT);
-    await fillIn(DESTINATION_ID_SELECTOR, 'tcp_123');
-    await fillIn(HOST_ID_SELECTOR, 'h_123');
-    await click(SAVE_BTN_SELECTOR);
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
+    await fillIn(selectors.FIELD_DESTINATION_ID, 'tcp_123');
+    await fillIn(selectors.FIELD_HOST_ID, 'h_123');
+    await click(commonSelectors.SAVE_BTN);
     const alias = this.server.schema.aliases.findBy({
-      name: NAME_FIELD_TEXT,
+      name: commonSelectors.FIELD_NAME_VALUE,
     });
 
-    assert.strictEqual(alias.name, NAME_FIELD_TEXT);
+    assert.strictEqual(alias.name, commonSelectors.FIELD_NAME_VALUE);
     assert.strictEqual(getAliasCount(), aliasCount + 1);
   });
 
   test('users can create a new alias without host or target info', async function (assert) {
     const aliasCount = getAliasCount();
     await visit(urls.newAlias);
-    await fillIn(NAME_FIELD_SELECTOR, NAME_FIELD_TEXT);
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
 
-    await click(SAVE_BTN_SELECTOR);
+    await click(commonSelectors.SAVE_BTN);
     const alias = this.server.schema.aliases.findBy({
-      name: NAME_FIELD_TEXT,
+      name: commonSelectors.FIELD_NAME_VALUE,
     });
 
-    assert.strictEqual(alias.name, NAME_FIELD_TEXT);
+    assert.strictEqual(alias.name, commonSelectors.FIELD_NAME_VALUE);
     assert.strictEqual(getAliasCount(), aliasCount + 1);
   });
 
   test('user can cancel new alias creation', async function (assert) {
     const aliasCount = getAliasCount();
     await visit(urls.newAlias);
-    await fillIn(NAME_FIELD_SELECTOR, NAME_FIELD_TEXT);
-    await click(CANCEL_BTN_SELECTOR);
+    await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
+    await click(commonSelectors.CANCEL_BTN);
 
     assert.strictEqual(currentURL(), urls.aliases);
     assert.strictEqual(getAliasCount(), aliasCount);
@@ -113,13 +106,13 @@ module('Acceptance | aliases | create', function (hooks) {
       );
     });
     await visit(urls.newAlias);
-    await click(SAVE_BTN_SELECTOR);
+    await click(commonSelectors.SAVE_BTN);
     await a11yAudit();
 
     assert
       .dom(commonSelectors.ALERT_TOAST_BODY)
       .hasText('The request was invalid.');
-    assert.dom(FIELD_ERROR_TEXT_SELECTOR).hasText('Name is required.');
+    assert.dom(commonSelectors.FIELD_NAME_ERROR).hasText('Name is required.');
   });
 
   test('can navigate to new aliases route with proper authorization', async function (assert) {
@@ -131,7 +124,7 @@ module('Acceptance | aliases | create', function (hooks) {
       ),
     );
 
-    assert.dom(`[href="${urls.newAlias}"]`).isVisible();
+    assert.dom(commonSelectors.HREF(urls.newAlias)).isVisible();
   });
 
   test('users cannot directly navigate to new alias route without proper authorization', async function (assert) {

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

@@ -0,0 +1,7 @@
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: BUSL-1.1
+ */
+
+export const FIELD_DESTINATION_ID = '[name="destination_id"]';
+export const FIELD_HOST_ID = '[name="authorize_session_arguments"]';