before: addItems was basically just an alias for disable, now: addItems controls if user can add choices/items

This commit is contained in:
alex 2020-04-16 13:45:18 +02:00
parent cf34edd0ad
commit 36a5a0bd67
4 changed files with 28 additions and 12 deletions

View file

@ -304,10 +304,28 @@ describe('Choices - text element', () => {
});
describe('adding items disabled', () => {
it('does not allow me to input data', () => {
cy.get('[data-test-hook=adding-items-disabled]')
/*
{
addItems: false,
}
*/
beforeEach(() => {
cy.get('[data-test-hook=add-items-disabled]')
.find('.choices')
.click();
});
it('disables adding new items', () => {
const newChoice = 'New Choice';
cy.get('[data-test-hook=add-items-disabled]')
.find('.choices__input--cloned')
.should('be.disabled');
.type(newChoice)
.type('{enter}');
cy.get('[data-test-hook=add-items-disabled]')
.find('.choices__list--multiple')
.last()
.should($el => {
expect($el).to.not.contain(newChoice);
});
});
});

View file

@ -105,11 +105,11 @@
/>
</div>
<div data-test-hook="adding-items-disabled">
<label for="choices-adding-items-disabled">Add items disabled</label>
<div data-test-hook="add-items-disabled">
<label for="choices-add-items-disabled">Add items disabled</label>
<input
class="form-control"
id="choices-adding-items-disabled"
id="choices-add-items-disabled"
type="text"
/>
</div>

View file

@ -347,10 +347,7 @@ class Choices implements Choices {
this._render();
this._addEventListeners();
let shouldDisable = this.passedElement.element.hasAttribute('disabled');
if (this._isTextElement) {
shouldDisable = shouldDisable || !this.config.addItems;
}
const shouldDisable = this.passedElement.element.hasAttribute('disabled');
if (shouldDisable) {
this.disable();
@ -1562,7 +1559,8 @@ class Choices implements Choices {
// We are typing into a text input and have a value, we want to show a dropdown
// notice. Otherwise hide the dropdown
if (this._isTextElement) {
const canShowDropdownNotice = canAddItem.notice && value;
const canShowDropdownNotice =
this.config.addItems && canAddItem.notice && value;
if (canShowDropdownNotice) {
const dropdownItem = this._getTemplate('notice', canAddItem.notice);

View file

@ -103,7 +103,7 @@ export interface Options {
maxItemCount: number;
/**
* Whether a user can add items.
* Whether a user can add new items.
*
* **Input types affected:** text, select, select-multiple
*