Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(973)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: third_party/WebKit/LayoutTests/fast/canvas/canvas-hit-regions-event-test.html

Issue 1654653002: Canvas2d: Implement rerouting event by hit region's control. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | third_party/WebKit/Source/core/dom/Touch.h » ('j') | third_party/WebKit/Source/core/dom/Touch.h » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: third_party/WebKit/LayoutTests/fast/canvas/canvas-hit-regions-event-test.html
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/canvas-hit-regions-event-test.html b/third_party/WebKit/LayoutTests/fast/canvas/canvas-hit-regions-event-test.html
new file mode 100644
index 0000000000000000000000000000000000000000..7e8c7e74a864a42f22ae8c7222c6c8afd0a2805f
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fast/canvas/canvas-hit-regions-event-test.html
@@ -0,0 +1,246 @@
+<!DOCTYPE html>
+<title>HitRegion Event Test</title>
+<script src="../../resources/testharness.js"></script>
+<script src="../../resources/testharnessreport.js"></script>
+<script src="./resources/test-helpers.js"></script>
+<canvas width="400" height="400">
+ <button id="button"></button>
+ <button id="button2"></button>
+</canvas>
+<style>
+
+body {
+ margin : 0px;
+ padding : 0px;
+}
+
+</style>
+<script>
+
+var canvas = document.querySelector('canvas');
+var button = document.querySelector('canvas > #button');
+var button2 = document.querySelector('canvas > #button2');
+var context = canvas.getContext('2d');
+
+async_test(function() {
+ context.clearRect(0, 0, 400, 400);
+ context.rect(0, 0, 50, 50);
+ context.fill();
+ context.addHitRegion({ id : 'button' });
Rick Byers 2016/02/23 20:26:08 Can you add a test which adds a hit region for an
zino 2016/03/08 12:33:48 Done. There was a basic test when calling addHitR
Rick Byers 2016/03/10 21:36:28 The tests look excellent now, thanks for the impro
+
+ var expected = [
+ 'clickbutton',
+ 'clickbutton'
+ ];
+ var actual = [];
+
+ canvas.addEventListener('click', function(e) {
+ canvas.style.width = '0px';
+ actual.push(e.type + e.region);
Rick Byers 2016/02/23 20:26:08 I think you also want to test the event target, ri
zino 2016/03/08 12:33:48 Done.
+ });
+
+ canvas.addEventListener('click', function(e) {
+ actual.push(e.type + e.region);
+ canvas.style.width = '400px';
+ });
+
+ if (eventSender) {
+ eventSender.mouseMoveTo(40, 10);
+ eventSender.mouseDown();
+ eventSender.mouseUp();
+ }
+
+ assert_equals(actual.length, expected.length);
+ assert_array_equals(actual, expected);
+ this.done();
+}, 'The event object should not be changed even if mutate the DOM.');
+
+async_test(function() {
+ context.rect(0, 0, 50, 50);
+ context.fill();
+ context.addHitRegion({ id : 'button', control : button });
+
+ var expected = [
+ 'mousemovebutton',
+ 'mousedownbutton',
+ 'mouseupbutton',
+ 'touchstartbutton',
+ 'touchendbutton',
+ ];
+ var actual = [];
+
+ button.addEventListener('mousedown', function(e) {
+ actual.push(e.type + e.region);
+ });
+
+ button.addEventListener('mousemove', function(e) {
+ actual.push(e.type + e.region);
+ });
+
+ button.addEventListener('mouseup', function(e) {
Rick Byers 2016/02/23 20:26:08 You probably want to also check mouseover, mouseou
zino 2016/03/08 12:33:48 I added the test cases. But mouseout/mouseleave do
+ actual.push(e.type + e.region);
+ });
+
+ button.addEventListener('touchstart', function(e) {
+ actual.push(e.type + e.changedTouches[0].region);
+ });
+
+ button.addEventListener('touchend', function(e) {
+ actual.push(e.type + e.changedTouches[0].region);
+ });
+
+ if (eventSender) {
+ eventSender.mouseMoveTo(10, 10);
+ eventSender.mouseDown();
+ eventSender.mouseUp();
+
+ eventSender.clearTouchPoints();
+ eventSender.addTouchPoint(10, 10);
+ eventSender.touchStart();
+ eventSender.releaseTouchPoint(0);
+ eventSender.touchEnd();
+ }
+
+ assert_equals(actual.length, expected.length);
+ assert_array_equals(actual, expected);
+ this.done();
+}, 'Rerouting mouse/touch event test');
+
+async_test(function() {
+ context.clearRect(0, 0, 400, 400);
+ context.rect(0, 0, 50, 50);
+ context.fill();
+ context.addHitRegion({ id : 'button', control : button });
+ context.beginPath();
+ context.rect(50, 0, 50, 50);
+ context.fill();
+ context.addHitRegion({ id : 'button2', control : button2 });
+
+ var expected = [
+ 'mousemovebutton',
+ 'mousemovebutton2',
+ 'touchmovebutton',
+ 'touchmovebutton',
+ ];
+ var actual = [];
+
+ button.addEventListener('mousemove', function(e) {
+ actual.push(e.type + e.region);
+ });
+
+ button2.addEventListener('mousemove', function(e) {
+ actual.push(e.type + e.region);
+ });
+
+ button.addEventListener('touchmove', function(e) {
+ actual.push(e.type + e.changedTouches[0].region);
+ });
+
+ button2.addEventListener('touchmove', function(e) {
+ actual.push(e.type + e.changedTouches[0].region);
+ });
+
+ if (eventSender) {
+ eventSender.mouseMoveTo(10, 10);
+ eventSender.mouseMoveTo(60, 10);
+
+ eventSender.clearTouchPoints();
+ eventSender.addTouchPoint(10, 10);
+ eventSender.touchStart();
+ eventSender.updateTouchPoint(0, 11, 11);
+ eventSender.touchMove();
+ eventSender.updateTouchPoint(0, 60, 10);
+ eventSender.touchMove();
+ eventSender.releaseTouchPoint(0);
+ eventSender.touchEnd();
+ }
+
+ assert_equals(actual.length, expected.length);
+ assert_array_equals(actual, expected);
+ this.done();
+}, 'Touch events are defined to have "implicit capture".');
+
+async_test(function() {
+ var tmp_canvas = document.createElement('canvas');
+
+ var without_initializer = new MouseEvent('click');
+ assert_equals(without_initializer.region, null);
+
+ var default_value = new MouseEvent('click', {});
+ assert_equals(default_value.region, null);
+
+ var set_null = new MouseEvent('click', { region : null });
+ assert_equals(set_null.region, null);
+
+ var set_region = new MouseEvent('click', { region : 'test' });
+ assert_equals(set_region.region, 'test');
+
+ var called = [];
+ tmp_canvas.addEventListener('click', function(e) {
+ tmp_canvas.remove();
+ called.push(e.region);
+ });
+
+ tmp_canvas.addEventListener('click', function(e) {
+ tmp_canvas.remove();
+ called.push(e.region);
+ });
+
+ tmp_canvas.dispatchEvent(set_null);
+ tmp_canvas.dispatchEvent(set_region);
+ assert_array_equals(called, [ null, null, 'test', 'test' ]);
+ this.done();
+}, 'MouseEventInit.');
+
+async_test(function() {
+ var tmp_canvas = document.createElement('canvas');
+
+ var touch1 = new Touch({
+ identifier : 0,
+ target : tmp_canvas
+ });
+ var touch2 = new Touch({
+ identifier : 0,
+ target : tmp_canvas,
+ region : null
+ });
+ var touch3 = new Touch({
+ identifier : 0,
+ target : tmp_canvas,
+ region : 'touch'
+ });
+
+ var touch_event = new TouchEvent('touchstart', {
+ touches : [touch1, touch2, touch3],
+ targetTouches : [touch1, touch3]
+ });
+
+ assert_equals(touch_event.touches.length, 3);
+ assert_equals(touch_event.touches[0].region, null);
+ assert_equals(touch_event.touches[1].region, null);
+ assert_equals(touch_event.touches[2].region, 'touch');
+ assert_equals(touch_event.targetTouches.length, 2);
+ assert_equals(touch_event.targetTouches[0].region, null);
+ assert_equals(touch_event.targetTouches[1].region, 'touch');
+
+ var called = [];
+ tmp_canvas.addEventListener('touchstart', function(e) {
+ tmp_canvas.remove();
+ called.push(e.touches[0].region);
+ called.push(e.touches[1].region);
+ called.push(e.touches[2].region);
+ });
+
+ tmp_canvas.addEventListener('touchstart', function(e) {
+ tmp_canvas.remove();
+ called.push(e.touches[0].region);
+ called.push(e.touches[1].region);
+ called.push(e.touches[2].region);
+ });
+
+ tmp_canvas.dispatchEvent(touch_event);
+ assert_array_equals(called, [ null, null, 'touch', null, null, 'touch' ]);
+ this.done();
+}, 'TouchEventInit.');
+
+</script>
« no previous file with comments | « no previous file | third_party/WebKit/Source/core/dom/Touch.h » ('j') | third_party/WebKit/Source/core/dom/Touch.h » ('J')

Powered by Google App Engine
This is Rietveld 408576698