Skip to content

Commit 1dee019

Browse files
archmojarchmoj
committed
expand and fix tests
 - should not depend on calculating inverse matrix in test - add test case for various transforms e.g. scale and translate
1 parent 8cc496c commit 1dee019

File tree

2 files changed

+53
-58
lines changed

2 files changed

+53
-58
lines changed

‎test/jasmine/tests/cartesian_interact_test.js‎

Lines changed: 24 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -2272,13 +2272,6 @@ describe('Cartesian plots with css transforms', function() {
22722272
gd.style.transform = transformString;
22732273
}
22742274

2275-
function recalculateInverse(gd) {
2276-
var m = Lib.inverseTransformMatrix(Lib.getFullTransformMatrix(gd));
2277-
gd._fullLayout._inverseTransform = m;
2278-
gd._fullLayout._inverseScaleX = Math.sqrt(m[0][0] * m[0][0] + m[0][1] * m[0][1] + m[0][2] * m[0][2]);
2279-
gd._fullLayout._inverseScaleY = Math.sqrt(m[1][0] * m[1][0] + m[1][1] * m[1][1] + m[1][2] * m[1][2]);
2280-
}
2281-
22822275
function _drag(start, end) {
22832276
var localStart = _getLocalPos(gd, start);
22842277
var localEnd = _getLocalPos(gd, end);
@@ -2329,30 +2322,40 @@ describe('Cartesian plots with css transforms', function() {
23292322
margin: {l: 0, t: 0, r: 0, b: 0}
23302323
}
23312324
};
2332-
var transforms = ['scale(0.5)'];
23332325

2334-
transforms.forEach(function(transform) {
2326+
[{
2327+
transform: 'scaleX(0.5)',
2328+
hovered: 1,
2329+
selected: {numPoints: 1, selectedLabels: ['two']}
2330+
}, {
2331+
transform: 'scale(0.5)',
2332+
hovered: 1,
2333+
selected: {numPoints: 2, selectedLabels: ['one', 'two']}
2334+
}, {
2335+
transform: 'scale(0.25) translate(150px, 25%) scaleY(2)',
2336+
hovered: 1,
2337+
selected: {numPoints: 3, selectedLabels: ['one', 'two', 'three']}
2338+
}].forEach(function(t) {
2339+
var transform = t.transform;
2340+
23352341
it('hover behaves correctly after css transform: ' + transform, function(done) {
23362342
function _hoverAndAssertEventOccurred(point, label) {
23372343
return _hover(point)
23382344
.then(function() {
2339-
expect(eventRecordings[label]).toBe(1);
2345+
expect(eventRecordings[label]).toBe(t.hovered);
23402346
})
23412347
.then(function() {
23422348
_unhover(point);
23432349
});
23442350
}
23452351

2346-
Plotly.plot(gd, Lib.extendDeep({}, mock))
2352+
transformPlot(gd, transform);
2353+
Plotly.newPlot(gd, Lib.extendDeep({}, mock))
23472354
.then(function() {
23482355
gd.on('plotly_hover', function(d) {
23492356
eventRecordings[d.points[0].x] = 1;
23502357
});
23512358
})
2352-
.then(function() {
2353-
transformPlot(gd, transform);
2354-
recalculateInverse(gd);
2355-
})
23562359
.then(function() {_hoverAndAssertEventOccurred(points[0], xLabels[0]);})
23572360
.then(function() {_hoverAndAssertEventOccurred(points[1], xLabels[1]);})
23582361
.then(function() {_hoverAndAssertEventOccurred(points[2], xLabels[2]);})
@@ -2381,7 +2384,7 @@ describe('Cartesian plots with css transforms', function() {
23812384
var size = [endPos[0] - startPos[0], endPos[1] - startPos[1]];
23822385
var zb = d3.select(gd).select('g.zoomlayer > path.zoombox');
23832386
var zoomboxRect = _getZoomlayerPathRect(zb.attr('d'));
2384-
expect(zoomboxRect.left).toBeCloseTo(startPos[0]);
2387+
expect(zoomboxRect.left).toBeCloseTo(startPos[0], -1);
23852388
expect(zoomboxRect.top).toBeCloseTo(startPos[1]);
23862389
expect(zoomboxRect.width).toBeCloseTo(size[0]);
23872390
expect(zoomboxRect.height).toBeCloseTo(size[1]);
@@ -2390,11 +2393,8 @@ describe('Cartesian plots with css transforms', function() {
23902393
var start = [50, 50];
23912394
var end = [150, 150];
23922395

2393-
Plotly.plot(gd, Lib.extendDeep({}, mock))
2394-
.then(function() {
2395-
transformPlot(gd, transform);
2396-
recalculateInverse(gd);
2397-
})
2396+
transformPlot(gd, transform);
2397+
Plotly.newPlot(gd, Lib.extendDeep({}, mock))
23982398
.then(function() {_drag(start, end); })
23992399
.then(function() {
24002400
_assertTransformedZoombox(start, end);
@@ -2421,19 +2421,16 @@ describe('Cartesian plots with css transforms', function() {
24212421
var start = [10, 10];
24222422
var end = [200, 200];
24232423

2424-
Plotly.plot(gd, Lib.extendDeep({}, mock))
2425-
.then(function() {
2426-
transformPlot(gd, transform);
2427-
recalculateInverse(gd);
2428-
})
2424+
transformPlot(gd, transform);
2425+
Plotly.newPlot(gd, Lib.extendDeep({}, mock))
24292426
.then(function() {
24302427
return Plotly.relayout(gd, 'dragmode', 'select');
24312428
})
24322429
.then(function() {
24332430
_dragRelease(start, end);
24342431
})
24352432
.then(function() {
2436-
_assertSelected({numPoints: 2, selectedLabels: ['one', 'two']});
2433+
_assertSelected(t.selected);
24372434
})
24382435
.catch(failTest)
24392436
.then(done);

‎test/jasmine/tests/polar_test.js‎

Lines changed: 29 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1622,14 +1622,6 @@ describe('Polar plots with css transforms', function() {
16221622
gd.style.transform = transformString;
16231623
}
16241624

1625-
function recalculateInverse(gd) {
1626-
var m = Lib.inverseTransformMatrix(Lib.getFullTransformMatrix(gd));
1627-
gd._fullLayout._inverseTransform = m;
1628-
gd._fullLayout._inverseScaleX = Math.sqrt(m[0][0] * m[0][0] + m[0][1] * m[0][1] + m[0][2] * m[0][2]);
1629-
gd._fullLayout._inverseScaleY = Math.sqrt(m[1][0] * m[1][0] + m[1][1] * m[1][1] + m[1][2] * m[1][2]);
1630-
}
1631-
1632-
16331625
function _drag(start, dp) {
16341626
var node = d3.select('.polar > .draglayer > .maindrag').node();
16351627
var localStart = _getLocalPos(gd, start);
@@ -1681,47 +1673,56 @@ describe('Polar plots with css transforms', function() {
16811673
hovermode: 'closest'
16821674
}
16831675
};
1684-
var transforms = ['scale(0.5)'];
16851676

1686-
transforms.forEach(function(transform) {
1677+
[{
1678+
transform: 'scaleX(0.75)',
1679+
hovered: 1,
1680+
zoomed: [0, 1, 2, 3],
1681+
selected: {numPoints: 2}
1682+
}, {
1683+
transform: 'scale(0.5)',
1684+
hovered: 4,
1685+
zoomed: [0, 3],
1686+
selected: {numPoints: 3}
1687+
}, {
1688+
transform: 'scale(0.5) translate(-200px, 25%)',
1689+
hovered: 4,
1690+
zoomed: [0, 3],
1691+
selected: {numPoints: 3}
1692+
}].forEach(function(t) {
1693+
var transform = t.transform;
1694+
16871695
it('hover behaves correctly after css transform: ' + transform, function(done) {
16881696
var hoverEvents = {};
16891697

1690-
Plotly.plot(gd, Lib.extendDeep({}, mock))
1698+
transformPlot(gd, transform);
1699+
Plotly.newPlot(gd, Lib.extendDeep({}, mock))
16911700
.then(function() {
16921701
gd.on('plotly_hover', function(d) {
16931702
hoverEvents[d.points[0].pointIndex] = true;
16941703
});
16951704
})
1696-
.then(function() {
1697-
transformPlot(gd, transform);
1698-
recalculateInverse(gd);
1699-
})
17001705
.then(function() { _hover([32, 32]); })
17011706
.then(function() { _hover([65, 65]); })
17021707
.then(function() { _hover([132, 132]); })
17031708
.then(function() { _hover([165, 165]); })
17041709
.then(function() {
1705-
expect(Object.keys(hoverEvents).length).toBe(4);
1710+
expect(Object.keys(hoverEvents).length).toBe(t.hovered);
17061711
})
17071712
.catch(failTest)
17081713
.then(done);
17091714
});
17101715

17111716
it('drag-zoom behaves correctly after css transform: ' + transform, function(done) {
1712-
Plotly.plot(gd, Lib.extendDeep({}, mock))
1713-
.then(function() {
1714-
transformPlot(gd, transform);
1715-
recalculateInverse(gd);
1716-
})
1717+
transformPlot(gd, transform);
1718+
Plotly.newPlot(gd, Lib.extendDeep({}, mock))
1719+
17171720
.then(function() {
1718-
return _drag([30, 30], [50, 50]);
1721+
return _drag([10, 10], [50, 50]);
17191722
})
17201723
.then(function() {
17211724
var points = _getVisiblePointsData();
1722-
expect(points.length).toBe(2);
1723-
expect(points[0].i).toBe(0);
1724-
expect(points[1].i).toBe(3);
1725+
expect(points.map(function(e) { return e.i; })).toEqual(t.zoomed);
17251726
})
17261727
.catch(failTest)
17271728
.then(done);
@@ -1737,17 +1738,14 @@ describe('Polar plots with css transforms', function() {
17371738
}
17381739
}
17391740

1740-
Plotly.plot(gd, Lib.extendDeep({}, mock))
1741-
.then(function() {
1742-
transformPlot(gd, transform);
1743-
recalculateInverse(gd);
1744-
})
1741+
transformPlot(gd, transform);
1742+
Plotly.newPlot(gd, Lib.extendDeep({}, mock))
17451743
.then(function() {
17461744
return Plotly.relayout(gd, 'dragmode', 'select');
17471745
})
17481746
.then(function() { return _drag([30, 30], [130, 130]); })
17491747
.then(function() {
1750-
_assertSelected({numPoints: 3});
1748+
_assertSelected(t.selected);
17511749
})
17521750
.catch(failTest)
17531751
.then(done);

0 commit comments

Comments
 (0)