From 43d1e2cdd26a52cc22045ce3e04cea9ada34bf50 Mon Sep 17 00:00:00 2001 From: Marius Olbertz Date: Wed, 12 Oct 2016 17:03:23 +0200 Subject: [PATCH] Added unit tests for Slider. --- test/javascript/components/slider.js | 170 ++++++++++++++++++++++++--- 1 file changed, 153 insertions(+), 17 deletions(-) diff --git a/test/javascript/components/slider.js b/test/javascript/components/slider.js index 419873315..22c900357 100644 --- a/test/javascript/components/slider.js +++ b/test/javascript/components/slider.js @@ -1,20 +1,156 @@ describe('Slider', function() { - var plugin; - var $html; - - // afterEach(function() { - // plugin.destroy(); - // $html.remove(); - // }); - - describe('constructor()', function() { - // it('', function() { - // $html = $('').appendTo('body'); - // plugin = new Foundation.Slider($html, {}); - - // plugin.$element.should.be.an('object'); - // plugin.options.should.be.an('object'); - // }); - }); + var plugin; + var $html; + var template = `
+ + + +
`; + + Foundation.Slider.defaults.moveTime = 0; + Foundation.Slider.defaults.changedDelay = 0; + + afterEach(function(done) { + // Timeout needed because even with changeDelay = 0 the changed.zf.slider event may be fired after this hook + plugin.destroy(); + $html.remove(); + done(); + }); + + describe('constructor()', function() { + it('stores the element and plugin options', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {}); + + plugin.$element.should.be.an('object'); + plugin.options.should.be.an('object'); + }); + }); + + describe('init()', function() { + it('stores handle, inout and fill elements', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {}); + + plugin.$handle.should.be.an('object'); + plugin.$input.should.be.an('object'); + plugin.$fill.should.be.an('object'); + }); + it('stores two handle and input elements for two sided slider', function() { + $html = $(template).append('') + .appendTo('body'); + plugin = new Foundation.Slider($html, {doubleSided: true}); + + plugin.$handle2.should.be.an('object'); + plugin.$input2.should.be.an('object'); + }); + it('is disabled when disable option is true', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {disabled: true}); + + $html.should.have.class('disabled'); + }); + }); + + describe('setHandlePos()', function() { + it('positions the handle', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {}); + + plugin._setHandlePos(plugin.$handle, 10, true); + + plugin.$handle[0].style.left.should.not.be.equal(''); + }); + it('does nothing if disabled option is true', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {disabled: true}); + + plugin._setHandlePos(plugin.$handle, 10, true); + + plugin.$handle[0].style.left.should.be.equal(''); + }); + it('fires changed.zf.slider event', function(done) { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {changedDelay: 50}); + + $html.on('changed.zf.slider', function(e, $handle) { + $handle[0].should.be.equal(plugin.$handle[0]); + done(); + }); + + // Rapidly change to see if event fires only once + for (let i = 0; i < 5; i++) { + setTimeout(function() { + plugin._setHandlePos(plugin.$handle, i * 10, true); + }, i * 20); + } + }); + it('fires moved.zf.slider event', function(done) { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {}); + + let timesCallbackCalled = 0; + $html.on('moved.zf.slider', function(e, $handle) { + if (++timesCallbackCalled === 5) { + $handle[0].should.be.equal(plugin.$handle[0]); + done(); + } + }); + + // Rapidly change to see if event fires multiple times + for (let i = 0; i < 5; i++) { + setTimeout(function() { + plugin._setHandlePos(plugin.$handle, i * 10, true); + }, i * 20); + } + }); + }); + + describe('setValues()', function() { + it('updates ARIA attributes', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {}); + + plugin._setValues(plugin.$handle, 10); + + plugin.$handle.should.have.attr('aria-valuenow', '10'); + }); + it('updates input value', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {}); + + plugin._setValues(plugin.$handle, 10); + + plugin.$input.val().should.have.be.equal('10'); + }); + }); + + describe('setInitAttr()', function() { + it('adds ARIA attributes to handle', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, { + initialStart: 50, + end: 70, + start: 20, + vertical: true + }); + + plugin.$handle.should.have.attr('role', 'slider'); + plugin.$handle.should.have.attr('aria-controls', plugin.$handle.attr('id')); + plugin.$handle.should.have.attr('aria-valuemax', '70'); + plugin.$handle.should.have.attr('aria-valuemin', '20'); + plugin.$handle.should.have.attr('aria-valuenow', '50'); + plugin.$handle.should.have.attr('aria-orientation', 'vertical'); + plugin.$handle.should.have.attr('tabindex', '0'); + }); + it('adds attributes to input', function() { + $html = $(template).appendTo('body'); + plugin = new Foundation.Slider($html, {}); + + plugin.$input.should.have.attr('max', '100'); + plugin.$input.should.have.attr('min', '0'); + plugin.$input.should.have.attr('step', '1'); + }); + }); }); \ No newline at end of file -- 2.47.2