diff --git a/src/scripts/src/choices.js b/src/scripts/src/choices.js index 1b9c347..01c30b7 100644 --- a/src/scripts/src/choices.js +++ b/src/scripts/src/choices.js @@ -432,7 +432,7 @@ class Choices { if (this.isSelectElement) { // Get active groups/choices const activeGroups = this.store.getGroupsFilteredByActive(); - const activeChoices = this.store.getChoicesFilteredByActive(); + const activeChoices = this.store.choicesFilteredByActive; let choiceListFragment = document.createDocumentFragment(); @@ -464,7 +464,7 @@ class Choices { // If we have choices to show if (choiceListFragment.childNodes && choiceListFragment.childNodes.length > 0) { - const activeItems = this.store.getItemsFilteredByActive(); + const activeItems = this.store.itemsFilteredByActive; const canAddItem = this._canAddItem(activeItems, this.input.value); // ...and we can select them @@ -502,7 +502,7 @@ class Choices { /* Items */ if (this.currentState.items !== this.prevState.items) { // Get active items (items that can be selected) - const activeItems = this.store.getItemsFilteredByActive() || []; + const activeItems = this.store.itemsFilteredByActive || []; // Clear list this.itemList.clear(); @@ -608,7 +608,7 @@ class Choices { return this; } - const items = this.store.getItemsFilteredByActive(); + const items = this.store.itemsFilteredByActive; items.forEach((item) => { if (item.value === value) { @@ -627,7 +627,7 @@ class Choices { * @public */ removeActiveItems(excludedId) { - const items = this.store.getItemsFilteredByActive(); + const items = this.store.itemsFilteredByActive; items.forEach((item) => { if (excludedId !== item.id) { @@ -645,7 +645,7 @@ class Choices { * @public */ removeHighlightedItems(runEvent = false) { - const items = this.store.getItemsFilteredByHighlighted(); + const items = this.store.itemsFilteredByHighlighted; items.forEach((item) => { this._removeItem(item); @@ -727,7 +727,7 @@ class Choices { * @public */ getValue(valueOnly = false) { - const items = this.store.getItemsFilteredByActive(); + const items = this.store.itemsFilteredByActive; const values = items.reduce((selectedItems, item) => { const itemValue = valueOnly ? item.value : item; @@ -1243,7 +1243,7 @@ class Choices { return; } - const choices = this.store.getChoices(); + const choices = this.store.choices; const hasUnactiveChoices = choices.some(option => !option.active); // Check that we have a value to search and the input was an alphanumeric character @@ -1322,7 +1322,7 @@ class Choices { } const target = e.target; - const activeItems = this.store.getItemsFilteredByActive(); + const activeItems = this.store.itemsFilteredByActive; const hasFocusedInput = this.input.isFocussed; const hasActiveDropdown = this.dropdown.isActive; const hasItems = this.itemList.hasChildren; @@ -1491,7 +1491,7 @@ class Choices { } const value = this.input.value; - const activeItems = this.store.getItemsFilteredByActive(); + const activeItems = this.store.itemsFilteredByActive; const canAddItem = this._canAddItem(activeItems, value); // We are typing into a text input and have a value, we want to show a dropdown @@ -1587,7 +1587,7 @@ class Choices { } if (this.containerOuter.element.contains(target) && target !== this.input.element) { - const activeItems = this.store.getItemsFilteredByActive(); + const activeItems = this.store.itemsFilteredByActive; const hasShiftKey = e.shiftKey; const buttonTarget = findAncestorByAttrName(target, 'data-button'); @@ -1633,7 +1633,7 @@ class Choices { _onClick(e) { const target = e.target; const hasActiveDropdown = this.dropdown.isActive; - const activeItems = this.store.getItemsFilteredByActive(); + const activeItems = this.store.itemsFilteredByActive; // If target is something that concerns us if (this.containerOuter.element.contains(target)) { @@ -1720,7 +1720,7 @@ class Choices { const target = e.target; // If target is something that concerns us if (this.containerOuter.element.contains(target) && !this.isScrollingOnIe) { - const activeItems = this.store.getItemsFilteredByActive(); + const activeItems = this.store.itemsFilteredByActive; const hasHighlightedItems = activeItems.some(item => item.highlighted); const blurActions = { text: () => { @@ -2021,7 +2021,7 @@ class Choices { } // Generate unique id - const choices = this.store.getChoices(); + const choices = this.store.choices; const choiceLabel = label || value; const choiceId = choices ? choices.length + 1 : 1; const choiceElementId = `${this.baseId}-${this.idNames.itemChoice}-${choiceId}`; @@ -2374,7 +2374,7 @@ class Choices { } _findAndSelectChoiceByValue(val) { - const choices = this.store.getChoices(); + const choices = this.store.choices; // Check 'value' property exists and the choice isn't already selected const foundChoice = choices.find(choice => this.config.itemComparer(choice.value, val)); diff --git a/src/scripts/src/choices.test.js b/src/scripts/src/choices.test.js index 168cba1..b91ced6 100644 --- a/src/scripts/src/choices.test.js +++ b/src/scripts/src/choices.test.js @@ -1107,7 +1107,7 @@ describe('choices', () => { }); describe('getValue', () => { - let getItemsFilteredByActiveStub; + let itemsFilteredByActiveStub; const items = [ { id: '1', @@ -1120,12 +1120,11 @@ describe('choices', () => { ]; beforeEach(() => { - getItemsFilteredByActiveStub = stub().returns(items); - instance.store.getItemsFilteredByActive = getItemsFilteredByActiveStub; + itemsFilteredByActiveStub = stub(instance.store, 'itemsFilteredByActive').get(() => items); }); afterEach(() => { - instance.store.getItemsFilteredByActive.reset(); + itemsFilteredByActiveStub.reset(); }); describe('passing true valueOnly flag', () => { @@ -1187,7 +1186,7 @@ describe('choices', () => { }); describe('passing valid value', () => { - let getItemsFilteredByActiveStub; + let itemsFilteredByActiveStub; let removeItemStub; const value = 'Removed'; const items = [ @@ -1207,15 +1206,14 @@ describe('choices', () => { beforeEach(() => { removeItemStub = stub(); - getItemsFilteredByActiveStub = stub().returns(items); - instance.store.getItemsFilteredByActive = getItemsFilteredByActiveStub; + itemsFilteredByActiveStub = stub(instance.store, 'itemsFilteredByActive').get(() => items); instance._removeItem = removeItemStub; output = instance.removeActiveItemsByValue(value); }); afterEach(() => { - instance.store.getItemsFilteredByActive.reset(); + itemsFilteredByActiveStub.reset(); instance._removeItem.reset(); }); @@ -1228,7 +1226,7 @@ describe('choices', () => { }); describe('removeActiveItems', () => { - let getItemsFilteredByActiveStub; + let itemsFilteredByActiveStub; let removeItemStub; const items = [ { @@ -1247,13 +1245,12 @@ describe('choices', () => { beforeEach(() => { removeItemStub = stub(); - getItemsFilteredByActiveStub = stub().returns(items); - instance.store.getItemsFilteredByActive = getItemsFilteredByActiveStub; + itemsFilteredByActiveStub = stub(instance.store, 'itemsFilteredByActive').get(() => items); instance._removeItem = removeItemStub; }); afterEach(() => { - instance.store.getItemsFilteredByActive.reset(); + itemsFilteredByActiveStub.reset(); instance._removeItem.reset(); }); @@ -1286,7 +1283,7 @@ describe('choices', () => { }); describe('removeHighlightedItems', () => { - let getItemsFilteredByHighlightedStub; + let itemsFilteredByHighlightedStub; let removeItemStub; let triggerChangeStub; @@ -1303,17 +1300,16 @@ describe('choices', () => { beforeEach(() => { - getItemsFilteredByHighlightedStub = stub().returns(items); + itemsFilteredByHighlightedStub = stub(instance.store, 'itemsFilteredByHighlighted').get(() => items); removeItemStub = stub(); triggerChangeStub = stub(); - instance.store.getItemsFilteredByHighlighted = getItemsFilteredByHighlightedStub; instance._removeItem = removeItemStub; instance._triggerChange = triggerChangeStub; }); afterEach(() => { - instance.store.getItemsFilteredByHighlighted.reset(); + itemsFilteredByHighlightedStub.reset(); instance._removeItem.reset(); instance._triggerChange.reset(); }); diff --git a/src/scripts/src/store/store.js b/src/scripts/src/store/store.js index 7dd453d..5cdc204 100644 --- a/src/scripts/src/store/store.js +++ b/src/scripts/src/store/store.js @@ -49,29 +49,23 @@ export default class Store { * Get active items from store * @return {Array} Item objects */ - getItemsFilteredByActive() { - const items = this.items; - const values = items.filter(item => item.active === true); - - return values; + get itemsFilteredByActive() { + return this.items.filter(item => item.active === true); } /** * Get highlighted items from store * @return {Array} Item objects */ - getItemsFilteredByHighlighted() { - const items = this.items; - const values = items.filter(item => item.active && item.highlighted); - - return values; + get itemsFilteredByHighlighted() { + return this.items.filter(item => item.active && item.highlighted); } /** * Get choices from store * @return {Array} Option objects */ - getChoices() { + get choices() { return this.state.choices; } @@ -79,8 +73,8 @@ export default class Store { * Get active choices from store * @return {Array} Option objects */ - getChoicesFilteredByActive() { - const choices = this.getChoices(); + get choicesFilteredByActive() { + const choices = this.choices; const values = choices.filter(choice => choice.active === true); return values; @@ -91,7 +85,7 @@ export default class Store { * @return {Array} Option objects */ getChoicesFilteredBySelectable() { - const choices = this.getChoices(); + const choices = this.choices; const values = choices.filter(choice => choice.disabled !== true); return values; @@ -112,7 +106,7 @@ export default class Store { */ getChoiceById(id) { if (id) { - const choices = this.getChoicesFilteredByActive(); + const choices = this.choicesFilteredByActive; const foundChoice = choices.find(choice => choice.id === parseInt(id, 10)); return foundChoice; } @@ -124,7 +118,7 @@ export default class Store { * @return {Object} Found placeholder */ getPlaceholderChoice() { - const choices = this.getChoices(); + const choices = this.choices; const placeholderChoice = [...choices] .reverse() .find(choice => choice.placeholder === true); @@ -146,7 +140,7 @@ export default class Store { */ getGroupsFilteredByActive() { const groups = this.getGroups(); - const choices = this.getChoices(); + const choices = this.choices; const values = groups.filter((group) => { const isActive = group.active === true && group.disabled === false; diff --git a/src/scripts/src/store/store.test.js b/src/scripts/src/store/store.test.js index fd8356b..6d1efae 100644 --- a/src/scripts/src/store/store.test.js +++ b/src/scripts/src/store/store.test.js @@ -55,9 +55,7 @@ describe('reducers/store', () => { describe('state getter', () => { it('returns state', () => { - const state = { - items: [], - }; + const state = { items: [] }; getStateStub.returns(state); expect(instance.state).to.equal(state); @@ -163,35 +161,31 @@ describe('reducers/store', () => { }); }); - describe('getItemsFilteredByActive', () => { + describe('itemsFilteredByActive getter', () => { it('returns items that are active', () => { const expectedResponse = state.items.filter((item => item.active)); - const actualResponse = instance.getItemsFilteredByActive(); - expect(actualResponse).to.eql(expectedResponse); + expect(instance.itemsFilteredByActive).to.eql(expectedResponse); }); }); - describe('getItemsFilteredByHighlighted', () => { + describe('itemsFilteredByHighlighted getter', () => { it('returns items that are active and highlighted', () => { const expectedResponse = state.items.filter((item => item.highlighted && item.active)); - const actualResponse = instance.getItemsFilteredByHighlighted(); - expect(actualResponse).to.eql(expectedResponse); + expect(instance.itemsFilteredByHighlighted).to.eql(expectedResponse); }); }); - describe('getChoices', () => { + describe('choices getter', () => { it('returns choices', () => { const expectedResponse = state.choices; - const actualResponse = instance.getChoices(); - expect(actualResponse).to.eql(expectedResponse); + expect(instance.choices).to.eql(expectedResponse); }); }); - describe('getChoicesFilteredByActive', () => { + describe('choicesFilteredByActive getter', () => { it('returns choices that are active', () => { const expectedResponse = state.choices.filter((choice => choice.active)); - const actualResponse = instance.getChoicesFilteredByActive(); - expect(actualResponse).to.eql(expectedResponse); + expect(instance.choicesFilteredByActive).to.eql(expectedResponse); }); });