diff --git a/src/Global.js b/src/Global.js
index 0e6ea080..3449d9cd 100644
--- a/src/Global.js
+++ b/src/Global.js
@@ -48,6 +48,7 @@ var Kinetic = {};
traceArrMax: 100,
dblClickWindow: 400,
pixelRatio: undefined,
+ enableThrottling: true,
// user agent
UA: (function() {
diff --git a/test/functional/DragAndDropEvents-test.js b/test/functional/DragAndDropEvents-test.js
index f87be8a3..f2df61f3 100644
--- a/test/functional/DragAndDropEvents-test.js
+++ b/test/functional/DragAndDropEvents-test.js
@@ -1,6 +1,6 @@
suite('DragAndDropEvents', function() {
// ======================================================
- test('test dragstart, dragmove, dragend', function() {
+ test('test dragstart, dragmove, dragend', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
@@ -89,51 +89,55 @@ suite('DragAndDropEvents', function() {
assert(!Kinetic.isDragging(), ' isDragging() should be false 5');
assert(Kinetic.isDragReady(), ' isDragReady()) should be true 6');
- stage._mousemove({
- clientX: 100,
- clientY: 98 + top
- });
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 100,
+ clientY: 98 + top
+ });
- assert(Kinetic.isDragging(), ' isDragging() should be true 7');
- assert(Kinetic.isDragReady(), ' isDragReady()) should be true 8');
+ assert(Kinetic.isDragging(), ' isDragging() should be true 7');
+ assert(Kinetic.isDragReady(), ' isDragReady()) should be true 8');
- assert(dragStart, 'dragstart event was not triggered 9');
- //assert.equal(dragMove, 'dragmove event was not triggered');
- assert(!dragEnd, 'dragend event should not have been triggered 10');
+ assert(dragStart, 'dragstart event was not triggered 9');
+ //assert.equal(dragMove, 'dragmove event was not triggered');
+ assert(!dragEnd, 'dragend event should not have been triggered 10');
- Kinetic.DD._endDragBefore();
- stage._mouseup({
- clientX: 100,
- clientY: 98 + top
- });
- Kinetic.DD._endDragAfter({dragEndNode:circle});
+ Kinetic.DD._endDragBefore();
+ stage._mouseup({
+ clientX: 100,
+ clientY: 98 + top
+ });
+ Kinetic.DD._endDragAfter({dragEndNode:circle});
- assert(dragStart, 'dragstart event was not triggered 11');
- assert(dragMove, 'dragmove event was not triggered 12');
- assert(dragEnd, 'dragend event was not triggered 13');
+ assert(dragStart, 'dragstart event was not triggered 11');
+ assert(dragMove, 'dragmove event was not triggered 12');
+ assert(dragEnd, 'dragend event was not triggered 13');
- assert.equal(events.toString(), 'mouseup,dragend', 'mouseup should occur before dragend 14');
+ assert.equal(events.toString(), 'mouseup,dragend', 'mouseup should occur before dragend 14');
- assert(!Kinetic.isDragging(), ' isDragging() should be false 15');
- assert(!Kinetic.isDragReady(), ' isDragReady()) should be false 16');
+ assert(!Kinetic.isDragging(), ' isDragging() should be false 15');
+ assert(!Kinetic.isDragReady(), ' isDragReady()) should be false 16');
- //console.log(greenCircle.getPosition());
- //console.log(circle.getPosition());
+ //console.log(greenCircle.getPosition());
+ //console.log(circle.getPosition());
- assert.equal(greenCircle.getX(), 40, 'green circle x should be 40');
- assert.equal(greenCircle.getY(), 40, 'green circle y should be 40');
- assert.equal(circle.getX(), 100, 'circle x should be 100');
- assert.equal(circle.getY(), 100, 'circle y should be 100');
+ assert.equal(greenCircle.getX(), 40, 'green circle x should be 40');
+ assert.equal(greenCircle.getY(), 40, 'green circle y should be 40');
+ assert.equal(circle.getX(), 100, 'circle x should be 100');
+ assert.equal(circle.getY(), 100, 'circle y should be 100');
- showHit(layer);
+ showHit(layer);
+
+ done();
+ }, 20);
});
// ======================================================
- test('destroy shape while dragging', function() {
+ test('destroy shape while dragging', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
@@ -194,31 +198,33 @@ suite('DragAndDropEvents', function() {
assert(!circle.isDragging(), 'circle should not be dragging');
- stage._mousemove({
- clientX: 100,
- clientY: 98 + top
- });
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 100,
+ clientY: 98 + top
+ });
- assert(circle.isDragging(), 'circle should be dragging');
- assert(!dragEnd, 'dragEnd should not have fired yet');
+ assert(circle.isDragging(), 'circle should be dragging');
+ assert(!dragEnd, 'dragEnd should not have fired yet');
- // at this point, we are in drag and drop mode
+ // at this point, we are in drag and drop mode
- // removing or destroying the circle should trigger dragend
- circle.destroy();
- layer.draw();
-
- assert(!circle.isDragging(), 'destroying circle should stop drag and drop');
- assert(dragEnd, 'dragEnd should have fired');
+ // removing or destroying the circle should trigger dragend
+ circle.destroy();
+ layer.draw();
+ assert(!circle.isDragging(), 'destroying circle should stop drag and drop');
+ assert(dragEnd, 'dragEnd should have fired');
+ done();
+ }, 20);
});
// ======================================================
- test('click should not occur after drag and drop', function() {
+ test('click should not occur after drag and drop', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
@@ -253,24 +259,28 @@ suite('DragAndDropEvents', function() {
clientY: 40 + top
});
- stage._mousemove({
- clientX: 100,
- clientY: 100 + top
- });
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 100,
+ clientY: 100 + top
+ });
- Kinetic.DD._endDragBefore();
- stage._mouseup({
- clientX: 100,
- clientY: 100 + top
- });
- Kinetic.DD._endDragAfter({dragEndNode:circle});
+ Kinetic.DD._endDragBefore();
+ stage._mouseup({
+ clientX: 100,
+ clientY: 100 + top
+ });
+ Kinetic.DD._endDragAfter({dragEndNode:circle});
- assert(!clicked, 'click event should not have been fired');
+ assert(!clicked, 'click event should not have been fired');
+
+ done();
+ }, 20);
});
// ======================================================
- test('cancel drag and drop by setting draggable to false', function() {
+ test('cancel drag and drop by setting draggable to false', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
@@ -316,24 +326,27 @@ suite('DragAndDropEvents', function() {
clientY: 100 + top
});
- stage._mousemove({
- clientX: 100,
- clientY: 100 + top
- });
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 100,
+ clientY: 100 + top
+ });
- Kinetic.DD._endDragBefore();
- stage._mouseup({
- clientX: 100,
- clientY: 100 + top
- });
- Kinetic.DD._endDragAfter({dragEndNode:circle});
+ Kinetic.DD._endDragBefore();
+ stage._mouseup({
+ clientX: 100,
+ clientY: 100 + top
+ });
+ Kinetic.DD._endDragAfter({dragEndNode:circle});
- assert.equal(circle.getPosition().x, 380, 'circle x should be 380');
- assert.equal(circle.getPosition().y, 100, 'circle y should be 100');
+ assert.equal(circle.getPosition().x, 380, 'circle x should be 380');
+ assert.equal(circle.getPosition().y, 100, 'circle y should be 100');
+ done();
+ }, 20);
});
// ======================================================
- test('drag and drop layer', function() {
+ test('drag and drop layer', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer({
drawFunc: function() {
@@ -378,27 +391,31 @@ suite('DragAndDropEvents', function() {
clientY: 96 + top
});
- stage._mousemove({
- clientX: 210,
- clientY: 109 + top
- });
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 210,
+ clientY: 109 + top
+ });
- Kinetic.DD._endDragBefore();
- stage._mouseup({
- clientX: 210,
- clientY: 109 + top
- });
- Kinetic.DD._endDragAfter({dragEndNode:circle2});
+ Kinetic.DD._endDragBefore();
+ stage._mouseup({
+ clientX: 210,
+ clientY: 109 + top
+ });
+ Kinetic.DD._endDragAfter({dragEndNode:circle2});
- //console.log(layer.getPosition())
+ //console.log(layer.getPosition())
- assert.equal(layer.getX(), -189, 'layer x should be -189');
- assert.equal(layer.getY(), 13, 'layer y should be 13');
+ assert.equal(layer.getX(), -189, 'layer x should be -189');
+ assert.equal(layer.getY(), 13, 'layer y should be 13');
+
+ done();
+ }, 20);
});
// ======================================================
- test('drag and drop stage', function() {
+ test('drag and drop stage', function(done) {
var container = document.createElement('div'),
stage = new Kinetic.Stage({
container: container,
@@ -436,21 +453,24 @@ suite('DragAndDropEvents', function() {
clientY: 100 + top
});
- stage._mousemove({
- clientX: 300,
- clientY: 110 + top
- });
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 300,
+ clientY: 110 + top
+ });
- Kinetic.DD._endDragBefore();
- stage._mouseup({
- clientX: 300,
- clientY: 110 + top
- });
- Kinetic.DD._endDragAfter();
+ Kinetic.DD._endDragBefore();
+ stage._mouseup({
+ clientX: 300,
+ clientY: 110 + top
+ });
+ Kinetic.DD._endDragAfter();
- assert.equal(stage.getX(), 300);
- assert.equal(stage.getY(), 10);
+ assert.equal(stage.getX(), 300);
+ assert.equal(stage.getY(), 10);
+ done();
+ }, 20);
});
});
\ No newline at end of file
diff --git a/test/functional/MouseEvents-test.js b/test/functional/MouseEvents-test.js
index 1347ecea..07ee78b3 100644
--- a/test/functional/MouseEvents-test.js
+++ b/test/functional/MouseEvents-test.js
@@ -1,7 +1,10 @@
suite('MouseEvents', function() {
+
+ // NOTE: disable throttling so these tests can run synchronously
+ Kinetic.enableThrottling = false;
// ======================================================
- test('stage content mouse events', function() {
+ test('stage content mouse events', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
@@ -112,26 +115,30 @@ suite('MouseEvents', function() {
assert.equal(stageContentMouseup, 3);
//assert.equal(stageContentDblClick, 1);
- stage._mousemove({
- clientX: 200,
- clientY: 1 + top
- });
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 200,
+ clientY: 1 + top
+ });
- assert.equal(stageContentMousemove, 1);
+ assert.equal(stageContentMousemove, 1);
- stage._mouseout({
- clientX: 0,
- clientY: 0
- });
+ stage._mouseout({
+ clientX: 0,
+ clientY: 0
+ });
- assert.equal(stageContentMouseout, 1);
+ assert.equal(stageContentMouseout, 1);
- stage._mouseover({
- clientX: 0,
- clientY: 0
- });
+ stage._mouseover({
+ clientX: 0,
+ clientY: 0
+ });
- assert.equal(stageContentMouseover, 1);
+ assert.equal(stageContentMouseover, 1);
+
+ done();
+ }, 20);
});
@@ -395,7 +402,7 @@ suite('MouseEvents', function() {
});
// ======================================================
- test('modify fill stroke and stroke width on hover with circle', function() {
+ test('modify fill stroke and stroke width on hover with circle', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer({
throttle: 999
@@ -433,30 +440,32 @@ suite('MouseEvents', function() {
assert.equal(circle.getFill(), 'red', 'circle fill should be red');
assert.equal(circle.getStroke(), 'black', 'circle stroke should be black');
- stage._mousemove({
- clientX: 377,
- clientY: 101 + top
- });
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 377,
+ clientY: 101 + top
+ });
- assert.equal(circle.getFill(), 'yellow', 'circle fill should be yellow');
- assert.equal(circle.getStroke(), 'purple', 'circle stroke should be purple');
+ assert.equal(circle.getFill(), 'yellow', 'circle fill should be yellow');
+ assert.equal(circle.getStroke(), 'purple', 'circle stroke should be purple');
- // move mouse back out of circle
- stage._mousemove({
- clientX: 157,
- clientY: 138 + top
- });
- stage._mousemove({
- clientX: 157,
- clientY: 138 + top
- });
+ setTimeout(function() {
+ // move mouse back out of circle
+ stage._mousemove({
+ clientX: 157,
+ clientY: 138 + top
+ });
- assert.equal(circle.getFill(), 'red', 'circle fill should be red');
- assert.equal(circle.getStroke(), 'black', 'circle stroke should be black');
+
+ assert.equal(circle.getFill(), 'red', 'circle fill should be red');
+ assert.equal(circle.getStroke(), 'black', 'circle stroke should be black');
+ done();
+ }, 20);
+ }, 20);
});
// ======================================================
- test('mousedown mouseup mouseover mouseout mousemove click dblclick', function() {
+ test('mousedown mouseup mouseover mouseout mousemove click dblclick', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
@@ -518,107 +527,110 @@ suite('MouseEvents', function() {
var top = stage.content.getBoundingClientRect().top;
- // move mouse to center of circle to trigger mouseover
- stage._mousemove({
- clientX: 290,
- clientY: 100 + top
- });
+ setTimeout(function() {
+ // move mouse to center of circle to trigger mouseover
+ stage._mousemove({
+ clientX: 290,
+ clientY: 100 + top
+ });
- assert(mouseover, '1) mouseover should be true');
- assert(!mousemove, '1) mousemove should be true');
- assert(!mousedown, '1) mousedown should be false');
- assert(!mouseup, '1) mouseup should be false');
- assert(!click, '1) click should be false');
- assert(!dblclick, '1) dblclick should be false');
- assert(!mouseout, '1) mouseout should be false');
+ assert(mouseover, '1) mouseover should be true');
+ assert(!mousemove, '1) mousemove should be true');
+ assert(!mousedown, '1) mousedown should be false');
+ assert(!mouseup, '1) mouseup should be false');
+ assert(!click, '1) click should be false');
+ assert(!dblclick, '1) dblclick should be false');
+ assert(!mouseout, '1) mouseout should be false');
- // move mouse again inside circle to trigger mousemove
- stage._mousemove({
- clientX: 290,
- clientY: 100 + top
- });
+ setTimeout(function() {
+ // move mouse again inside circle to trigger mousemove
+ stage._mousemove({
+ clientX: 290,
+ clientY: 100 + top
+ });
- assert(mouseover, '2) mouseover should be true');
- assert(mousemove, '2) mousemove should be true');
- assert(!mousedown, '2) mousedown should be false');
- assert(!mouseup, '2) mouseup should be false');
- assert(!click, '2) click should be false');
- assert(!dblclick, '2) dblclick should be false');
- assert(!mouseout, '2) mouseout should be false');
+ assert(mouseover, '2) mouseover should be true');
+ assert(mousemove, '2) mousemove should be true');
+ assert(!mousedown, '2) mousedown should be false');
+ assert(!mouseup, '2) mouseup should be false');
+ assert(!click, '2) click should be false');
+ assert(!dblclick, '2) dblclick should be false');
+ assert(!mouseout, '2) mouseout should be false');
- // mousedown inside circle
- stage._mousedown({
- clientX: 290,
- clientY: 100 + top
- });
+ // mousedown inside circle
+ stage._mousedown({
+ clientX: 290,
+ clientY: 100 + top
+ });
- assert(mouseover, '3) mouseover should be true');
- assert(mousemove, '3) mousemove should be true');
- assert(mousedown, '3) mousedown should be true');
- assert(!mouseup, '3) mouseup should be false');
- assert(!click, '3) click should be false');
- assert(!dblclick, '3) dblclick should be false');
- assert(!mouseout, '3) mouseout should be false');
+ assert(mouseover, '3) mouseover should be true');
+ assert(mousemove, '3) mousemove should be true');
+ assert(mousedown, '3) mousedown should be true');
+ assert(!mouseup, '3) mouseup should be false');
+ assert(!click, '3) click should be false');
+ assert(!dblclick, '3) dblclick should be false');
+ assert(!mouseout, '3) mouseout should be false');
- // mouseup inside circle
- stage._mouseup({
- clientX: 290,
- clientY: 100 + top
- });
+ // mouseup inside circle
+ stage._mouseup({
+ clientX: 290,
+ clientY: 100 + top
+ });
- assert(mouseover, '4) mouseover should be true');
- assert(mousemove, '4) mousemove should be true');
- assert(mousedown, '4) mousedown should be true');
- assert(mouseup, '4) mouseup should be true');
- assert(click, '4) click should be true');
- assert(!dblclick, '4) dblclick should be false');
- assert(!mouseout, '4) mouseout should be false');
+ assert(mouseover, '4) mouseover should be true');
+ assert(mousemove, '4) mousemove should be true');
+ assert(mousedown, '4) mousedown should be true');
+ assert(mouseup, '4) mouseup should be true');
+ assert(click, '4) click should be true');
+ assert(!dblclick, '4) dblclick should be false');
+ assert(!mouseout, '4) mouseout should be false');
- // mousedown inside circle
- stage._mousedown({
- clientX: 290,
- clientY: 100 + top
- });
+ // mousedown inside circle
+ stage._mousedown({
+ clientX: 290,
+ clientY: 100 + top
+ });
- assert(mouseover, '5) mouseover should be true');
- assert(mousemove, '5) mousemove should be true');
- assert(mousedown, '5) mousedown should be true');
- assert(mouseup, '5) mouseup should be true');
- assert(click, '5) click should be true');
- assert(!dblclick, '5) dblclick should be false');
- assert(!mouseout, '5) mouseout should be false');
+ assert(mouseover, '5) mouseover should be true');
+ assert(mousemove, '5) mousemove should be true');
+ assert(mousedown, '5) mousedown should be true');
+ assert(mouseup, '5) mouseup should be true');
+ assert(click, '5) click should be true');
+ assert(!dblclick, '5) dblclick should be false');
+ assert(!mouseout, '5) mouseout should be false');
- // mouseup inside circle to trigger double click
- stage._mouseup({
- clientX: 290,
- clientY: 100 + top
- });
+ // mouseup inside circle to trigger double click
+ stage._mouseup({
+ clientX: 290,
+ clientY: 100 + top
+ });
- assert(mouseover, '6) mouseover should be true');
- assert(mousemove, '6) mousemove should be true');
- assert(mousedown, '6) mousedown should be true');
- assert(mouseup, '6) mouseup should be true');
- assert(click, '6) click should be true');
- assert(dblclick, '6) dblclick should be true');
- assert(!mouseout, '6) mouseout should be false');
+ assert(mouseover, '6) mouseover should be true');
+ assert(mousemove, '6) mousemove should be true');
+ assert(mousedown, '6) mousedown should be true');
+ assert(mouseup, '6) mouseup should be true');
+ assert(click, '6) click should be true');
+ assert(dblclick, '6) dblclick should be true');
+ assert(!mouseout, '6) mouseout should be false');
- // move mouse outside of circle to trigger mouseout
- stage._mousemove({
- clientX: 0,
- clientY: 100 + top
- });
- stage._mousemove({
- clientX: 0,
- clientY: 100 + top
- });
+ setTimeout(function() {
+ // move mouse outside of circle to trigger mouseout
+ stage._mousemove({
+ clientX: 0,
+ clientY: 100 + top
+ });
- assert(mouseover, '7) mouseover should be true');
- assert(mousemove, '7) mousemove should be true');
- assert(mousedown, '7) mousedown should be true');
- assert(mouseup, '7) mouseup should be true');
- assert(click, '7) click should be true');
- assert(dblclick, '7) dblclick should be true');
- assert(mouseout, '7) mouseout should be true');
+ assert(mouseover, '7) mouseover should be true');
+ assert(mousemove, '7) mousemove should be true');
+ assert(mousedown, '7) mousedown should be true');
+ assert(mouseup, '7) mouseup should be true');
+ assert(click, '7) click should be true');
+ assert(dblclick, '7) dblclick should be true');
+ assert(mouseout, '7) mouseout should be true');
+ done();
+ }, 20);
+ }, 20);
+ }, 20);
});
// ======================================================
@@ -700,7 +712,7 @@ suite('MouseEvents', function() {
});
// ======================================================
- test('group mouseenter events', function() {
+ test('group mouseenter events', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
var group = new Kinetic.Group({
@@ -772,84 +784,90 @@ suite('MouseEvents', function() {
var top = stage.content.getBoundingClientRect().top;
- // move mouse outside of circles
- stage._mousemove({
- clientX: 177,
- clientY: 146 + top
- });
+ setTimeout(function() {
+ // move mouse outside of circles
+ stage._mousemove({
+ clientX: 177,
+ clientY: 146 + top
+ });
- assert.equal(redMouseenters, 0, 'redMouseenters should be 0');
- assert.equal(redMouseleaves, 0, 'redMouseleaves should be 0');
- assert.equal(greenMouseenters, 0, 'greenMouseenters should be 0');
- assert.equal(greenMouseleaves, 0, 'greenMouseleaves should be 0');
- assert.equal(groupMouseenters, 0, 'groupMouseenters should be 0');
- assert.equal(groupMouseleaves, 0, 'groupMouseleaves should be 0');
+ assert.equal(redMouseenters, 0, 'redMouseenters should be 0');
+ assert.equal(redMouseleaves, 0, 'redMouseleaves should be 0');
+ assert.equal(greenMouseenters, 0, 'greenMouseenters should be 0');
+ assert.equal(greenMouseleaves, 0, 'greenMouseleaves should be 0');
+ assert.equal(groupMouseenters, 0, 'groupMouseenters should be 0');
+ assert.equal(groupMouseleaves, 0, 'groupMouseleaves should be 0');
- // move mouse inside of red circle
- stage._mousemove({
- clientX: 236,
- clientY: 145 + top
- });
+ setTimeout(function() {
+ // move mouse inside of red circle
+ stage._mousemove({
+ clientX: 236,
+ clientY: 145 + top
+ });
- //console.log('groupMouseenters=' + groupMouseenters);
+ //console.log('groupMouseenters=' + groupMouseenters);
- assert.equal(redMouseenters, 1, 'redMouseenters should be 1');
- assert.equal(redMouseleaves, 0, 'redMouseleaves should be 0');
- assert.equal(greenMouseenters, 0, 'greenMouseenters should be 0');
- assert.equal(greenMouseleaves, 0, 'greenMouseleaves should be 0');
- assert.equal(groupMouseenters, 1, 'groupMouseenters should be 1');
- assert.equal(groupMouseleaves, 0, 'groupMouseleaves should be 0');
+ assert.equal(redMouseenters, 1, 'redMouseenters should be 1');
+ assert.equal(redMouseleaves, 0, 'redMouseleaves should be 0');
+ assert.equal(greenMouseenters, 0, 'greenMouseenters should be 0');
+ assert.equal(greenMouseleaves, 0, 'greenMouseleaves should be 0');
+ assert.equal(groupMouseenters, 1, 'groupMouseenters should be 1');
+ assert.equal(groupMouseleaves, 0, 'groupMouseleaves should be 0');
- // move mouse inside of green circle
- stage._mousemove({
- clientX: 284,
- clientY: 118 + top
- });
+ setTimeout(function() {
+ // move mouse inside of green circle
+ stage._mousemove({
+ clientX: 284,
+ clientY: 118 + top
+ });
- assert.equal(redMouseenters, 1, 'redMouseenters should be 1');
- assert.equal(redMouseleaves, 1, 'redMouseleaves should be 1');
- assert.equal(greenMouseenters, 1, 'greenMouseenters should be 1');
- assert.equal(greenMouseleaves, 0, 'greenMouseleaves should be 0');
- assert.equal(groupMouseenters, 1, 'groupMouseenters should be 1');
- assert.equal(groupMouseleaves, 0, 'groupMouseleaves should be 0');
+ assert.equal(redMouseenters, 1, 'redMouseenters should be 1');
+ assert.equal(redMouseleaves, 1, 'redMouseleaves should be 1');
+ assert.equal(greenMouseenters, 1, 'greenMouseenters should be 1');
+ assert.equal(greenMouseleaves, 0, 'greenMouseleaves should be 0');
+ assert.equal(groupMouseenters, 1, 'groupMouseenters should be 1');
+ assert.equal(groupMouseleaves, 0, 'groupMouseleaves should be 0');
- // move mouse back to red circle
+ setTimeout(function() {
+ // move mouse back to red circle
- stage._mousemove({
- clientX: 345,
- clientY: 105 + top
- });
- stage._mousemove({
- clientX: 345,
- clientY: 105 + top
- });
+ stage._mousemove({
+ clientX: 345,
+ clientY: 105 + top
+ });
- assert.equal(redMouseenters, 2, 'redMouseenters should be 2');
- assert.equal(redMouseleaves, 1, 'redMouseleaves should be 1');
- assert.equal(greenMouseenters, 1, 'greenMouseenters should be 1');
- assert.equal(greenMouseleaves, 1, 'greenMouseleaves should be 1');
- assert.equal(groupMouseenters, 1, 'groupMouseenters should be 1');
- assert.equal(groupMouseleaves, 0, 'groupMouseleaves should be 0');
- // move mouse outside of circles
- stage._mousemove({
- clientX: 177,
- clientY: 146 + top
- });
- stage._mousemove({
- clientX: 177,
- clientY: 146 + top
- });
- assert.equal(redMouseenters, 2, 'redMouseenters should be 2');
- assert.equal(redMouseleaves, 2, 'redMouseleaves should be 2');
- assert.equal(greenMouseenters, 1, 'greenMouseenters should be 1');
- assert.equal(greenMouseleaves, 1, 'greenMouseleaves should be 1');
- assert.equal(groupMouseenters, 1, 'groupMouseenters should be 1');
- assert.equal(groupMouseleaves, 1, 'groupMouseleaves should be 1');
+ assert.equal(redMouseenters, 2, 'redMouseenters should be 2');
+ assert.equal(redMouseleaves, 1, 'redMouseleaves should be 1');
+ assert.equal(greenMouseenters, 1, 'greenMouseenters should be 1');
+ assert.equal(greenMouseleaves, 1, 'greenMouseleaves should be 1');
+ assert.equal(groupMouseenters, 1, 'groupMouseenters should be 1');
+ assert.equal(groupMouseleaves, 0, 'groupMouseleaves should be 0');
- //document.body.appendChild(layer.bufferCanvas.element)
+ setTimeout(function() {
+ // move mouse outside of circles
+ stage._mousemove({
+ clientX: 177,
+ clientY: 146 + top
+ });
- //layer.bufferCanvas.element.style.marginTop = '220px';
+ assert.equal(redMouseenters, 2, 'redMouseenters should be 2');
+ assert.equal(redMouseleaves, 2, 'redMouseleaves should be 2');
+ assert.equal(greenMouseenters, 1, 'greenMouseenters should be 1');
+ assert.equal(greenMouseleaves, 1, 'greenMouseleaves should be 1');
+ assert.equal(groupMouseenters, 1, 'groupMouseenters should be 1');
+ assert.equal(groupMouseleaves, 1, 'groupMouseleaves should be 1');
+
+ //document.body.appendChild(layer.bufferCanvas.element)
+
+ //layer.bufferCanvas.element.style.marginTop = '220px';
+
+ done();
+ }, 20);
+ }, 20);
+ }, 20);
+ }, 20);
+ }, 20);
});
@@ -923,7 +941,7 @@ suite('MouseEvents', function() {
});
// ======================================================
- test('test custom circle hit function', function() {
+ test('test custom circle hit function', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
@@ -960,82 +978,102 @@ suite('MouseEvents', function() {
circle.on('mouseout', function() {
mouseouts++;
});
- // move mouse far outside circle
- stage._mousemove({
- clientX: 113,
- clientY: 112 + top
- });
- assert.equal(mouseovers, 0, '1) mouseovers should be 0');
- assert.equal(mouseouts, 0, '1) mouseouts should be 0');
-
- stage._mousemove({
- clientX: 286,
- clientY: 118 + top
- });
-
- assert.equal(mouseovers, 1, '2) mouseovers should be 1');
- assert.equal(mouseouts, 0, '2)mouseouts should be 0');
-
- stage._mousemove({
- clientX: 113,
- clientY: 112 + top
- });
-
- assert.equal(mouseovers, 1, '3) mouseovers should be 1');
- assert.equal(mouseouts, 1, '3) mouseouts should be 1');
-
- showHit(layer);
+ setTimeout(function() {
- // set drawBufferFunc with setter
+ // move mouse far outside circle
+ stage._mousemove({
+ clientX: 113,
+ clientY: 112 + top
+ });
- circle.hitFunc(function(context) {
- var _context = context._context;
- _context.beginPath();
- _context.arc(0, 0, this.getRadius() - 50, 0, Math.PI * 2, true);
- _context.closePath();
- context.fillStrokeShape(this);
+ setTimeout(function() {
+ assert.equal(mouseovers, 0, '1) mouseovers should be 0');
+ assert.equal(mouseouts, 0, '1) mouseouts should be 0');
- });
+ stage._mousemove({
+ clientX: 286,
+ clientY: 118 + top
+ });
- layer.getHitCanvas().getContext().clear();
- layer.drawHit();
+ assert.equal(mouseovers, 1, '2) mouseovers should be 1');
+ assert.equal(mouseouts, 0, '2)mouseouts should be 0');
+
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 113,
+ clientY: 112 + top
+ });
+
+ assert.equal(mouseovers, 1, '3) mouseovers should be 1');
+ assert.equal(mouseouts, 1, '3) mouseouts should be 1');
+
+ showHit(layer);
- // move mouse far outside circle
- stage._mousemove({
- clientX: 113,
- clientY: 112 + top
- });
+ // set drawBufferFunc with setter
- assert.equal(mouseovers, 1, '4) mouseovers should be 1');
- assert.equal(mouseouts, 1, '4) mouseouts should be 1');
+ circle.hitFunc(function(context) {
+ var _context = context._context;
+ _context.beginPath();
+ _context.arc(0, 0, this.getRadius() - 50, 0, Math.PI * 2, true);
+ _context.closePath();
+ context.fillStrokeShape(this);
- stage._mousemove({
- clientX: 286,
- clientY: 118 + top
- });
+ });
- assert.equal(mouseovers, 1, '5) mouseovers should be 1');
- assert.equal(mouseouts, 1, '5) mouseouts should be 1');
+ layer.getHitCanvas().getContext().clear();
+ layer.drawHit();
- stage._mousemove({
- clientX: 321,
- clientY: 112 + top
- });
+ setTimeout(function() {
- assert.equal(mouseovers, 1, '6) mouseovers should be 1');
- assert.equal(mouseouts, 1, '6) mouseouts should be 1');
+ // move mouse far outside circle
+ stage._mousemove({
+ clientX: 113,
+ clientY: 112 + top
+ });
- // move to center of circle
- stage._mousemove({
- clientX: 375,
- clientY: 112 + top
- });
+ assert.equal(mouseovers, 1, '4) mouseovers should be 1');
+ assert.equal(mouseouts, 1, '4) mouseouts should be 1');
- assert.equal(mouseovers, 2, '7) mouseovers should be 2');
- assert.equal(mouseouts, 1, '7) mouseouts should be 1');
+ setTimeout(function() {
+
+ stage._mousemove({
+ clientX: 286,
+ clientY: 118 + top
+ });
+
+ assert.equal(mouseovers, 1, '5) mouseovers should be 1');
+ assert.equal(mouseouts, 1, '5) mouseouts should be 1');
+
+ setTimeout(function() {
+ stage._mousemove({
+ clientX: 321,
+ clientY: 112 + top
+ });
+
+ assert.equal(mouseovers, 1, '6) mouseovers should be 1');
+ assert.equal(mouseouts, 1, '6) mouseouts should be 1');
+
+ setTimeout(function() {
+ // move to center of circle
+ stage._mousemove({
+ clientX: 375,
+ clientY: 112 + top
+ });
+
+ assert.equal(mouseovers, 2, '7) mouseovers should be 2');
+ assert.equal(mouseouts, 1, '7) mouseouts should be 1');
+
+ done();
+ }, 20);
+ }, 20);
+ }, 20);
+ }, 20);
+ }, 20);
+ }, 20);
+ }, 20);
});
});
\ No newline at end of file
diff --git a/test/functional/TouchEvents-test.js b/test/functional/TouchEvents-test.js
index 4ce8490d..9df8f3a6 100644
--- a/test/functional/TouchEvents-test.js
+++ b/test/functional/TouchEvents-test.js
@@ -92,7 +92,7 @@ suite('TouchEvents', function() {
// ======================================================
- test('touchstart touchend touchmove tap dbltap', function() {
+ test('touchstart touchend touchmove tap dbltap', function(done) {
var stage = addStage();
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
@@ -215,20 +215,24 @@ suite('TouchEvents', function() {
assert(tap, '11) tap should be true');
assert(dbltap, '11) dbltap should be true');
- // touchmove circle
- stage._touchmove({
- touches: [{
- clientX: 290,
- clientY: 100 + top,
- }],
- preventDefault: function() {
- }
- });
+ setTimeout(function() {
+ // touchmove circle
+ stage._touchmove({
+ touches: [{
+ clientX: 290,
+ clientY: 100 + top,
+ }],
+ preventDefault: function() {
+ }
+ });
- assert(touchstart, '12) touchstart should be true');
- assert(touchmove, '12) touchmove should be true');
- assert(touchend, '12) touchend should be true');
- assert(tap, '12) tap should be true');
- assert(dbltap, '12) dbltap should be true');
+ assert(touchstart, '12) touchstart should be true');
+ assert(touchmove, '12) touchmove should be true');
+ assert(touchend, '12) touchend should be true');
+ assert(tap, '12) tap should be true');
+ assert(dbltap, '12) dbltap should be true');
+
+ done();
+ }, 17);
});
});
\ No newline at end of file
diff --git a/test/runner.html b/test/runner.html
index e429dfd5..2a3b0654 100644
--- a/test/runner.html
+++ b/test/runner.html
@@ -102,7 +102,6 @@
-