10000 DragElement: initialize clientX and clientY for touch events by jonfunkhouser · Pull Request #2997 · plotly/plotly.js · GitHub
[go: up one dir, main page]
Skip to content

DragElement: initi 8000 alize clientX and clientY for touch events #2997

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Sep 18, 2018
Merged

DragElement: initialize clientX and clientY for touch events #2997

Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
20be404
touch events: initialize clientX and clientY
jonfunkhouser Sep 11, 2018
dddbef4
add test for click events on touch devices
jonfunkhouser Sep 17, 2018
fca6f9b
cleanup after new touch hover test
etpinard Sep 18, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
10000
Diff view
Prev Previous commit
Next Next commit
add test for click events on touch devices
  • Loading branch information
@jonfunkhouser
jonfunkhouser committed Sep 17, 2018
commit dddbef4850b1fdc90701b616d3ed5cd8bd039170
53 changes: 53 additions & 0 deletions test/jasmine/tests/hover_label_test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ var click = require('../assets/click');
var delay = require('../assets/delay');
var doubleClick = require('../assets/double_click');
var failTest = require('../assets/fail_test');
var touchEvent = require('../assets/touch_event');

var customAssertions = require('../assets/custom_assertions');
var assertHoverLabelStyle = customAssertions.assertHoverLabelStyle;
Expand All @@ -21,6 +22,20 @@ var assertElemRightTo = customAssertions.assertElemRightTo;
var assertElemTopsAligned = customAssertions.assertElemTopsAligned;
var assertElemInside = customAssertions.assertElemInside;

function touch(path, options) {
var len = path.length;
Lib.clearThrottle();
touchEvent('touchstart', path[0][0], path[0][1], options);

path.slice(1, len).forEach(function(pt) {
Lib.clearThrottle();
touchEvent('touchmove', pt[0], pt[1], options);
});

touchEvent('touchend', path[len - 1][0], path[len - 1][1], options);
return;
}

describe('hover info', function() {
'use strict';

Expand Down Expand Up @@ -2503,3 +2518,41 @@ describe('hovermode defaults to', function() {
.then(done);
});
});


describe('touch devices', function() {
['pan', 'zoom'].forEach(function(type) {
describe('dragmode:' + type, function() {
var data = [{x: [1, 2, 3], y: [1, 3, 2], type: 'bar'}];
var layout = {width: 600, height: 400, dragmode: type};
var gd;

beforeEach(function(done) {
gd = createGraphDiv();
Plotly.plot(gd, data, layout).then(done);
});

it('emits click events', function(done) {
var hoverHandler = jasmine.createSpy('hover');
var clickHandler = jasmine.createSpy('click');
gd.on('plotly_hover', hoverHandler);
gd.on('plotly_click', clickHandler);

var gdBB = gd.getBoundingClientRect();
var touchPoint = [[gdBB.left + 300, gdBB.top + 200]];

Promise.resolve()
.then(function() {
touch(touchPoint);
})
.then(delay(HOVERMINTIME * 1.1))
.then(function() {
expect(clickHandler).toHaveBeenCalled();
expect(hoverHandler).not.toHaveBeenCalled();
})
.catch(failTest)
.then(done);
});
});
});
});
0