Skip to content

Commit 44b0ae6

Browse files
committed
make gl2d drag test use assets/drag
... which should make things more robust and lead to less intermittent ci failures
1 parent a237c83 commit 44b0ae6

File tree

1 file changed

+106
-85
lines changed

1 file changed

+106
-85
lines changed

test/jasmine/tests/gl_plot_interact_test.js

+106-85
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ var createGraphDiv = require('../assets/create_graph_div');
99
var destroyGraphDiv = require('../assets/destroy_graph_div');
1010
var fail = require('../assets/fail_test');
1111
var mouseEvent = require('../assets/mouse_event');
12+
var drag = require('../assets/drag');
1213
var selectButton = require('../assets/modebar_button');
1314
var delay = require('../assets/delay');
1415
var readPixel = require('../assets/read_pixel');
@@ -1445,8 +1446,8 @@ describe('Test gl2d plots', function() {
14451446
var mock = require('@mocks/gl2d_10.json');
14461447

14471448
beforeEach(function() {
1449+
jasmine.DEFAULT_TIMEOUT_INTERVAL = 5000;
14481450
gd = createGraphDiv();
1449-
jasmine.DEFAULT_TIMEOUT_INTERVAL = 3000;
14501451
});
14511452

14521453
afterEach(function() {
@@ -1455,10 +1456,10 @@ describe('Test gl2d plots', function() {
14551456
});
14561457

14571458
function mouseTo(p0, p1) {
1458-
mouseEvent('mousemove', p0[0], p0[1]);
1459-
mouseEvent('mousedown', p0[0], p0[1], { buttons: 1 });
1460-
mouseEvent('mousemove', p1[0], p1[1], { buttons: 1 });
1461-
mouseEvent('mouseup', p1[0], p1[1]);
1459+
var node = d3.select('.nsewdrag[data-subplot="xy"]').node();
1460+
var dx = p1[0] - p0[0];
1461+
var dy = p1[1] - p0[1];
1462+
return drag(node, dx, dy, null, p0[0], p0[1]);
14621463
}
14631464

14641465
it('should respond to drag interactions', function(done) {
@@ -1472,7 +1473,7 @@ describe('Test gl2d plots', function() {
14721473
var newY = [-1.7, 4.95];
14731474
var precision = 1;
14741475

1475-
Plotly.plot(gd, _mock)
1476+
Plotly.newPlot(gd, _mock)
14761477
.then(delay(20))
14771478
.then(function() {
14781479
expect(gd.layout.xaxis.autorange).toBe(true);
@@ -1493,43 +1494,54 @@ describe('Test gl2d plots', function() {
14931494
.then(delay(200))
14941495
.then(function() {
14951496
gd.on('plotly_relayout', relayoutCallback);
1496-
1497+
})
1498+
.then(function() {
14971499
// Drag scene along the X axis
1498-
mouseTo([200, 200], [220, 200]);
1499-
1500+
return mouseTo([200, 200], [220, 200]);
1501+
})
1502+
.then(function() {
15001503
expect(gd.layout.xaxis.autorange).toBe(false);
15011504
expect(gd.layout.yaxis.autorange).toBe(false);
1502-
15031505
expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
15041506
expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
1505-
1507+
})
1508+
.then(function() {
15061509
// Drag scene back along the X axis
1507-
mouseTo([220, 200], [200, 200]);
1508-
1510+
return mouseTo([220, 200], [200, 200]);
1511+
})
1512+
.then(function() {
15091513
expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
15101514
expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
1511-
1515+
})
1516+
.then(function() {
15121517
// Drag scene along the Y axis
1513-
mouseTo([200, 200], [200, 150]);
1514-
1518+
return mouseTo([200, 200], [200, 150]);
1519+
})
1520+
.then(function() {
15151521
expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
15161522
expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
1517-
1523+
})
1524+
.then(function() {
15181525
// Drag scene back along the Y axis
1519-
mouseTo([200, 150], [200, 200]);
1520-
1526+
return mouseTo([200, 150], [200, 200]);
1527+
})
1528+
.then(function() {
15211529
expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
15221530
expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
1523-
1531+
})
1532+
.then(function() {
15241533
// Drag scene along both the X and Y axis
1525-
mouseTo([200, 200], [220, 150]);
1526-
1534+
return mouseTo([200, 200], [220, 150]);
1535+
})
1536+
.then(function() {
15271537
expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
15281538
expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
1529-
1539+
})
1540+
.then(function() {
15301541
// Drag scene back along the X and Y axis
1531-
mouseTo([220, 150], [200, 200]);
1532-
1542+
return mouseTo([220, 150], [200, 200]);
1543+
})
1544+
.then(function() {
15331545
expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
15341546
expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
15351547
})
@@ -1546,6 +1558,7 @@ describe('Test gl2d plots', function() {
15461558
'yaxis.range[1]': jasmine.any(Number)
15471559
}));
15481560
})
1561+
.catch(fail)
15491562
.then(done);
15501563
});
15511564

@@ -1604,39 +1617,51 @@ describe('Test gl2d plots', function() {
16041617
});
16051618

16061619
it('supports 1D and 2D Zoom', function(done) {
1607-
var centerX, centerY;
1608-
Plotly.newPlot(gd,
1609-
[{type: 'scattergl', x: [1, 15], y: [1, 15]}],
1610-
{
1611-
width: 400,
1612-
height: 400,
1613-
margin: {t: 100, b: 100, l: 100, r: 100},
1614-
xaxis: {range: [0, 16]},
1615-
yaxis: {range: [0, 16]}
1616-
}
1617-
)
1620+
var centerX;
1621+
var centerY;
1622+
1623+
Plotly.newPlot(gd, [{
1624+
type: 'scattergl', x: [1, 15], y: [1, 15]
1625+
}], {
1626+
width: 400,
1627+
height: 400,
1628+
margin: {t: 100, b: 100, l: 100, r: 100},
1629+
xaxis: {range: [0, 16]},
1630+
yaxis: {range: [0, 16]}
1631+
})
16181632
.then(function() {
16191633
var bBox = gd.getBoundingClientRect();
16201634
centerX = bBox.left + 200;
16211635
centerY = bBox.top + 200;
16221636

1637+
return mouseTo([centerX, centerY], [centerX - 5, centerY + 5]);
1638+
})
1639+
.then(function() {
16231640
// no change - too small
1624-
mouseTo([centerX, centerY], [centerX - 5, centerY + 5]);
16251641
expect(gd.layout.xaxis.range).toBeCloseToArray([0, 16], 3);
16261642
expect(gd.layout.yaxis.range).toBeCloseToArray([0, 16], 3);
1627-
1643+
})
1644+
.then(function() {
1645+
return mouseTo([centerX - 50, centerY], [centerX + 50, centerY + 50]);
1646+
})
1647+
.then(function() {
16281648
// 2D
1629-
mouseTo([centerX - 50, centerY], [centerX + 50, centerY + 50]);
16301649
expect(gd.layout.xaxis.range).toBeCloseToArray([4, 12], 3);
16311650
expect(gd.layout.yaxis.range).toBeCloseToArray([4, 8], 3);
1632-
1651+
})
1652+
.then(function() {
1653+
return mouseTo([centerX - 50, centerY], [centerX, centerY + 5]);
1654+
})
1655+
.then(function() {
16331656
// x only
1634-
mouseTo([centerX - 50, centerY], [centerX, centerY + 5]);
16351657
expect(gd.layout.xaxis.range).toBeCloseToArray([6, 8], 3);
16361658
expect(gd.layout.yaxis.range).toBeCloseToArray([4, 8], 3);
1637-
1659+
})
1660+
.then(function() {
1661+
return mouseTo([centerX, centerY - 50], [centerX - 5, centerY + 50]);
1662+
})
1663+
.then(function() {
16381664
// y only
1639-
mouseTo([centerX, centerY - 50], [centerX - 5, centerY + 50]);
16401665
expect(gd.layout.xaxis.range).toBeCloseToArray([6, 8], 3);
16411666
expect(gd.layout.yaxis.range).toBeCloseToArray([5, 7], 3);
16421667
})
@@ -1645,17 +1670,18 @@ describe('Test gl2d plots', function() {
16451670
});
16461671

16471672
it('supports axis constraints with zoom', function(done) {
1648-
var centerX, centerY;
1649-
Plotly.newPlot(gd,
1650-
[{type: 'scattergl', x: [1, 15], y: [1, 15]}],
1651-
{
1652-
width: 400,
1653-
height: 400,
1654-
margin: {t: 100, b: 100, l: 100, r: 100},
1655-
xaxis: {range: [0, 16]},
1656-
yaxis: {range: [0, 16]}
1657-
}
1658-
)
1673+
var centerX;
1674+
var centerY;
1675+
1676+
Plotly.newPlot(gd, [{
1677+
type: 'scattergl', x: [1, 15], y: [1, 15]
1678+
}], {
1679+
width: 400,
1680+
height: 400,
1681+
margin: {t: 100, b: 100, l: 100, r: 100},
1682+
xaxis: {range: [0, 16]},
1683+
yaxis: {range: [0, 16]}
1684+
})
16591685
.then(function() {
16601686
var bBox = gd.getBoundingClientRect();
16611687
centerX = bBox.left + 200;
@@ -1670,23 +1696,33 @@ describe('Test gl2d plots', function() {
16701696
// x range is adjusted to fit constraint
16711697
expect(gd.layout.xaxis.range).toBeCloseToArray([-8, 24], 3);
16721698
expect(gd.layout.yaxis.range).toBeCloseToArray([0, 16], 3);
1673-
1699+
})
1700+
.then(function() {
1701+
return mouseTo([centerX, centerY], [centerX - 5, centerY + 5]);
1702+
})
1703+
.then(function() {
16741704
// no change - too small
1675-
mouseTo([centerX, centerY], [centerX - 5, centerY + 5]);
16761705
expect(gd.layout.xaxis.range).toBeCloseToArray([-8, 24], 3);
16771706
expect(gd.layout.yaxis.range).toBeCloseToArray([0, 16], 3);
1678-
1707+
})
1708+
.then(function() {
16791709
// now there should only be 2D zooming
16801710
// dy>>dx
1681-
mouseTo([centerX, centerY], [centerX - 1, centerY - 50]);
1711+
return mouseTo([centerX, centerY], [centerX - 1, centerY - 50]);
1712+
})
1713+
.then(function() {
16821714
expect(gd.layout.xaxis.range).toBeCloseToArray([0, 8], 3);
16831715
expect(gd.layout.yaxis.range).toBeCloseToArray([8, 12], 3);
1684-
1716+
})
1717+
.then(function() {
1718+
return mouseTo([centerX, centerY], [centerX + 50, centerY + 1]);
1719+
})
1720+
.then(function() {
16851721
// dx>>dy
1686-
mouseTo([centerX, centerY], [centerX + 50, centerY + 1]);
16871722
expect(gd.layout.xaxis.range).toBeCloseToArray([4, 6], 3);
16881723
expect(gd.layout.yaxis.range).toBeCloseToArray([9, 10], 3);
1689-
1724+
})
1725+
.then(function() {
16901726
return Plotly.relayout(gd, {
16911727
'xaxis.autorange': true,
16921728
'yaxis.autorange': true
@@ -1712,28 +1748,8 @@ describe('Test gl2d plots', function() {
17121748

17131749
done();
17141750
});
1715-
});
1716-
1717-
describe('Test gl2d interactions', function() {
1718-
var gd;
1719-
1720-
beforeEach(function() {
1721-
gd = createGraphDiv();
1722-
});
1723-
1724-
afterEach(function() {
1725-
Plotly.purge(gd);
1726-
destroyGraphDiv();
1727-
});
17281751

17291752
it('data-referenced annotations should update on drag', function(done) {
1730-
function drag(start, end) {
1731-
mouseEvent('mousemove', start[0], start[1]);
1732-
mouseEvent('mousedown', start[0], start[1], { buttons: 1 });
1733-
mouseEvent('mousemove', end[0], end[1], { buttons: 1 });
1734-
mouseEvent('mouseup', end[0], end[1]);
1735-
}
1736-
17371753
function assertAnnotation(xy) {
17381754
var ann = d3.select('g.annotation-text-g').select('g');
17391755
var translate = Drawing.getTranslate(ann);
@@ -1742,7 +1758,7 @@ describe('Test gl2d interactions', function() {
17421758
expect(translate.y).toBeWithin(xy[1], 8);
17431759
}
17441760

1745-
Plotly.plot(gd, [{
1761+
Plotly.newPlot(gd, [{
17461762
type: 'scattergl',
17471763
x: [1, 2, 3],
17481764
y: [2, 1, 2]
@@ -1756,10 +1772,14 @@ describe('Test gl2d interactions', function() {
17561772
})
17571773
.then(function() {
17581774
assertAnnotation([327, 312]);
1759-
1760-
drag([250, 200], [200, 150]);
1775+
})
1776+
.then(function() {
1777+
return mouseTo([250, 200], [200, 150]);
1778+
})
1779+
.then(function() {
17611780
assertAnnotation([277, 262]);
1762-
1781+
})
1782+
.then(function() {
17631783
return Plotly.relayout(gd, {
17641784
'xaxis.range': [1.5, 2.5],
17651785
'yaxis.range': [1, 1.5]
@@ -1768,6 +1788,7 @@ describe('Test gl2d interactions', function() {
17681788
.then(function() {
17691789
assertAnnotation([327, 331]);
17701790
})
1791+
.catch(fail)
17711792
.then(done);
17721793
});
17731794
});

0 commit comments

Comments
 (0)