Files
threshold-ui/ui/admin/tests/acceptance/storage-buckets/update-test.js
T
d469f305de Replace Rose::CodeEditor with Hds::CodeEditor (#2679)
* chore: 🤖 replace Rose::CodeEditor with Hds::CodeEditor

- Remove CodeEditor 5 dependency

* chore: 🤖 Replace CodeMirror5 dep

remove CodeMirror5 and replace existing editors with HDS::CodeEditor

* chore: 🤖 deleting old codeeditor styles

* feat: 🎸 changing code editor

changing code editor

✅ Closes: 0

* removed unused export

* pr cleanup

* updating tests for new code editor

* responding to PR feedback

* added whitespace

* fixing linting violations

* chore: 🤖 self-review PR

self-review PR in the course of switching to new HDS code editor

* fix: 🐛 fix linting bug

* fix: 🐛 unneeded dependency

remove jslint dependency as this is handled in the new code editor from
HDS

* fix: 🐛 Fixing import bug

Fix import bug caused by importing scss modules that no longer exist

* Fix and refactor code editor acceptance test

* Fix and refactor code editor acceptance test

* chore: 🤖 remove codemirror dependency

* refactor: 💡 fix merge conflict issues

* test: 💍 update e2e test selectors

* test: 💍 fix target spec click event

* refactor: 💡 clean up test selectors for code editor

* refactor: 💡 clean up storage bucket test selectors

* chore: 🤖 remove code mirror modifiers

---------

Co-authored-by: calcaide <ccorvo@hashicorp.com>
Co-authored-by: cameronperera <cameron.perera@hashicorp.com>
2026-05-14 15:21:27 -04:00

353 lines
12 KiB
JavaScript

/**
* Copyright IBM Corp. 2021, 2026
* SPDX-License-Identifier: BUSL-1.1
*/
import { module, test } from 'qunit';
import { visit, click, fillIn, find, waitFor } from '@ember/test-helpers';
import { setupApplicationTest } from 'admin/tests/helpers';
import { setupSqlite } from 'api/test-support/helpers/sqlite';
import { Response } from 'miragejs';
import * as selectors from './selectors';
import * as commonSelectors from 'admin/tests/helpers/selectors';
import { setRunOptions } from 'ember-a11y-testing/test-support';
module('Acceptance | storage-buckets | update', function (hooks) {
setupApplicationTest(hooks);
setupSqlite(hooks);
let features;
const instances = {
scopes: {
global: null,
},
storageBucket: null,
storageBucketMinio: null,
};
const urls = {
storageBuckets: null,
storageBucket: null,
storageBucketMinio: null,
};
hooks.beforeEach(async function () {
instances.scopes.global = this.server.schema.scopes.find('global');
instances.storageBucket = this.server.create('storage-bucket', {
scope: instances.scopes.global,
});
instances.storageBucketMinio = this.server.create('storage-bucket', {
scope: instances.scopes.global,
plugin: { name: 'minio' },
});
urls.storageBuckets = `/scopes/global/storage-buckets`;
urls.storageBucket = `${urls.storageBuckets}/${instances.storageBucket.id}`;
urls.storageBucketMinio = `${urls.storageBuckets}/${instances.storageBucketMinio.id}`;
features = this.owner.lookup('service:features');
features.enable('ssh-session-recording');
});
test('can save changes to an existing storage-bucket', async function (assert) {
setRunOptions({
rules: {
'color-contrast': {
// [ember-a11y-ignore]: axe rule "color-contrast" automatically ignored on 2025-08-01
enabled: false,
},
label: {
// [ember-a11y-ignore]: axe rule "label" automatically ignored on 2025-08-01
enabled: false,
},
},
});
await visit(urls.storageBuckets);
await click(commonSelectors.HREF(urls.storageBucket));
await click(commonSelectors.EDIT_BTN, 'Click edit mode');
await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
await click(commonSelectors.SAVE_BTN, 'Click save');
assert.dom(commonSelectors.HREF(urls.storageBucket)).isVisible();
assert
.dom(commonSelectors.FIELD_NAME)
.hasValue(commonSelectors.FIELD_NAME_VALUE);
assert.strictEqual(
instances.storageBucket.name,
commonSelectors.FIELD_NAME_VALUE,
);
});
test('can cancel changes to an existing storage-bucket', async function (assert) {
setRunOptions({
rules: {
'color-contrast': {
// [ember-a11y-ignore]: axe rule "color-contrast" automatically ignored on 2025-08-01
enabled: false,
},
label: {
// [ember-a11y-ignore]: axe rule "label" automatically ignored on 2025-08-01
enabled: false,
},
},
});
const name = instances.storageBucket.name;
await visit(urls.storageBuckets);
await click(commonSelectors.HREF(urls.storageBucket));
await click(commonSelectors.EDIT_BTN, 'Click edit mode');
await fillIn(commonSelectors.FIELD_NAME, commonSelectors.FIELD_NAME_VALUE);
await click(commonSelectors.CANCEL_BTN, 'Click cancel');
assert.dom(commonSelectors.FIELD_NAME).hasValue(`${name}`);
assert.strictEqual(instances.storageBucket.name, name);
});
test('can save changes to access key fields', async function (assert) {
setRunOptions({
rules: {
'color-contrast': {
// [ember-a11y-ignore]: axe rule "color-contrast" automatically ignored on 2025-08-01
enabled: false,
},
label: {
// [ember-a11y-ignore]: axe rule "label" automatically ignored on 2025-08-01
enabled: false,
},
},
});
await visit(urls.storageBuckets);
await click(commonSelectors.HREF(urls.storageBucket));
assert.dom(selectors.FIELD_ACCESS_KEY_EDIT_BTN).exists();
assert.dom(selectors.FIELD_SECRET_KEY_EDIT_BTN).exists();
assert.dom(selectors.FIELD_ACCESS_KEY_EDIT_BTN).isDisabled();
assert.dom(selectors.FIELD_SECRET_KEY_EDIT_BTN).isDisabled();
await click(commonSelectors.EDIT_BTN, 'Click edit mode');
assert.dom(selectors.FIELD_ACCESS_KEY_EDIT_BTN).isEnabled();
assert.dom(selectors.FIELD_SECRET_KEY_EDIT_BTN).isEnabled();
assert.dom(selectors.FIELD_ACCESS_KEY_EDIT_BTN).hasText('Edit');
assert.dom(selectors.FIELD_SECRET_KEY_EDIT_BTN).hasText('Edit');
await click(selectors.FIELD_ACCESS_KEY_EDIT_BTN);
assert.dom(selectors.FIELD_ACCESS_KEY_EDIT_BTN).hasText('Cancel');
await click(selectors.FIELD_SECRET_KEY_EDIT_BTN);
assert.dom(selectors.FIELD_SECRET_KEY_EDIT_BTN).hasText('Cancel');
await fillIn(selectors.FIELD_ACCESS_KEY, selectors.FIELD_ACCESS_KEY_VALUE);
await fillIn(selectors.FIELD_SECRET_KEY, selectors.FIELD_SECRET_KEY_VALUE);
await click(commonSelectors.SAVE_BTN, 'Click save');
assert.dom(selectors.FIELD_ACCESS_KEY_EDIT_BTN).isDisabled();
assert.dom(selectors.FIELD_SECRET_KEY_EDIT_BTN).isDisabled();
assert.dom(selectors.FIELD_ACCESS_KEY).hasNoValue();
assert.dom(selectors.FIELD_SECRET_KEY).hasNoValue();
});
test('can cancel changes to access key fields', async function (assert) {
setRunOptions({
rules: {
'color-contrast': {
// [ember-a11y-ignore]: axe rule "color-contrast" automatically ignored on 2025-08-01
enabled: false,
},
label: {
// [ember-a11y-ignore]: axe rule "label" automatically ignored on 2025-08-01
enabled: false,
},
},
});
await visit(urls.storageBuckets);
await click(commonSelectors.HREF(urls.storageBucket));
await click(commonSelectors.EDIT_BTN, 'Click edit mode');
await click(selectors.FIELD_ACCESS_KEY_EDIT_BTN);
await click(selectors.FIELD_SECRET_KEY_EDIT_BTN);
await fillIn(selectors.FIELD_ACCESS_KEY, selectors.FIELD_ACCESS_KEY_VALUE);
await fillIn(selectors.FIELD_SECRET_KEY, selectors.FIELD_SECRET_KEY_VALUE);
await click(selectors.FIELD_ACCESS_KEY_EDIT_BTN, 'Click cancel button');
await click(selectors.FIELD_SECRET_KEY_EDIT_BTN, 'Click cancel button');
await click(commonSelectors.SAVE_BTN, 'Click save');
assert.dom(selectors.FIELD_ACCESS_KEY_EDIT_BTN).isDisabled();
assert.dom(selectors.FIELD_SECRET_KEY_EDIT_BTN).isDisabled();
assert.dom(selectors.FIELD_ACCESS_KEY).hasNoValue();
assert.dom(selectors.FIELD_SECRET_KEY).hasNoValue();
});
test('saving an existing storage-bucket with invalid fields will display error messages', async function (assert) {
setRunOptions({
rules: {
'color-contrast': {
// [ember-a11y-ignore]: axe rule "color-contrast" automatically ignored on 2025-08-01
enabled: false,
},
label: {
// [ember-a11y-ignore]: axe rule "label" automatically ignored on 2025-08-01
enabled: false,
},
},
});
await visit(urls.storageBuckets);
this.server.patch('/storage-buckets/:id', () => {
return new Response(
400,
{},
{
status: 400,
code: 'invalid_argument',
message: 'The request was invalid.',
details: {
request_fields: [
{
name: 'bucket_name',
description: 'This is a required field.',
},
{
name: 'worker_filter',
description: 'Worker filter is required.',
},
],
},
},
);
});
await click(commonSelectors.HREF(urls.storageBucket));
await click(commonSelectors.EDIT_BTN, 'Activate edit mode');
await waitFor(commonSelectors.CODE_EDITOR_CM);
const editorElement = find(commonSelectors.CODE_EDITOR_CODE);
const editorView = editorElement.editor;
editorView.dispatch({
changes: {
from: editorView.state.selection.main.from,
insert: '"dev" in "/tags/env"',
},
});
await click(commonSelectors.SAVE_BTN);
assert
.dom(commonSelectors.ALERT_TOAST_BODY)
.hasText('The request was invalid.');
assert
.dom(selectors.FIELD_BUCKET_NAME_ERROR)
.hasText('This is a required field.');
assert
.dom(selectors.FIELD_WORKER_FILTER_ERROR)
.hasText('Worker filter is required.');
});
test('user cannot edit scope, provider, bucket name, bucket prefix and region fields in a Amazon S3 storage bucket form', async function (assert) {
setRunOptions({
rules: {
'color-contrast': {
// [ember-a11y-ignore]: axe rule "color-contrast" automatically ignored on 2025-08-01
enabled: false,
},
label: {
// [ember-a11y-ignore]: axe rule "label" automatically ignored on 2025-08-01
enabled: false,
},
},
});
await visit(urls.storageBuckets);
await click(commonSelectors.HREF(urls.storageBucket));
assert.dom(selectors.FIELD_BUCKET_NAME).isDisabled();
assert.dom(selectors.FIELD_BUCKET_PREFIX).isDisabled();
await click(commonSelectors.EDIT_BTN, 'Click edit mode');
assert.dom(selectors.FIELD_SCOPE).doesNotExist();
assert.dom(selectors.FIELD_PLUGIN_TYPE).isDisabled();
assert.dom(selectors.FIELD_BUCKET_NAME).hasAttribute('readOnly');
assert.dom(selectors.FIELD_BUCKET_PREFIX).hasAttribute('readOnly');
assert.dom(selectors.FIELD_REGION).hasAttribute('readOnly');
assert.dom(selectors.FIELD_BUCKET_NAME).isNotDisabled();
assert.dom(selectors.FIELD_BUCKET_PREFIX).isNotDisabled();
assert.dom(selectors.FIELD_REGION).isNotDisabled();
});
test('user cannot edit scope, provider, endpoint_url, bucket name or region fields in a MinIO storage bucket', async function (assert) {
setRunOptions({
rules: {
'color-contrast': {
// [ember-a11y-ignore]: axe rule "color-contrast" automatically ignored on 2025-08-01
enabled: false,
},
label: {
// [ember-a11y-ignore]: axe rule "label" automatically ignored on 2025-08-01
enabled: false,
},
},
});
await visit(urls.storageBuckets);
await click(commonSelectors.HREF(urls.storageBucketMinio));
assert.dom(selectors.FIELD_BUCKET_NAME).isDisabled();
await click(commonSelectors.EDIT_BTN, 'Click edit mode');
assert.dom(selectors.FIELD_SCOPE).doesNotExist();
assert.dom(selectors.FIELD_PLUGIN_TYPE).isDisabled();
assert.dom(selectors.FIELD_ENDPOINT_URL).isNotDisabled();
assert.dom(selectors.FIELD_BUCKET_NAME).hasAttribute('readOnly');
assert.dom(selectors.FIELD_REGION).hasAttribute('readOnly');
});
test('user sees an editable code editor while updating and readonly code block before/after', async function (assert) {
setRunOptions({
rules: {
'color-contrast': {
// [ember-a11y-ignore]: axe rule "color-contrast" automatically ignored on 2025-08-01
enabled: false,
},
label: {
// [ember-a11y-ignore]: axe rule "label" automatically ignored on 2025-08-01
enabled: false,
},
},
});
await visit(urls.storageBuckets);
await click(commonSelectors.HREF(urls.storageBucketMinio));
assert.dom(selectors.READONLY_WORKER_FILTER).isVisible();
assert.dom(commonSelectors.CODE_EDITOR_CODE).doesNotExist();
await click(commonSelectors.EDIT_BTN, 'Click edit mode');
assert.dom(commonSelectors.CODE_EDITOR_CODE).isVisible();
assert.dom(selectors.READONLY_WORKER_FILTER).doesNotExist();
});
});