UI: sets operationNone for a kmip role if no checkboxes are selected (#19139)

* fix operationNon not being set on save

* add changelog

* fix overriding operationAll

* remove mirage file
This commit is contained in:
claire bontempo 2023-02-10 13:38:31 -08:00 committed by GitHub
parent 14adb3b825
commit 0860961223
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 60 additions and 6 deletions

3
changelog/19139.txt Normal file
View File

@ -0,0 +1,3 @@
```release-note:bug
ui: fixes bug in kmip role form that caused `operation_all` to persist after deselecting all operation checkboxes
```

View File

@ -58,7 +58,7 @@ const ModelExport = Model.extend(COMPUTEDS, {
]; ];
const attributes = ['operationAddAttribute', 'operationGetAttributes']; const attributes = ['operationAddAttribute', 'operationGetAttributes'];
const server = ['operationDiscoverVersion']; const server = ['operationDiscoverVersions'];
const others = this.operationFieldsWithoutSpecial const others = this.operationFieldsWithoutSpecial
.slice() .slice()
.removeObjects(objects.concat(attributes, server)); .removeObjects(objects.concat(attributes, server));

View File

@ -40,6 +40,11 @@ export default EditForm.extend({
if (model.operationAll || model.operationNone) { if (model.operationAll || model.operationNone) {
model.operationFieldsWithoutSpecial.forEach((field) => model.set(field, null)); model.operationFieldsWithoutSpecial.forEach((field) => model.set(field, null));
} }
// set operationNone if user unchecks 'operationAll' instead of toggling the 'operationNone' input
// doing here instead of on the 'operationNone' input because a user might deselect all, then reselect some options
// and immediately setting operationNone will hide all of the checkboxes in the UI
this.model.operationNone =
model.operationFieldsWithoutSpecial.every((attr) => !model[attr]) && !this.model.operationAll;
}, },
}, },
}); });

View File

@ -68,35 +68,81 @@ module('Integration | Component | edit form kmip role', function (hooks) {
}); });
test('it renders: new model', async function (assert) { test('it renders: new model', async function (assert) {
assert.expect(3);
const model = createModel({ isNew: true }); const model = createModel({ isNew: true });
this.set('model', model); this.set('model', model);
await render(hbs`<EditFormKmipRole @model={{this.model}} />`, this.context); this.onSave = ({ model }) => {
assert.false(model.operationNone, 'callback fires with operationNone as false');
assert.true(model.operationAll, 'callback fires with operationAll as true');
};
await render(hbs`<EditFormKmipRole @model={{this.model}} @onSave={{this.onSave}} />`, this.context);
assert.dom('[data-test-input="operationAll"]').isChecked('sets operationAll'); assert.dom('[data-test-input="operationAll"]').isChecked('sets operationAll');
await click('[data-test-edit-form-submit]');
}); });
test('it renders: operationAll', async function (assert) { test('it renders: operationAll', async function (assert) {
assert.expect(3);
const model = createModel({ operationAll: true }); const model = createModel({ operationAll: true });
this.set('model', model); this.set('model', model);
await render(hbs`<EditFormKmipRole @model={{this.model}} />`, this.context); this.onSave = ({ model }) => {
assert.false(model.operationNone, 'callback fires with operationNone as false');
assert.true(model.operationAll, 'callback fires with operationAll as true');
};
await render(hbs`<EditFormKmipRole @model={{this.model}} @onSave={{this.onSave}} />`, this.context);
assert.dom('[data-test-input="operationAll"]').isChecked('sets operationAll'); assert.dom('[data-test-input="operationAll"]').isChecked('sets operationAll');
await click('[data-test-edit-form-submit]');
}); });
test('it renders: operationNone', async function (assert) { test('it renders: operationNone', async function (assert) {
const model = createModel({ operationNone: true }); assert.expect(2);
const model = createModel({ operationNone: true, operationAll: undefined });
this.set('model', model); this.set('model', model);
await render(hbs`<EditFormKmipRole @model={{this.model}} />`, this.context);
this.onSave = ({ model }) => {
assert.true(model.operationNone, 'callback fires with operationNone as true');
};
await render(hbs`<EditFormKmipRole @model={{this.model}} @onSave={{this.onSave}} />`, this.context);
assert.dom('[data-test-input="operationNone"]').isNotChecked('sets operationNone'); assert.dom('[data-test-input="operationNone"]').isNotChecked('sets operationNone');
await click('[data-test-edit-form-submit]');
}); });
test('it renders: choose operations', async function (assert) { test('it renders: choose operations', async function (assert) {
assert.expect(3);
const model = createModel({ operationGet: true }); const model = createModel({ operationGet: true });
this.set('model', model); this.set('model', model);
await render(hbs`<EditFormKmipRole @model={{this.model}} />`, this.context); this.onSave = ({ model }) => {
assert.false(model.operationNone, 'callback fires with operationNone as false');
};
await render(hbs`<EditFormKmipRole @model={{this.model}} @onSave={{this.onSave}} />`, this.context);
assert.dom('[data-test-input="operationNone"]').isChecked('sets operationNone'); assert.dom('[data-test-input="operationNone"]').isChecked('sets operationNone');
assert.dom('[data-test-input="operationAll"]').isNotChecked('sets operationAll'); assert.dom('[data-test-input="operationAll"]').isNotChecked('sets operationAll');
await click('[data-test-edit-form-submit]');
});
test('it saves operationNone=true when unchecking operationAll box', async function (assert) {
assert.expect(15);
const model = createModel({ isNew: true });
this.set('model', model);
this.onSave = ({ model }) => {
assert.true(model.operationNone, 'callback fires with operationNone as true');
assert.false(model.operationAll, 'callback fires with operationAll as false');
};
await render(hbs`<EditFormKmipRole @model={{this.model}} @onSave={{this.onSave}} />`, this.context);
await click('[data-test-input="operationAll"]');
for (const field of model.fields) {
const { name } = field;
if (name === 'operationNone') continue;
assert.dom(`[data-test-input="${name}"]`).isNotChecked(`${name} is unchecked`);
}
assert.dom('[data-test-input="operationAll"]').isNotChecked('sets operationAll');
assert
.dom('[data-test-input="operationNone"]')
.isChecked('operationNone toggle is true which means allow operations');
await click('[data-test-edit-form-submit]');
}); });
const savingTests = [ const savingTests = [