From a5277a49e7e272fc278fc120aacdb31e1d55de84 Mon Sep 17 00:00:00 2001
From: Josh Johnson <josh@joshuajohnson.co.uk>
Date: Wed, 20 Dec 2017 12:38:16 +0000
Subject: [PATCH] Wrapped select tests + minor refactors

---
 config/test.js                                |  2 +
 .../src/components/wrapped-input.test.js      |  7 +-
 .../src/components/wrapped-select.test.js     | 73 ++++++++++++++++---
 src/scripts/src/lib/utils.js                  |  2 +-
 4 files changed, 68 insertions(+), 16 deletions(-)

diff --git a/config/test.js b/config/test.js
index 6ad56e9..d455171 100644
--- a/config/test.js
+++ b/config/test.js
@@ -45,7 +45,9 @@ global.document = window.document;
 global.navigator = {
   userAgent: 'node.js',
 };
+global.CustomEvent = window.CustomEvent;
 global.HTMLElement = window.HTMLElement;
+global.HTMLOptionElement = window.HTMLOptionElement;
 
 copyProps(window, global);
 mockRAF(global);
diff --git a/src/scripts/src/components/wrapped-input.test.js b/src/scripts/src/components/wrapped-input.test.js
index 205af58..ae7c267 100644
--- a/src/scripts/src/components/wrapped-input.test.js
+++ b/src/scripts/src/components/wrapped-input.test.js
@@ -7,7 +7,7 @@ import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 describe('components/wrappedInput', () => {
   let instance;
   let choicesInstance;
-  let choicesElement;
+  let inputElement;
 
   beforeEach(() => {
     choicesInstance = {
@@ -15,8 +15,8 @@ describe('components/wrappedInput', () => {
         ...DEFAULT_CONFIG,
       },
     };
-    choicesElement = document.createElement('input');
-    instance = new WrappedInput(choicesInstance, choicesElement, DEFAULT_CLASSNAMES);
+    inputElement = document.createElement('input');
+    instance = new WrappedInput(choicesInstance, inputElement, DEFAULT_CLASSNAMES);
   });
 
   afterEach(() => {
@@ -36,6 +36,7 @@ describe('components/wrappedInput', () => {
         });
 
         it(`calls super.${method}`, () => {
+          expect(WrappedElement.prototype[method].called).to.equal(false);
           instance[method]();
           expect(WrappedElement.prototype[method].called).to.equal(true);
         });
diff --git a/src/scripts/src/components/wrapped-select.test.js b/src/scripts/src/components/wrapped-select.test.js
index 685ac02..e057475 100644
--- a/src/scripts/src/components/wrapped-select.test.js
+++ b/src/scripts/src/components/wrapped-select.test.js
@@ -7,7 +7,7 @@ import { DEFAULT_CLASSNAMES, DEFAULT_CONFIG } from '../constants';
 describe('components/wrappedSelect', () => {
   let instance;
   let choicesInstance;
-  let choicesElement;
+  let selectElement;
 
   beforeEach(() => {
     choicesInstance = {
@@ -15,8 +15,24 @@ describe('components/wrappedSelect', () => {
         ...DEFAULT_CONFIG,
       },
     };
-    choicesElement = document.createElement('select');
-    instance = new WrappedSelect(choicesInstance, choicesElement, DEFAULT_CLASSNAMES);
+
+    selectElement = document.createElement('select');
+    selectElement.id = 'target';
+    for (let i = 1; i <= 4; i++) {
+      const option = document.createElement('option');
+
+      option.value = `Value ${i}`;
+      option.innerHTML = `Label ${i}`;
+
+      if (i === 1) {
+        option.setAttribute('placeholder', '');
+      }
+
+      selectElement.appendChild(option);
+    }
+    document.body.appendChild(selectElement);
+
+    instance = new WrappedSelect(choicesInstance, document.getElementById('target'), DEFAULT_CLASSNAMES);
   });
 
   afterEach(() => {
@@ -26,9 +42,17 @@ describe('components/wrappedSelect', () => {
 
   describe('inherited methods', () => {
     ['getElement', 'conceal', 'reveal', 'enable', 'disable'].forEach((method) => {
+      beforeEach(() => {
+        stub(WrappedElement.prototype, method);
+      });
+
+      afterEach(() => {
+        WrappedElement.prototype[method].restore();
+      });
+
       describe(method, () => {
         it(`calls super.${method}`, () => {
-          stub(WrappedElement.prototype, method);
+          expect(WrappedElement.prototype[method].called).to.equal(false);
           instance[method]();
           expect(WrappedElement.prototype[method].called).to.equal(true);
         });
@@ -36,23 +60,48 @@ describe('components/wrappedSelect', () => {
     });
   });
 
-  // describe('getPlaceholderOption', () => {
+  describe('getPlaceholderOption', () => {
+    it('returns option element with placeholder attribute', () => {
+      const output = instance.getPlaceholderOption();
+      expect(output).to.be.instanceOf(HTMLOptionElement);
+    });
+  });
 
-  // });
-
-  // describe('getOptions', () => {
-
-  // });
+  describe('getOptions', () => {
+    it('returns all option elements', () => {
+      const output = instance.getOptions();
+      expect(output).to.be.an('array');
+      output.forEach((option) => {
+        expect(option).to.be.instanceOf(HTMLOptionElement);
+      });
+    });
+  });
 
   // describe('getOptionGroups', () => {
+  //   it('returns all option groups', () => {
 
+  //   });
   // });
 
   // describe('setOptions', () => {
 
   // });
 
-  // describe('appendDocFragment', () => {
+  describe('appendDocFragment', () => {
+    it('empties contents of element', () => {
+      expect(instance.element.getElementsByTagName('option').length).to.equal(4);
+      instance.appendDocFragment(document.createDocumentFragment());
+      expect(instance.element.getElementsByTagName('option').length).to.equal(0);
+    });
 
-  // });
+    it('appends passed fragment to element', () => {
+      const fragment = document.createDocumentFragment();
+      const elementToAppend = document.createElement('div');
+      elementToAppend.id = 'fragment-target';
+      fragment.appendChild(elementToAppend);
+      expect(instance.element.querySelector('#fragment-target')).to.equal(null);
+      instance.appendDocFragment(fragment);
+      expect(instance.element.querySelector('#fragment-target')).to.eql(elementToAppend);
+    });
+  });
 });
diff --git a/src/scripts/src/lib/utils.js b/src/scripts/src/lib/utils.js
index b8d2d08..af1833d 100644
--- a/src/scripts/src/lib/utils.js
+++ b/src/scripts/src/lib/utils.js
@@ -559,7 +559,7 @@ export const sortByScore = (a, b) => a.score - b.score;
  * @return {Object}              Triggered event
  */
 export const dispatchEvent = (element, type, customArgs = null) => {
-  const event = new window.CustomEvent(type, {
+  const event = new CustomEvent(type, {
     detail: customArgs,
     bubbles: true,
     cancelable: true,