mirror of
https://github.com/konvajs/konva.git
synced 2025-09-18 18:27:58 +08:00
added custom buffer drawing function functional tests. Added an index page with links to all of the KineticJS tests inside the tests directory
This commit is contained in:
@@ -16,7 +16,7 @@
|
|||||||
test.run();
|
test.run();
|
||||||
|
|
||||||
document.getElementsByTagName('body')[0].addEventListener('mousemove', function(evt) {
|
document.getElementsByTagName('body')[0].addEventListener('mousemove', function(evt) {
|
||||||
//console.log(evt.clientX + ',' + evt.clientY);
|
console.log(evt.clientX + ',' + evt.clientY);
|
||||||
}, false);
|
}, false);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
12
tests/html/index.html
Normal file
12
tests/html/index.html
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
<!DOCTYPE>
|
||||||
|
<html>
|
||||||
|
<body>
|
||||||
|
<h1>KineticJS Test Suite</h1>
|
||||||
|
<ul>
|
||||||
|
<li><a href="unitTests.html">Unit Tests</a></li>
|
||||||
|
<li><a href="functionalTests.html">Functional Tests</a></li>
|
||||||
|
<li><a href="manualTests.html">Manual Tests</a></li>
|
||||||
|
<li><a href="performanceTests.html">Performance Tests</a></li>
|
||||||
|
</ul>
|
||||||
|
</body>
|
||||||
|
</html>
|
@@ -858,3 +858,119 @@ Test.Modules.EVENT = {
|
|||||||
test(e.toString() === 'circle,group1,group2,layer,stage', 'problem with event bubbling');
|
test(e.toString() === 'circle,group1,group2,layer,stage', 'problem with event bubbling');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Test.Modules['BUFFER FUNCS'] = {
|
||||||
|
'test custom circle buffer function': function(containerId) {
|
||||||
|
var stage = new Kinetic.Stage({
|
||||||
|
container: containerId,
|
||||||
|
width: 578,
|
||||||
|
height: 200,
|
||||||
|
throttle: 999
|
||||||
|
});
|
||||||
|
var layer = new Kinetic.Layer();
|
||||||
|
var circle = new Kinetic.Circle({
|
||||||
|
x: 380,
|
||||||
|
y: stage.getHeight() / 2,
|
||||||
|
radius: 70,
|
||||||
|
strokeWidth: 4,
|
||||||
|
fill: 'red',
|
||||||
|
stroke: 'black',
|
||||||
|
drawBufferFunc: function(context) {
|
||||||
|
context.beginPath();
|
||||||
|
context.arc(0, 0, this.getRadius() + 100, 0, Math.PI * 2, true);
|
||||||
|
context.closePath();
|
||||||
|
this.fill(context);
|
||||||
|
this.stroke(context);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
circle.setDraggable(true);
|
||||||
|
|
||||||
|
layer.add(circle);
|
||||||
|
stage.add(layer);
|
||||||
|
|
||||||
|
var top = stage.content.getBoundingClientRect().top;
|
||||||
|
|
||||||
|
var mouseovers = 0;
|
||||||
|
var mouseouts = 0;
|
||||||
|
|
||||||
|
circle.on('mouseover', function() {
|
||||||
|
mouseovers++;
|
||||||
|
});
|
||||||
|
|
||||||
|
circle.on('mouseout', function() {
|
||||||
|
mouseouts++;
|
||||||
|
});
|
||||||
|
|
||||||
|
// move mouse far outside circle
|
||||||
|
stage._mousemove({
|
||||||
|
clientX: 113,
|
||||||
|
clientY: 112 + top
|
||||||
|
});
|
||||||
|
|
||||||
|
test(mouseovers === 0, 'mouseovers should be 0');
|
||||||
|
test(mouseouts === 0, 'mouseouts should be 0');
|
||||||
|
|
||||||
|
stage._mousemove({
|
||||||
|
clientX: 286,
|
||||||
|
clientY: 118 + top
|
||||||
|
});
|
||||||
|
|
||||||
|
test(mouseovers === 1, 'mouseovers should be 1');
|
||||||
|
test(mouseouts === 0, 'mouseouts should be 0');
|
||||||
|
|
||||||
|
stage._mousemove({
|
||||||
|
clientX: 113,
|
||||||
|
clientY: 112 + top
|
||||||
|
});
|
||||||
|
|
||||||
|
test(mouseovers === 1, 'mouseovers should be 1');
|
||||||
|
test(mouseouts === 1, 'mouseouts should be 1');
|
||||||
|
|
||||||
|
// set drawBufferFunc with setter
|
||||||
|
|
||||||
|
circle.setDrawBufferFunc(function(context) {
|
||||||
|
context.beginPath();
|
||||||
|
context.arc(0, 0, this.getRadius() - 50, 0, Math.PI * 2, true);
|
||||||
|
context.closePath();
|
||||||
|
this.fill(context);
|
||||||
|
this.stroke(context);
|
||||||
|
});
|
||||||
|
|
||||||
|
layer.drawBuffer();
|
||||||
|
|
||||||
|
// move mouse far outside circle
|
||||||
|
stage._mousemove({
|
||||||
|
clientX: 113,
|
||||||
|
clientY: 112 + top
|
||||||
|
});
|
||||||
|
|
||||||
|
test(mouseovers === 1, 'mouseovers should be 1');
|
||||||
|
test(mouseouts === 1, 'mouseouts should be 1');
|
||||||
|
|
||||||
|
stage._mousemove({
|
||||||
|
clientX: 286,
|
||||||
|
clientY: 118 + top
|
||||||
|
});
|
||||||
|
|
||||||
|
test(mouseovers === 1, 'mouseovers should be 1');
|
||||||
|
test(mouseouts === 1, 'mouseouts should be 1');
|
||||||
|
|
||||||
|
stage._mousemove({
|
||||||
|
clientX: 321,
|
||||||
|
clientY: 112 + top
|
||||||
|
});
|
||||||
|
|
||||||
|
test(mouseovers === 1, 'mouseovers should be 1');
|
||||||
|
test(mouseouts === 1, 'mouseouts should be 1');
|
||||||
|
|
||||||
|
// move to center of circle
|
||||||
|
stage._mousemove({
|
||||||
|
clientX: 375,
|
||||||
|
clientY: 112 + top
|
||||||
|
});
|
||||||
|
|
||||||
|
test(mouseovers === 2, 'mouseovers should be 2');
|
||||||
|
test(mouseouts === 1, 'mouseouts should be 1');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
Reference in New Issue
Block a user