Minor test tweaks

src/scripts/src/actions/choices.test.js

@@ -1,7 +1,7 @@
 import { expect } from 'chai';
 import * as actions from './choices';
 
-describe('choice actions', () => {
+describe('actions/choices', () => {
   describe('addChoice action', () => {
     it('returns ADD_CHOICE action', () => {
       const value = 'test';

src/scripts/src/actions/groups.test.js

@@ -1,7 +1,7 @@
 import { expect } from 'chai';
 import * as actions from './groups';
 
-describe('group actions', () => {
+describe('actions/groups', () => {
   describe('addGroup action', () => {
     it('returns ADD_GROUP action', () => {
       const value = 'test';

src/scripts/src/actions/items.test.js

@@ -1,7 +1,7 @@
 import { expect } from 'chai';
 import * as actions from './items';
 
-describe('item actions', () => {
+describe('actions/items', () => {
   describe('addItem action', () => {
     it('returns ADD_ITEM action', () => {
       const value = 'test';

src/scripts/src/actions/misc.test.js

@@ -1,7 +1,7 @@
 import { expect } from 'chai';
 import * as actions from './misc';
 
-describe('misc actions', () => {
+describe('actions/misc', () => {
   describe('clearAll action', () => {
     it('returns CLEAR_ALL action', () => {
       const expectedAction = {

src/scripts/src/choices.js

@@ -997,6 +997,26 @@ class Choices {
     });
   }
 
+    /**
+   * Select placeholder choice
+   */
+  _selectPlaceholderChoice() {
+    const placeholderChoice = this.store.getPlaceholderChoice();
+
+    if (placeholderChoice) {
+      this._addItem(
+        placeholderChoice.value,
+        placeholderChoice.label,
+        placeholderChoice.id,
+        placeholderChoice.groupId,
+        null,
+        placeholderChoice.placeholder,
+      );
+      this._triggerChange(placeholderChoice.value);
+    }
+  }
+
+
   /**
    * Process enter/click of an item button
    * @param {Array} activeItems The currently active items
@@ -1026,25 +1046,6 @@ class Choices {
     }
   }
 
-  /**
-   * Select placeholder choice
-   */
-  _selectPlaceholderChoice() {
-    const placeholderChoice = this.store.getPlaceholderChoice();
-
-    if (placeholderChoice) {
-      this._addItem(
-        placeholderChoice.value,
-        placeholderChoice.label,
-        placeholderChoice.id,
-        placeholderChoice.groupId,
-        null,
-        placeholderChoice.placeholder,
-      );
-      this._triggerChange(placeholderChoice.value);
-    }
-  }
-
   /**
    * Process click of an item
    * @param {Array} activeItems The currently active items
@@ -1160,6 +1161,38 @@ class Choices {
     }
   }
 
+  /**
+   * Apply or remove a loading state to the component.
+   * @param {Boolean} isLoading default value set to 'true'.
+   * @return
+   * @private
+   */
+  _handleLoadingState(isLoading = true) {
+    let placeholderItem = this.itemList.getChild(`.${this.config.classNames.placeholder}`);
+    if (isLoading) {
+      this.containerOuter.addLoadingState();
+      if (this.isSelectOneElement) {
+        if (!placeholderItem) {
+          placeholderItem = this._getTemplate('placeholder', this.config.loadingText);
+          this.itemList.append(placeholderItem);
+        } else {
+          placeholderItem.innerHTML = this.config.loadingText;
+        }
+      } else {
+        this.input.setPlaceholder(this.config.loadingText);
+      }
+    } else {
+      this.containerOuter.removeLoadingState();
+
+      if (this.isSelectOneElement) {
+        placeholderItem.innerHTML = (this.placeholder || '');
+      } else {
+        this.input.setPlaceholder(this.placeholder || '');
+      }
+    }
+  }
+
+
   /**
    * Validates whether an item can be added by a user
    * @param {Array} activeItems The currently active items
@@ -1218,37 +1251,6 @@ class Choices {
     };
   }
 
-  /**
-   * Apply or remove a loading state to the component.
-   * @param {Boolean} isLoading default value set to 'true'.
-   * @return
-   * @private
-   */
-  _handleLoadingState(isLoading = true) {
-    let placeholderItem = this.itemList.getChild(`.${this.config.classNames.placeholder}`);
-    if (isLoading) {
-      this.containerOuter.addLoadingState();
-      if (this.isSelectOneElement) {
-        if (!placeholderItem) {
-          placeholderItem = this._getTemplate('placeholder', this.config.loadingText);
-          this.itemList.append(placeholderItem);
-        } else {
-          placeholderItem.innerHTML = this.config.loadingText;
-        }
-      } else {
-        this.input.setPlaceholder(this.config.loadingText);
-      }
-    } else {
-      this.containerOuter.removeLoadingState();
-
-      if (this.isSelectOneElement) {
-        placeholderItem.innerHTML = (this.placeholder || '');
-      } else {
-        this.input.setPlaceholder(this.placeholder || '');
-      }
-    }
-  }
-
   /**
    * Retrieve the callback used to populate component's choices in an async way.
    * @returns {Function} The callback as a function.
@@ -1708,6 +1710,24 @@ class Choices {
     }
   }
 
+    /**
+   * Mouse over (hover) event
+   * @param  {Object} e Event
+   * @return
+   * @private
+   */
+  _onMouseOver(e) {
+    // If the dropdown is either the target or one of its children is the target
+    const targetWithinDropdown = (
+      e.target === this.dropdown || this.dropdown.element.contains(e.target)
+    );
+    const shouldHighlightChoice = targetWithinDropdown && e.target.hasAttribute('data-choice');
+
+    if (shouldHighlightChoice) {
+      this._highlightChoice(e.target);
+    }
+  }
+
   /**
    * Click event
    * @param  {Object} e Event
@@ -1756,24 +1776,6 @@ class Choices {
     }
   }
 
-  /**
-   * Mouse over (hover) event
-   * @param  {Object} e Event
-   * @return
-   * @private
-   */
-  _onMouseOver(e) {
-    // If the dropdown is either the target or one of its children is the target
-    const targetWithinDropdown = (
-      e.target === this.dropdown || this.dropdown.element.contains(e.target)
-    );
-    const shouldHighlightChoice = targetWithinDropdown && e.target.hasAttribute('data-choice');
-
-    if (shouldHighlightChoice) {
-      this._highlightChoice(e.target);
-    }
-  }
-
   /**
    * Focus event
    * @param  {Object} e Event

src/scripts/src/components/container.test.js

@@ -3,7 +3,7 @@ import sinon from 'sinon';
 import Container from './container';
 import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 
-describe('Container', () => {
+describe('components/container', () => {
   let instance;
   let choicesInstance;
   let choicesElement;

src/scripts/src/components/dropdown.test.js

@@ -3,7 +3,7 @@ import sinon from 'sinon';
 import Dropdown from './dropdown';
 import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 
-describe('Dropdown', () => {
+describe('components/dropdown', () => {
   let instance;
   let choicesInstance;
   let choicesElement;

src/scripts/src/components/input.test.js

@@ -3,7 +3,7 @@ import sinon from 'sinon';
 import Input from './input';
 import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 
-describe('Input', () => {
+describe('components/input', () => {
   let instance;
   let choicesInstance;
   let choicesElement;

src/scripts/src/components/list.test.js

@@ -2,7 +2,7 @@ import { expect } from 'chai';
 import List from './list';
 import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 
-describe('List', () => {
+describe('components/list', () => {
   let instance;
   let choicesInstance;
   let choicesElement;

src/scripts/src/components/wrapped-element.test.js

@@ -2,7 +2,7 @@ import { expect } from 'chai';
 import WrappedElement from './wrapped-element';
 import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 
-describe('WrappedElement', () => {
+describe('components/wrappedElement', () => {
   let instance;
   let choicesInstance;
   let choicesElement;
@@ -13,7 +13,48 @@ describe('WrappedElement', () => {
         ...DEFAULT_CONFIG,
       },
     };
+
     choicesElement = document.createElement('select');
     instance = new WrappedElement(choicesInstance, choicesElement, DEFAULT_CLASSNAMES);
   });
+
+  describe('conceal', () => {
+    let originalStyling;
+
+    beforeEach(() => {
+      originalStyling = 'color:red';
+      instance.element.setAttribute('style', originalStyling);
+    });
+
+    it('hides element', () => {
+      instance.conceal();
+      expect(instance.element.tabIndex).to.equal(-1);
+      expect(instance.element.classList.contains(instance.classNames.input)).to.equal(true);
+      expect(instance.element.classList.contains(instance.classNames.hiddenState)).to.equal(true);
+      expect(instance.element.getAttribute('style')).to.equal('display:none;');
+      expect(instance.element.getAttribute('aria-hidden')).to.equal('true');
+      expect(instance.element.getAttribute('data-choice')).to.equal('active');
+      expect(instance.element.getAttribute('data-choice-orig-style')).to.equal(originalStyling);
+    });
+  });
+
+  describe('reveal', () => {
+    let originalStyling;
+
+    beforeEach(() => {
+      originalStyling = 'color:red';
+      instance.element.setAttribute('data-choice-orig-style', originalStyling);
+    });
+
+    it('shows element', () => {
+      instance.reveal();
+      expect(instance.element.tabIndex).to.equal(0);
+      expect(instance.element.classList.contains(instance.classNames.input)).to.equal(false);
+      expect(instance.element.classList.contains(instance.classNames.hiddenState)).to.equal(false);
+      expect(instance.element.getAttribute('style')).to.equal(originalStyling);
+      expect(instance.element.getAttribute('aria-hidden')).to.equal(null);
+      expect(instance.element.getAttribute('data-choice')).to.equal(null);
+      expect(instance.element.getAttribute('data-choice-orig-style')).to.equal(null);
+    });
+  });
 });

src/scripts/src/components/wrapped-input.test.js

@@ -2,7 +2,7 @@ import { expect } from 'chai';
 import WrappedInput from './wrapped-input';
 import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 
-describe('WrappedInput', () => {
+describe('components/wrappedInput', () => {
   let instance;
   let choicesInstance;
   let choicesElement;

src/scripts/src/components/wrapped-select.test.js

@@ -2,7 +2,7 @@ import { expect } from 'chai';
 import WrappedSelect from './wrapped-select';
 import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 
-describe('WrappedSelect', () => {
+describe('components/wrappedSelect', () => {
   let instance;
   let choicesInstance;
   let choicesElement;

src/scripts/src/reducers/choices.test.js

@@ -1,7 +1,7 @@
 import { expect } from 'chai';
 import choices, { defaultState } from './choices';
 
-describe('choices reducer', () => {
+describe('reducers/choices', () => {
   it('should return same state when no action matches', () => {
     expect(choices(defaultState, {})).to.equal(defaultState);
   });

src/scripts/src/reducers/groups.test.js

@@ -1,7 +1,7 @@
 import { expect } from 'chai';
 import groups, { defaultState } from './groups';
 
-describe('groups reducer', () => {
+describe('reducers/groups', () => {
   it('should return same state when no action matches', () => {
     expect(groups(defaultState, {})).to.equal(defaultState);
   });

src/scripts/src/reducers/index.test.js

@@ -5,7 +5,7 @@ import groups from './groups';
 import choices from './choices';
 import items from './items';
 
-describe('rootReducer', () => {
+describe('reducers/rootReducer', () => {
   const store = createStore(rootReducer);
 
   it('returns expected reducers', () => {

src/scripts/src/reducers/items.test.js

@@ -1,8 +1,7 @@
 import { expect } from 'chai';
-// import * as actions from '../actions/actions';
 import items, { defaultState } from './items';
 
-describe('items reducer', () => {
+describe('reducers/items', () => {
   it('should return same state when no action matches', () => {
     expect(items(defaultState, {})).to.equal(defaultState);
   });

src/scripts/src/store/store.test.js

@@ -2,7 +2,7 @@ import { expect } from 'chai';
 import sinon from 'sinon';
 import Store from './store';
 
-describe('Store', () => {
+describe('reducers/store', () => {
   let instance;
   let subscribeStub;
   let dispatchStub;