mirror of
https://github.com/Choices-js/Choices.git
synced 2024-06-01 21:42:30 +02:00
Make event handlers private
This commit is contained in:
parent
b3956db628
commit
8f67de4844
|
@ -344,10 +344,6 @@ class Choices {
|
||||||
* @public
|
* @public
|
||||||
*/
|
*/
|
||||||
removeActiveItemsByValue(value) {
|
removeActiveItemsByValue(value) {
|
||||||
if (!value) {
|
|
||||||
return this;
|
|
||||||
}
|
|
||||||
|
|
||||||
this._store.activeItems
|
this._store.activeItems
|
||||||
.filter(item => item.value === value)
|
.filter(item => item.value === value)
|
||||||
.forEach(item => this._removeItem(item));
|
.forEach(item => this._removeItem(item));
|
||||||
|
@ -448,7 +444,7 @@ class Choices {
|
||||||
if (this.dropdown.isActive) {
|
if (this.dropdown.isActive) {
|
||||||
this.hideDropdown();
|
this.hideDropdown();
|
||||||
} else {
|
} else {
|
||||||
this.showDropdown(true);
|
this.showDropdown(true); // code smell 🤢
|
||||||
}
|
}
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
|
@ -462,13 +458,12 @@ class Choices {
|
||||||
* @public
|
* @public
|
||||||
*/
|
*/
|
||||||
getValue(valueOnly = false) {
|
getValue(valueOnly = false) {
|
||||||
const items = this._store.activeItems;
|
const values = this._store.activeItems
|
||||||
|
.reduce((selectedItems, item) => {
|
||||||
const values = items.reduce((selectedItems, item) => {
|
const itemValue = valueOnly ? item.value : item;
|
||||||
const itemValue = valueOnly ? item.value : item;
|
selectedItems.push(itemValue);
|
||||||
selectedItems.push(itemValue);
|
return selectedItems;
|
||||||
return selectedItems;
|
}, []);
|
||||||
}, []);
|
|
||||||
|
|
||||||
return this._isSelectOneElement ? values[0] : values;
|
return this._isSelectOneElement ? values[0] : values;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1204,51 +1204,41 @@ describe('choices', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('removeActiveItemsByValue', () => {
|
describe('removeActiveItemsByValue', () => {
|
||||||
describe('passing invalid value', () => {
|
let activeItemsStub;
|
||||||
beforeEach(() => {
|
let removeItemStub;
|
||||||
output = instance.removeActiveItemsByValue(null);
|
const value = 'Removed';
|
||||||
});
|
const items = [
|
||||||
|
{
|
||||||
|
id: '1',
|
||||||
|
value: 'Not removed',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
value: 'Removed',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3',
|
||||||
|
value: 'Removed',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
returnsInstance(output);
|
beforeEach(() => {
|
||||||
|
removeItemStub = stub();
|
||||||
|
activeItemsStub = stub(instance._store, 'activeItems').get(() => items);
|
||||||
|
instance._removeItem = removeItemStub;
|
||||||
|
|
||||||
|
output = instance.removeActiveItemsByValue(value);
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('passing valid value', () => {
|
afterEach(() => {
|
||||||
let activeItemsStub;
|
activeItemsStub.reset();
|
||||||
let removeItemStub;
|
instance._removeItem.reset();
|
||||||
const value = 'Removed';
|
});
|
||||||
const items = [
|
|
||||||
{
|
|
||||||
id: '1',
|
|
||||||
value: 'Not removed',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: '2',
|
|
||||||
value: 'Removed',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: '3',
|
|
||||||
value: 'Removed',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
beforeEach(() => {
|
it('removes each active item in store with matching value', () => {
|
||||||
removeItemStub = stub();
|
expect(removeItemStub.callCount).to.equal(2);
|
||||||
activeItemsStub = stub(instance._store, 'activeItems').get(() => items);
|
expect(removeItemStub.firstCall.args[0]).to.equal(items[1]);
|
||||||
instance._removeItem = removeItemStub;
|
expect(removeItemStub.secondCall.args[0]).to.equal(items[2]);
|
||||||
|
|
||||||
output = instance.removeActiveItemsByValue(value);
|
|
||||||
});
|
|
||||||
|
|
||||||
afterEach(() => {
|
|
||||||
activeItemsStub.reset();
|
|
||||||
instance._removeItem.reset();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('removes each active item in store with matching value', () => {
|
|
||||||
expect(removeItemStub.callCount).to.equal(2);
|
|
||||||
expect(removeItemStub.firstCall.args[0]).to.equal(items[1]);
|
|
||||||
expect(removeItemStub.secondCall.args[0]).to.equal(items[2]);
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -10,16 +10,16 @@ export default class Container {
|
||||||
this.isDisabled = false;
|
this.isDisabled = false;
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
|
|
||||||
this.onFocus = this.onFocus.bind(this);
|
this._onFocus = this._onFocus.bind(this);
|
||||||
this.onBlur = this.onBlur.bind(this);
|
this._onBlur = this._onBlur.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Add event listeners
|
* Add event listeners
|
||||||
*/
|
*/
|
||||||
addEventListeners() {
|
addEventListeners() {
|
||||||
this.element.addEventListener('focus', this.onFocus);
|
this.element.addEventListener('focus', this._onFocus);
|
||||||
this.element.addEventListener('blur', this.onBlur);
|
this.element.addEventListener('blur', this._onBlur);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -28,22 +28,8 @@ export default class Container {
|
||||||
|
|
||||||
/** */
|
/** */
|
||||||
removeEventListeners() {
|
removeEventListeners() {
|
||||||
this.element.removeEventListener('focus', this.onFocus);
|
this.element.removeEventListener('focus', this._onFocus);
|
||||||
this.element.removeEventListener('blur', this.onBlur);
|
this.element.removeEventListener('blur', this._onBlur);
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Set focussed state
|
|
||||||
*/
|
|
||||||
onFocus() {
|
|
||||||
this.isFocussed = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Remove blurred state
|
|
||||||
*/
|
|
||||||
onBlur() {
|
|
||||||
this.isFocussed = false;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -177,4 +163,18 @@ export default class Container {
|
||||||
this.element.removeAttribute('aria-busy');
|
this.element.removeAttribute('aria-busy');
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set focussed state
|
||||||
|
*/
|
||||||
|
_onFocus() {
|
||||||
|
this.isFocussed = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove blurred state
|
||||||
|
*/
|
||||||
|
_onBlur() {
|
||||||
|
this.isFocussed = false;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -77,7 +77,7 @@ describe('components/container', () => {
|
||||||
describe('onFocus', () => {
|
describe('onFocus', () => {
|
||||||
it('sets isFocussed flag to true', () => {
|
it('sets isFocussed flag to true', () => {
|
||||||
expect(instance.isFocussed).to.equal(false);
|
expect(instance.isFocussed).to.equal(false);
|
||||||
instance.onFocus();
|
instance._onFocus();
|
||||||
expect(instance.isFocussed).to.equal(true);
|
expect(instance.isFocussed).to.equal(true);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -85,7 +85,7 @@ describe('components/container', () => {
|
||||||
describe('onBlur', () => {
|
describe('onBlur', () => {
|
||||||
it('sets isFocussed flag to false', () => {
|
it('sets isFocussed flag to false', () => {
|
||||||
instance.isFocussed = true;
|
instance.isFocussed = true;
|
||||||
instance.onBlur();
|
instance._onBlur();
|
||||||
expect(instance.isFocussed).to.equal(false);
|
expect(instance.isFocussed).to.equal(false);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -10,10 +10,10 @@ export default class Input {
|
||||||
this.isDisabled = false;
|
this.isDisabled = false;
|
||||||
|
|
||||||
// Bind event listeners
|
// Bind event listeners
|
||||||
this.onPaste = this.onPaste.bind(this);
|
this._onPaste = this._onPaste.bind(this);
|
||||||
this.onInput = this.onInput.bind(this);
|
this._onInput = this._onInput.bind(this);
|
||||||
this.onFocus = this.onFocus.bind(this);
|
this._onFocus = this._onFocus.bind(this);
|
||||||
this.onBlur = this.onBlur.bind(this);
|
this._onBlur = this._onBlur.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
set placeholder(placeholder) {
|
set placeholder(placeholder) {
|
||||||
|
@ -29,49 +29,17 @@ export default class Input {
|
||||||
}
|
}
|
||||||
|
|
||||||
addEventListeners() {
|
addEventListeners() {
|
||||||
this.element.addEventListener('input', this.onInput);
|
this.element.addEventListener('input', this._onInput);
|
||||||
this.element.addEventListener('paste', this.onPaste);
|
this.element.addEventListener('paste', this._onPaste);
|
||||||
this.element.addEventListener('focus', this.onFocus);
|
this.element.addEventListener('focus', this._onFocus);
|
||||||
this.element.addEventListener('blur', this.onBlur);
|
this.element.addEventListener('blur', this._onBlur);
|
||||||
}
|
}
|
||||||
|
|
||||||
removeEventListeners() {
|
removeEventListeners() {
|
||||||
this.element.removeEventListener('input', this.onInput);
|
this.element.removeEventListener('input', this._onInput);
|
||||||
this.element.removeEventListener('paste', this.onPaste);
|
this.element.removeEventListener('paste', this._onPaste);
|
||||||
this.element.removeEventListener('focus', this.onFocus);
|
this.element.removeEventListener('focus', this._onFocus);
|
||||||
this.element.removeEventListener('blur', this.onBlur);
|
this.element.removeEventListener('blur', this._onBlur);
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Input event
|
|
||||||
* @return
|
|
||||||
* @private
|
|
||||||
*/
|
|
||||||
onInput() {
|
|
||||||
if (this.type !== 'select-one') {
|
|
||||||
this.setWidth();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Paste event
|
|
||||||
* @param {Object} e Event
|
|
||||||
* @return
|
|
||||||
* @private
|
|
||||||
*/
|
|
||||||
onPaste(e) {
|
|
||||||
// Disable pasting into the input if option has been set
|
|
||||||
if (e.target === this.element && this.preventPaste) {
|
|
||||||
e.preventDefault();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onFocus() {
|
|
||||||
this.isFocussed = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
onBlur() {
|
|
||||||
this.isFocussed = false;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
enable() {
|
enable() {
|
||||||
|
@ -146,4 +114,36 @@ export default class Input {
|
||||||
removeActiveDescendant() {
|
removeActiveDescendant() {
|
||||||
this.element.removeAttribute('aria-activedescendant');
|
this.element.removeAttribute('aria-activedescendant');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Input event
|
||||||
|
* @return
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
_onInput() {
|
||||||
|
if (this.type !== 'select-one') {
|
||||||
|
this.setWidth();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Paste event
|
||||||
|
* @param {Object} e Event
|
||||||
|
* @return
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
_onPaste(e) {
|
||||||
|
// Disable pasting into the input if option has been set
|
||||||
|
if (e.target === this.element && this.preventPaste) {
|
||||||
|
e.preventDefault();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
_onFocus() {
|
||||||
|
this.isFocussed = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
_onBlur() {
|
||||||
|
this.isFocussed = false;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -90,7 +90,7 @@ describe('components/input', () => {
|
||||||
describe('when element is select one', () => {
|
describe('when element is select one', () => {
|
||||||
it('does not set input width', () => {
|
it('does not set input width', () => {
|
||||||
instance.type = 'select-one';
|
instance.type = 'select-one';
|
||||||
instance.onInput();
|
instance._onInput();
|
||||||
expect(setWidthStub.callCount).to.equal(0);
|
expect(setWidthStub.callCount).to.equal(0);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -98,7 +98,7 @@ describe('components/input', () => {
|
||||||
describe('when element is not a select one', () => {
|
describe('when element is not a select one', () => {
|
||||||
it('sets input width', () => {
|
it('sets input width', () => {
|
||||||
instance.type = 'text';
|
instance.type = 'text';
|
||||||
instance.onInput();
|
instance._onInput();
|
||||||
expect(setWidthStub.callCount).to.equal(1);
|
expect(setWidthStub.callCount).to.equal(1);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -117,7 +117,7 @@ describe('components/input', () => {
|
||||||
describe('when pasting is disabled and target is the element', () => {
|
describe('when pasting is disabled and target is the element', () => {
|
||||||
it('prevents default pasting behaviour', () => {
|
it('prevents default pasting behaviour', () => {
|
||||||
instance.preventPaste = true;
|
instance.preventPaste = true;
|
||||||
instance.onPaste(eventMock);
|
instance._onPaste(eventMock);
|
||||||
expect(eventMock.preventDefault.callCount).to.equal(1);
|
expect(eventMock.preventDefault.callCount).to.equal(1);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -125,7 +125,7 @@ describe('components/input', () => {
|
||||||
describe('when pasting is enabled', () => {
|
describe('when pasting is enabled', () => {
|
||||||
it('does not prevent default pasting behaviour', () => {
|
it('does not prevent default pasting behaviour', () => {
|
||||||
instance.preventPaste = false;
|
instance.preventPaste = false;
|
||||||
instance.onPaste(eventMock);
|
instance._onPaste(eventMock);
|
||||||
expect(eventMock.preventDefault.callCount).to.equal(0);
|
expect(eventMock.preventDefault.callCount).to.equal(0);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -134,7 +134,7 @@ describe('components/input', () => {
|
||||||
describe('onFocus', () => {
|
describe('onFocus', () => {
|
||||||
it('sets isFocussed flag to true', () => {
|
it('sets isFocussed flag to true', () => {
|
||||||
expect(instance.isFocussed).to.equal(false);
|
expect(instance.isFocussed).to.equal(false);
|
||||||
instance.onFocus();
|
instance._onFocus();
|
||||||
expect(instance.isFocussed).to.equal(true);
|
expect(instance.isFocussed).to.equal(true);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -142,7 +142,7 @@ describe('components/input', () => {
|
||||||
describe('onBlur', () => {
|
describe('onBlur', () => {
|
||||||
it('sets isFocussed flag to false', () => {
|
it('sets isFocussed flag to false', () => {
|
||||||
instance.isFocussed = true;
|
instance.isFocussed = true;
|
||||||
instance.onBlur();
|
instance._onBlur();
|
||||||
expect(instance.isFocussed).to.equal(false);
|
expect(instance.isFocussed).to.equal(false);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue