From 3351e052b6a9ccff4bb930a885665c20e1c51c3a Mon Sep 17 00:00:00 2001 From: Jeffrey Espiritu Date: Thu, 31 Jan 2019 17:33:39 -0500 Subject: [PATCH] Add test: should slide the handle from 5 to 3 --- test/specs/TouchCapableSpec.js | 135 +++++++++++++++++++++++++++++++++ 1 file changed, 135 insertions(+) create mode 100644 test/specs/TouchCapableSpec.js diff --git a/test/specs/TouchCapableSpec.js b/test/specs/TouchCapableSpec.js new file mode 100644 index 00000000..b0cb2adc --- /dev/null +++ b/test/specs/TouchCapableSpec.js @@ -0,0 +1,135 @@ +/* + list can be either [[x, y], [x, y]] or [x, y] +*/ +function createTouchList(target, list) { + if (Array.isArray(list) && list[0] && !Array.isArray(list[0])) { + list = [list]; + } + list = list.map(function (entry, index) { + var x = entry[0], y = entry[1], id = entry[2] ? entry[2] : index + 1; + return createTouch(x, y, target, id); + }); + return document.createTouchList.apply(document, list); +} + +function createTouch(x, y, target, id) { + return document.createTouch(window, target, + id || 1, //identifier + x, //pageX / clientX + y, //pageY / clientY + x, //screenX + y //screenY + ); +} + +function initTouchEvent(touchEvent, type, touches) { + var touch1 = touches[0]; + return touchEvent.initTouchEvent( + touches, //touches + touches, //targetTouches + touches, //changedTouches + type, //type + window, //view + touch1.screenX, //screenX + touch1.screenY, //screenY + touch1.clientX, //clientX + touch1.clientY, //clientY + false, //ctrlKey + false, //altKey + false, //shiftKey + false //metaKey + ); +} + +function createTouchEvent(elem, type, touches) { + var touchEvent = document.createEvent('TouchEvent'); + if (Array.isArray(touches)) { + touches = createTouchList(elem, touches); + } + + initTouchEvent(touchEvent, type, touches); + return touchEvent; +} + +function calcTouchEventCoords(element) { + var elementBB = element.getBoundingClientRect(); + + return { + x: elementBB.left, + y: elementBB.top + }; +} + +describe("Touch Capable Tests", function() { + var touch; + var coords; + var touchStart; + var touchMove; + var touchEnd; + var $testSlider; + var sliderInst; + var inputId = 'testSlider1'; + var sliderId; + var sliderOptions; + + beforeEach(function() { + sliderId = 'mySlider'; + + sliderOptions = { + id: sliderId, + step: 1, + value: 5, + ticks: [0, 3, 5, 7, 10] + }; + + // Initialize the slider + $testSlider = $('#' + inputId).slider(sliderOptions); + + // Enable touch + window.ontouchstart = true; + + // Get slider instance + sliderInst = $testSlider.data('slider'); + + // Calculate and store the 'clientX' for each tick in the slider + // tickOffsets = sliderInst.ticks.map(function (tick) { + // return tick.offsetLeft + sliderInst.sliderElem.offsetLeft; + // }); + }); + + afterEach(function() { + window.ontouchstart = null; + + if ($testSlider) { + $testSlider.slider('destroy'); + $testSlider = null; + } + }); + + // 0 1 2 3 4 + // 0 3 5 7 10 + it("should slide the handle from 5 to 3", function(done) { + var sliderElem = $testSlider.slider('getElement'); + $testSlider.on('slideStop', function() { + var value = $testSlider.slider('getValue'); + expect(value).toBe(3); + done(); + }); + + var tick = sliderInst.ticks[2]; // 5 + var sliderCoords = calcTouchEventCoords(sliderElem); + var coords = [sliderCoords.x + tick.offsetLeft, sliderCoords.y]; + touchStart = createTouchEvent(sliderElem, 'touchstart', coords); + + tick = sliderInst.ticks[1]; // 3 + coords = coords = [sliderCoords.x + tick.offsetLeft, sliderCoords.y]; + touchMove = createTouchEvent(sliderElem, 'touchmove', coords); + + touchEnd = createTouchEvent(sliderElem, 'touchend', coords); + + sliderElem.dispatchEvent(touchStart); + sliderElem.dispatchEvent(touchMove); + sliderElem.dispatchEvent(touchEnd); + }); + +}); \ No newline at end of file