Commit fa3a1fad authored by Clement Ho's avatar Clement Ho

Merge branch 'remove-droplab-object-assign-calls' into 'master'

Removed all instances of Object.assign by using es6 classes, also includes some …

See merge request !11288
parents bec9ec9a 0a86eba5
/* eslint-disable */
import utils from './utils'; import utils from './utils';
import { SELECTED_CLASS, IGNORE_CLASS } from './constants'; import { SELECTED_CLASS, IGNORE_CLASS } from './constants';
var DropDown = function(list) { class DropDown {
this.currentIndex = 0; constructor(list) {
this.hidden = true; this.currentIndex = 0;
this.list = typeof list === 'string' ? document.querySelector(list) : list; this.hidden = true;
this.items = []; this.list = typeof list === 'string' ? document.querySelector(list) : list;
this.items = [];
this.eventWrapper = {}; this.eventWrapper = {};
this.getItems(); this.getItems();
this.initTemplateString(); this.initTemplateString();
this.addEvents(); this.addEvents();
this.initialState = list.innerHTML; this.initialState = list.innerHTML;
}; }
Object.assign(DropDown.prototype, { getItems() {
getItems: function() {
this.items = [].slice.call(this.list.querySelectorAll('li')); this.items = [].slice.call(this.list.querySelectorAll('li'));
return this.items; return this.items;
}, }
initTemplateString: function() { initTemplateString() {
var items = this.items || this.getItems(); const items = this.items || this.getItems();
var templateString = ''; let templateString = '';
if (items.length > 0) templateString = items[items.length - 1].outerHTML; if (items.length > 0) templateString = items[items.length - 1].outerHTML;
this.templateString = templateString; this.templateString = templateString;
return this.templateString; return this.templateString;
}, }
clickEvent: function(e) { clickEvent(e) {
if (e.target.tagName === 'UL') return; if (e.target.tagName === 'UL') return;
if (e.target.classList.contains(IGNORE_CLASS)) return; if (e.target.classList.contains(IGNORE_CLASS)) return;
var selected = utils.closest(e.target, 'LI'); const selected = utils.closest(e.target, 'LI');
if (!selected) return; if (!selected) return;
this.addSelectedClass(selected); this.addSelectedClass(selected);
...@@ -46,95 +44,95 @@ Object.assign(DropDown.prototype, { ...@@ -46,95 +44,95 @@ Object.assign(DropDown.prototype, {
e.preventDefault(); e.preventDefault();
this.hide(); this.hide();
var listEvent = new CustomEvent('click.dl', { const listEvent = new CustomEvent('click.dl', {
detail: { detail: {
list: this, list: this,
selected: selected, selected,
data: e.target.dataset, data: e.target.dataset,
}, },
}); });
this.list.dispatchEvent(listEvent); this.list.dispatchEvent(listEvent);
}, }
addSelectedClass: function (selected) { addSelectedClass(selected) {
this.removeSelectedClasses(); this.removeSelectedClasses();
selected.classList.add(SELECTED_CLASS); selected.classList.add(SELECTED_CLASS);
}, }
removeSelectedClasses: function () { removeSelectedClasses() {
const items = this.items || this.getItems(); const items = this.items || this.getItems();
items.forEach(item => item.classList.remove(SELECTED_CLASS)); items.forEach(item => item.classList.remove(SELECTED_CLASS));
}, }
addEvents: function() { addEvents() {
this.eventWrapper.clickEvent = this.clickEvent.bind(this) this.eventWrapper.clickEvent = this.clickEvent.bind(this);
this.list.addEventListener('click', this.eventWrapper.clickEvent); this.list.addEventListener('click', this.eventWrapper.clickEvent);
}, }
toggle: function() {
this.hidden ? this.show() : this.hide();
},
setData: function(data) { setData(data) {
this.data = data; this.data = data;
this.render(data); this.render(data);
}, }
addData: function(data) { addData(data) {
this.data = (this.data || []).concat(data); this.data = (this.data || []).concat(data);
this.render(this.data); this.render(this.data);
}, }
render: function(data) { render(data) {
const children = data ? data.map(this.renderChildren.bind(this)) : []; const children = data ? data.map(this.renderChildren.bind(this)) : [];
const renderableList = this.list.querySelector('ul[data-dynamic]') || this.list; const renderableList = this.list.querySelector('ul[data-dynamic]') || this.list;
renderableList.innerHTML = children.join(''); renderableList.innerHTML = children.join('');
}, }
renderChildren: function(data) { renderChildren(data) {
var html = utils.template(this.templateString, data); const html = utils.template(this.templateString, data);
var template = document.createElement('div'); const template = document.createElement('div');
template.innerHTML = html; template.innerHTML = html;
this.setImagesSrc(template); DropDown.setImagesSrc(template);
template.firstChild.style.display = data.droplab_hidden ? 'none' : 'block'; template.firstChild.style.display = data.droplab_hidden ? 'none' : 'block';
return template.firstChild.outerHTML; return template.firstChild.outerHTML;
}, }
setImagesSrc: function(template) {
const images = [].slice.call(template.querySelectorAll('img[data-src]'));
images.forEach((image) => {
image.src = image.getAttribute('data-src');
image.removeAttribute('data-src');
});
},
show: function() { show() {
if (!this.hidden) return; if (!this.hidden) return;
this.list.style.display = 'block'; this.list.style.display = 'block';
this.currentIndex = 0; this.currentIndex = 0;
this.hidden = false; this.hidden = false;
}, }
hide: function() { hide() {
if (this.hidden) return; if (this.hidden) return;
this.list.style.display = 'none'; this.list.style.display = 'none';
this.currentIndex = 0; this.currentIndex = 0;
this.hidden = true; this.hidden = true;
}, }
toggle: function () { toggle() {
this.hidden ? this.show() : this.hide(); if (this.hidden) return this.show();
},
destroy: function() { return this.hide();
}
destroy() {
this.hide(); this.hide();
this.list.removeEventListener('click', this.eventWrapper.clickEvent); this.list.removeEventListener('click', this.eventWrapper.clickEvent);
} }
});
static setImagesSrc(template) {
const images = [...template.querySelectorAll('img[data-src]')];
images.forEach((image) => {
const img = image;
img.src = img.getAttribute('data-src');
img.removeAttribute('data-src');
});
}
}
export default DropDown; export default DropDown;
/* eslint-disable */
import HookButton from './hook_button'; import HookButton from './hook_button';
import HookInput from './hook_input'; import HookInput from './hook_input';
import utils from './utils'; import utils from './utils';
import Keyboard from './keyboard'; import Keyboard from './keyboard';
import { DATA_TRIGGER } from './constants'; import { DATA_TRIGGER } from './constants';
var DropLab = function() { class DropLab {
this.ready = false; constructor() {
this.hooks = []; this.ready = false;
this.queuedData = []; this.hooks = [];
this.config = {}; this.queuedData = [];
this.config = {};
this.eventWrapper = {}; this.eventWrapper = {};
}; }
Object.assign(DropLab.prototype, { loadStatic() {
loadStatic: function(){ const dropdownTriggers = [].slice.apply(document.querySelectorAll(`[${DATA_TRIGGER}]`));
var dropdownTriggers = [].slice.apply(document.querySelectorAll(`[${DATA_TRIGGER}]`));
this.addHooks(dropdownTriggers); this.addHooks(dropdownTriggers);
}, }
addData: function () { addData(...args) {
var args = [].slice.apply(arguments); this.applyArgs(args, 'processAddData');
this.applyArgs(args, '_addData'); }
},
setData: function() { setData(...args) {
var args = [].slice.apply(arguments); this.applyArgs(args, 'processSetData');
this.applyArgs(args, '_setData'); }
},
destroy: function() { destroy() {
this.hooks.forEach(hook => hook.destroy()); this.hooks.forEach(hook => hook.destroy());
this.hooks = []; this.hooks = [];
this.removeEvents(); this.removeEvents();
}, }
applyArgs: function(args, methodName) { applyArgs(args, methodName) {
if (this.ready) return this[methodName].apply(this, args); if (this.ready) return this[methodName](...args);
this.queuedData = this.queuedData || []; this.queuedData = this.queuedData || [];
this.queuedData.push(args); this.queuedData.push(args);
},
_addData: function(trigger, data) { return this.ready;
this._processData(trigger, data, 'addData'); }
},
processAddData(trigger, data) {
this.processData(trigger, data, 'addData');
}
_setData: function(trigger, data) { processSetData(trigger, data) {
this._processData(trigger, data, 'setData'); this.processData(trigger, data, 'setData');
}, }
_processData: function(trigger, data, methodName) { processData(trigger, data, methodName) {
this.hooks.forEach((hook) => { this.hooks.forEach((hook) => {
if (Array.isArray(trigger)) hook.list[methodName](trigger); if (Array.isArray(trigger)) hook.list[methodName](trigger);
if (hook.trigger.id === trigger) hook.list[methodName](data); if (hook.trigger.id === trigger) hook.list[methodName](data);
}); });
}, }
addEvents: function() { addEvents() {
this.eventWrapper.documentClicked = this.documentClicked.bind(this) this.eventWrapper.documentClicked = this.documentClicked.bind(this);
document.addEventListener('click', this.eventWrapper.documentClicked); document.addEventListener('click', this.eventWrapper.documentClicked);
}, }
documentClicked: function(e) { documentClicked(e) {
let thisTag = e.target; let thisTag = e.target;
if (thisTag.tagName !== 'UL') thisTag = utils.closest(thisTag, 'UL'); if (thisTag.tagName !== 'UL') thisTag = utils.closest(thisTag, 'UL');
if (utils.isDropDownParts(thisTag, this.hooks) || utils.isDropDownParts(e.target, this.hooks)) return; if (utils.isDropDownParts(thisTag, this.hooks)) return;
if (utils.isDropDownParts(e.target, this.hooks)) return;
this.hooks.forEach(hook => hook.list.hide()); this.hooks.forEach(hook => hook.list.hide());
}, }
removeEvents: function(){ removeEvents() {
document.removeEventListener('click', this.eventWrapper.documentClicked); document.removeEventListener('click', this.eventWrapper.documentClicked);
}, }
changeHookList: function(trigger, list, plugins, config) {
const availableTrigger = typeof trigger === 'string' ? document.getElementById(trigger) : trigger;
changeHookList(trigger, list, plugins, config) {
const availableTrigger = typeof trigger === 'string' ? document.getElementById(trigger) : trigger;
this.hooks.forEach((hook, i) => { this.hooks.forEach((hook, i) => {
hook.list.list.dataset.dropdownActive = false; const aHook = hook;
aHook.list.list.dataset.dropdownActive = false;
if (hook.trigger !== availableTrigger) return; if (aHook.trigger !== availableTrigger) return;
hook.destroy(); aHook.destroy();
this.hooks.splice(i, 1); this.hooks.splice(i, 1);
this.addHook(availableTrigger, list, plugins, config); this.addHook(availableTrigger, list, plugins, config);
}); });
}, }
addHook: function(hook, list, plugins, config) { addHook(hook, list, plugins, config) {
const availableHook = typeof hook === 'string' ? document.querySelector(hook) : hook; const availableHook = typeof hook === 'string' ? document.querySelector(hook) : hook;
let availableList; let availableList;
...@@ -111,18 +111,18 @@ Object.assign(DropLab.prototype, { ...@@ -111,18 +111,18 @@ Object.assign(DropLab.prototype, {
this.hooks.push(new HookObject(availableHook, availableList, plugins, config)); this.hooks.push(new HookObject(availableHook, availableList, plugins, config));
return this; return this;
}, }
addHooks: function(hooks, plugins, config) { addHooks(hooks, plugins, config) {
hooks.forEach(hook => this.addHook(hook, null, plugins, config)); hooks.forEach(hook => this.addHook(hook, null, plugins, config));
return this; return this;
}, }
setConfig: function(obj){ setConfig(obj) {
this.config = obj; this.config = obj;
}, }
fireReady: function() { fireReady() {
const readyEvent = new CustomEvent('ready.dl', { const readyEvent = new CustomEvent('ready.dl', {
detail: { detail: {
dropdown: this, dropdown: this,
...@@ -131,10 +131,14 @@ Object.assign(DropLab.prototype, { ...@@ -131,10 +131,14 @@ Object.assign(DropLab.prototype, {
document.dispatchEvent(readyEvent); document.dispatchEvent(readyEvent);
this.ready = true; this.ready = true;
}, }
init: function (hook, list, plugins, config) { init(hook, list, plugins, config) {
hook ? this.addHook(hook, list, plugins, config) : this.loadStatic(); if (hook) {
this.addHook(hook, list, plugins, config);
} else {
this.loadStatic();
}
this.addEvents(); this.addEvents();
...@@ -146,7 +150,7 @@ Object.assign(DropLab.prototype, { ...@@ -146,7 +150,7 @@ Object.assign(DropLab.prototype, {
this.queuedData = []; this.queuedData = [];
return this; return this;
}, }
}); }
export default DropLab; export default DropLab;
/* eslint-disable */
import DropDown from './drop_down'; import DropDown from './drop_down';
var Hook = function(trigger, list, plugins, config){ class Hook {
this.trigger = trigger; constructor(trigger, list, plugins, config) {
this.list = new DropDown(list); this.trigger = trigger;
this.type = 'Hook'; this.list = new DropDown(list);
this.event = 'click'; this.type = 'Hook';
this.plugins = plugins || []; this.event = 'click';
this.config = config || {}; this.plugins = plugins || [];
this.id = trigger.id; this.config = config || {};
}; this.id = trigger.id;
}
Object.assign(Hook.prototype, { }
addEvents: function(){},
constructor: Hook,
});
export default Hook; export default Hook;
/* eslint-disable */
import Hook from './hook'; import Hook from './hook';
var HookButton = function(trigger, list, plugins, config) { class HookButton extends Hook {
Hook.call(this, trigger, list, plugins, config); constructor(trigger, list, plugins, config) {
super(trigger, list, plugins, config);
this.type = 'button';
this.event = 'click';
this.eventWrapper = {}; this.type = 'button';
this.event = 'click';
this.addEvents(); this.eventWrapper = {};
this.addPlugins();
};
HookButton.prototype = Object.create(Hook.prototype); this.addEvents();
this.addPlugins();
}
Object.assign(HookButton.prototype, { addPlugins() {
addPlugins: function() {
this.plugins.forEach(plugin => plugin.init(this)); this.plugins.forEach(plugin => plugin.init(this));
}, }
clicked: function(e){ clicked(e) {
var buttonEvent = new CustomEvent('click.dl', { const buttonEvent = new CustomEvent('click.dl', {
detail: { detail: {
hook: this, hook: this,
}, },
bubbles: true, bubbles: true,
cancelable: true cancelable: true,
}); });
e.target.dispatchEvent(buttonEvent); e.target.dispatchEvent(buttonEvent);
this.list.toggle(); this.list.toggle();
}, }
addEvents: function(){ addEvents() {
this.eventWrapper.clicked = this.clicked.bind(this); this.eventWrapper.clicked = this.clicked.bind(this);
this.trigger.addEventListener('click', this.eventWrapper.clicked); this.trigger.addEventListener('click', this.eventWrapper.clicked);
}, }
removeEvents: function(){ removeEvents() {
this.trigger.removeEventListener('click', this.eventWrapper.clicked); this.trigger.removeEventListener('click', this.eventWrapper.clicked);
}, }
restoreInitialState: function() { restoreInitialState() {
this.list.list.innerHTML = this.list.initialState; this.list.list.innerHTML = this.list.initialState;
}, }
removePlugins: function() { removePlugins() {
this.plugins.forEach(plugin => plugin.destroy()); this.plugins.forEach(plugin => plugin.destroy());
}, }
destroy: function() { destroy() {
this.restoreInitialState(); this.restoreInitialState();
this.removeEvents(); this.removeEvents();
this.removePlugins(); this.removePlugins();
}, }
}
constructor: HookButton,
});
export default HookButton; export default HookButton;
/* eslint-disable */
import Hook from './hook'; import Hook from './hook';
var HookInput = function(trigger, list, plugins, config) { class HookInput extends Hook {
Hook.call(this, trigger, list, plugins, config); constructor(trigger, list, plugins, config) {
super(trigger, list, plugins, config);
this.type = 'input'; this.type = 'input';
this.event = 'input'; this.event = 'input';
this.eventWrapper = {}; this.eventWrapper = {};
this.addEvents(); this.addEvents();
this.addPlugins(); this.addPlugins();
}; }
Object.assign(HookInput.prototype, { addPlugins() {
addPlugins: function() {
this.plugins.forEach(plugin => plugin.init(this)); this.plugins.forEach(plugin => plugin.init(this));
}, }
addEvents: function(){ addEvents() {
this.eventWrapper.mousedown = this.mousedown.bind(this); this.eventWrapper.mousedown = this.mousedown.bind(this);
this.eventWrapper.input = this.input.bind(this); this.eventWrapper.input = this.input.bind(this);
this.eventWrapper.keyup = this.keyup.bind(this); this.eventWrapper.keyup = this.keyup.bind(this);
...@@ -29,19 +27,19 @@ Object.assign(HookInput.prototype, { ...@@ -29,19 +27,19 @@ Object.assign(HookInput.prototype, {
this.trigger.addEventListener('input', this.eventWrapper.input); this.trigger.addEventListener('input', this.eventWrapper.input);
this.trigger.addEventListener('keyup', this.eventWrapper.keyup); this.trigger.addEventListener('keyup', this.eventWrapper.keyup);
this.trigger.addEventListener('keydown', this.eventWrapper.keydown); this.trigger.addEventListener('keydown', this.eventWrapper.keydown);
}, }
removeEvents: function() { removeEvents() {
this.hasRemovedEvents = true; this.hasRemovedEvents = true;
this.trigger.removeEventListener('mousedown', this.eventWrapper.mousedown); this.trigger.removeEventListener('mousedown', this.eventWrapper.mousedown);
this.trigger.removeEventListener('input', this.eventWrapper.input); this.trigger.removeEventListener('input', this.eventWrapper.input);
this.trigger.removeEventListener('keyup', this.eventWrapper.keyup); this.trigger.removeEventListener('keyup', this.eventWrapper.keyup);
this.trigger.removeEventListener('keydown', this.eventWrapper.keydown); this.trigger.removeEventListener('keydown', this.eventWrapper.keydown);
}, }
input: function(e) { input(e) {
if(this.hasRemovedEvents) return; if (this.hasRemovedEvents) return;
this.list.show(); this.list.show();
...@@ -51,12 +49,12 @@ Object.assign(HookInput.prototype, { ...@@ -51,12 +49,12 @@ Object.assign(HookInput.prototype, {
text: e.target.value, text: e.target.value,
}, },
bubbles: true, bubbles: true,
cancelable: true cancelable: true,
}); });
e.target.dispatchEvent(inputEvent); e.target.dispatchEvent(inputEvent);
}, }
mousedown: function(e) { mousedown(e) {
if (this.hasRemovedEvents) return; if (this.hasRemovedEvents) return;
const mouseEvent = new CustomEvent('mousedown.dl', { const mouseEvent = new CustomEvent('mousedown.dl', {
...@@ -68,21 +66,21 @@ Object.assign(HookInput.prototype, { ...@@ -68,21 +66,21 @@ Object.assign(HookInput.prototype, {
cancelable: true, cancelable: true,
}); });
e.target.dispatchEvent(mouseEvent); e.target.dispatchEvent(mouseEvent);
}, }
keyup: function(e) { keyup(e) {
if (this.hasRemovedEvents) return; if (this.hasRemovedEvents) return;
this.keyEvent(e, 'keyup.dl'); this.keyEvent(e, 'keyup.dl');
}, }
keydown: function(e) { keydown(e) {
if (this.hasRemovedEvents) return; if (this.hasRemovedEvents) return;
this.keyEvent(e, 'keydown.dl'); this.keyEvent(e, 'keydown.dl');
}, }
keyEvent: function(e, eventName) { keyEvent(e, eventName) {
this.list.show(); this.list.show();
const keyEvent = new CustomEvent(eventName, { const keyEvent = new CustomEvent(eventName, {
...@@ -96,17 +94,17 @@ Object.assign(HookInput.prototype, { ...@@ -96,17 +94,17 @@ Object.assign(HookInput.prototype, {
cancelable: true, cancelable: true,
}); });
e.target.dispatchEvent(keyEvent); e.target.dispatchEvent(keyEvent);
}, }
restoreInitialState: function() { restoreInitialState() {
this.list.list.innerHTML = this.list.initialState; this.list.list.innerHTML = this.list.initialState;
}, }
removePlugins: function() { removePlugins() {
this.plugins.forEach(plugin => plugin.destroy()); this.plugins.forEach(plugin => plugin.destroy());
}, }
destroy: function() { destroy() {
this.restoreInitialState(); this.restoreInitialState();
this.removeEvents(); this.removeEvents();
...@@ -114,6 +112,6 @@ Object.assign(HookInput.prototype, { ...@@ -114,6 +112,6 @@ Object.assign(HookInput.prototype, {
this.list.destroy(); this.list.destroy();
} }
}); }
export default HookInput; export default HookInput;
/* eslint-disable */
import DropDown from '~/droplab/drop_down'; import DropDown from '~/droplab/drop_down';
import utils from '~/droplab/utils'; import utils from '~/droplab/utils';
import { SELECTED_CLASS, IGNORE_CLASS } from '~/droplab/constants'; import { SELECTED_CLASS, IGNORE_CLASS } from '~/droplab/constants';
...@@ -17,7 +15,7 @@ describe('DropDown', function () { ...@@ -17,7 +15,7 @@ describe('DropDown', function () {
it('sets the .hidden property to true', function () { it('sets the .hidden property to true', function () {
expect(this.dropdown.hidden).toBe(true); expect(this.dropdown.hidden).toBe(true);
}) });
it('sets the .list property', function () { it('sets the .list property', function () {
expect(this.dropdown.list).toBe(this.list); expect(this.dropdown.list).toBe(this.list);
...@@ -152,7 +150,7 @@ describe('DropDown', function () { ...@@ -152,7 +150,7 @@ describe('DropDown', function () {
it('should call addSelectedClass', function () { it('should call addSelectedClass', function () {
expect(this.dropdown.addSelectedClass).toHaveBeenCalledWith(this.closestElement); expect(this.dropdown.addSelectedClass).toHaveBeenCalledWith(this.closestElement);
}) });
it('should call .preventDefault', function () { it('should call .preventDefault', function () {
expect(this.event.preventDefault).toHaveBeenCalled(); expect(this.event.preventDefault).toHaveBeenCalled();
...@@ -293,36 +291,6 @@ describe('DropDown', function () { ...@@ -293,36 +291,6 @@ describe('DropDown', function () {
}); });
}); });
describe('toggle', function () {
beforeEach(function () {
this.dropdown = { hidden: true, show: () => {}, hide: () => {} };
spyOn(this.dropdown, 'show');
spyOn(this.dropdown, 'hide');
DropDown.prototype.toggle.call(this.dropdown);
});
it('should call .show if hidden is true', function () {
expect(this.dropdown.show).toHaveBeenCalled();
});
describe('if hidden is false', function () {
beforeEach(function () {
this.dropdown = { hidden: false, show: () => {}, hide: () => {} };
spyOn(this.dropdown, 'show');
spyOn(this.dropdown, 'hide');
DropDown.prototype.toggle.call(this.dropdown);
});
it('should call .show if hidden is true', function () {
expect(this.dropdown.hide).toHaveBeenCalled();
});
});
});
describe('setData', function () { describe('setData', function () {
beforeEach(function () { beforeEach(function () {
this.dropdown = { render: () => {} }; this.dropdown = { render: () => {} };
...@@ -399,7 +367,7 @@ describe('DropDown', function () { ...@@ -399,7 +367,7 @@ describe('DropDown', function () {
expect(this.data.map).toHaveBeenCalledWith(jasmine.any(Function)); expect(this.data.map).toHaveBeenCalledWith(jasmine.any(Function));
}); });
it('should call .renderChildren for each data item', function() { it('should call .renderChildren for each data item', function () {
expect(this.dropdown.renderChildren.calls.count()).toBe(this.data.length); expect(this.dropdown.renderChildren.calls.count()).toBe(this.data.length);
}); });
...@@ -407,7 +375,7 @@ describe('DropDown', function () { ...@@ -407,7 +375,7 @@ describe('DropDown', function () {
expect(this.renderableList.innerHTML).toBe('01'); expect(this.renderableList.innerHTML).toBe('01');
}); });
describe('if no data argument is passed' , function () { describe('if no data argument is passed', function () {
beforeEach(function () { beforeEach(function () {
this.data.map.calls.reset(); this.data.map.calls.reset();
this.dropdown.renderChildren.calls.reset(); this.dropdown.renderChildren.calls.reset();
...@@ -446,14 +414,14 @@ describe('DropDown', function () { ...@@ -446,14 +414,14 @@ describe('DropDown', function () {
describe('renderChildren', function () { describe('renderChildren', function () {
beforeEach(function () { beforeEach(function () {
this.templateString = 'templateString'; this.templateString = 'templateString';
this.dropdown = { setImagesSrc: () => {}, templateString: this.templateString }; this.dropdown = { templateString: this.templateString };
this.data = { droplab_hidden: true }; this.data = { droplab_hidden: true };
this.html = 'html'; this.html = 'html';
this.template = { firstChild: { outerHTML: 'outerHTML', style: {} } }; this.template = { firstChild: { outerHTML: 'outerHTML', style: {} } };
spyOn(utils, 'template').and.returnValue(this.html); spyOn(utils, 'template').and.returnValue(this.html);
spyOn(document, 'createElement').and.returnValue(this.template); spyOn(document, 'createElement').and.returnValue(this.template);
spyOn(this.dropdown, 'setImagesSrc'); spyOn(DropDown, 'setImagesSrc');
this.renderChildren = DropDown.prototype.renderChildren.call(this.dropdown, this.data); this.renderChildren = DropDown.prototype.renderChildren.call(this.dropdown, this.data);
}); });
...@@ -471,7 +439,7 @@ describe('DropDown', function () { ...@@ -471,7 +439,7 @@ describe('DropDown', function () {
}); });
it('should call .setImagesSrc with the template', function () { it('should call .setImagesSrc with the template', function () {
expect(this.dropdown.setImagesSrc).toHaveBeenCalledWith(this.template); expect(DropDown.setImagesSrc).toHaveBeenCalledWith(this.template);
}); });
it('should set the template display to none', function () { it('should set the template display to none', function () {
...@@ -496,12 +464,11 @@ describe('DropDown', function () { ...@@ -496,12 +464,11 @@ describe('DropDown', function () {
describe('setImagesSrc', function () { describe('setImagesSrc', function () {
beforeEach(function () { beforeEach(function () {
this.dropdown = {};
this.template = { querySelectorAll: () => {} }; this.template = { querySelectorAll: () => {} };
spyOn(this.template, 'querySelectorAll').and.returnValue([]); spyOn(this.template, 'querySelectorAll').and.returnValue([]);
DropDown.prototype.setImagesSrc.call(this.dropdown, this.template); DropDown.setImagesSrc(this.template);
}); });
it('should call .querySelectorAll', function () { it('should call .querySelectorAll', function () {
...@@ -562,7 +529,7 @@ describe('DropDown', function () { ...@@ -562,7 +529,7 @@ describe('DropDown', function () {
describe('toggle', function () { describe('toggle', function () {
beforeEach(function () { beforeEach(function () {
this.hidden = true this.hidden = true;
this.dropdown = { hidden: this.hidden, show: () => {}, hide: () => {} }; this.dropdown = { hidden: this.hidden, show: () => {}, hide: () => {} };
spyOn(this.dropdown, 'show'); spyOn(this.dropdown, 'show');
...@@ -577,7 +544,7 @@ describe('DropDown', function () { ...@@ -577,7 +544,7 @@ describe('DropDown', function () {
describe('if .hidden is false', function () { describe('if .hidden is false', function () {
beforeEach(function () { beforeEach(function () {
this.hidden = false this.hidden = false;
this.dropdown = { hidden: this.hidden, show: () => {}, hide: () => {} }; this.dropdown = { hidden: this.hidden, show: () => {}, hide: () => {} };
spyOn(this.dropdown, 'show'); spyOn(this.dropdown, 'show');
......
/* eslint-disable */
import Hook from '~/droplab/hook'; import Hook from '~/droplab/hook';
import * as dropdownSrc from '~/droplab/drop_down'; import * as dropdownSrc from '~/droplab/drop_down';
...@@ -73,10 +71,4 @@ describe('Hook', function () { ...@@ -73,10 +71,4 @@ describe('Hook', function () {
}); });
}); });
}); });
describe('addEvents', function () {
it('should exist', function () {
expect(Hook.prototype.hasOwnProperty('addEvents')).toBe(true);
});
});
}); });
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment