Skip to content

Commit 127f171

Browse files
committed
expand choropleth hover tests to cover css transform
1 parent 805d97b commit 127f171

File tree

1 file changed

+137
-97
lines changed

1 file changed

+137
-97
lines changed

test/jasmine/tests/choropleth_test.js

Lines changed: 137 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -156,8 +156,21 @@ describe('Test choropleth hover:', function() {
156156

157157
afterEach(destroyGraphDiv);
158158

159-
function run(pos, fig, content, style) {
159+
function transformPlot(gd, transformString) {
160+
gd.style.webkitTransform = transformString;
161+
gd.style.MozTransform = transformString;
162+
gd.style.msTransform = transformString;
163+
gd.style.OTransform = transformString;
164+
gd.style.transform = transformString;
165+
}
166+
167+
function run(hasCssTransform, pos, fig, content, style) {
160168
gd = createGraphDiv();
169+
var scale = 1;
170+
if(hasCssTransform) {
171+
scale = 0.5;
172+
transformPlot(gd, 'translate(-25%, -25%) scale(0.5)');
173+
}
161174

162175
style = style || {
163176
bgcolor: 'rgb(68, 68, 68)',
@@ -168,7 +181,7 @@ describe('Test choropleth hover:', function() {
168181
};
169182

170183
return Plotly.plot(gd, fig).then(function() {
171-
mouseEvent('mousemove', pos[0], pos[1]);
184+
mouseEvent('mousemove', scale * pos[0], scale * pos[1]);
172185
assertHoverLabelContent({
173186
nums: content[0],
174187
name: content[1]
@@ -180,102 +193,123 @@ describe('Test choropleth hover:', function() {
180193
});
181194
}
182195

183-
it('should generate hover label info (base)', function(done) {
184-
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
185-
186-
run(
187-
[400, 160],
188-
fig,
189-
['RUS\n10', 'trace 1']
190-
)
191-
.then(done);
196+
[false, true].forEach(function(hasCssTransform) {
197+
it('should generate hover label info (base), hasCssTransform: ' + hasCssTransform, function(done) {
198+
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
199+
200+
run(
201+
hasCssTransform,
202+
[400, 160],
203+
fig,
204+
['RUS\n10', 'trace 1']
205+
)
206+
.then(done);
207+
});
192208
});
193209

194-
it('should use the hovertemplate', function(done) {
195-
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
196-
fig.data[1].hovertemplate = 'tpl %{z}<extra>x</extra>';
197-
198-
run(
199-
[400, 160],
200-
fig,
201-
['tpl 10', 'x']
202-
)
203-
.then(done);
210+
[false, true].forEach(function(hasCssTransform) {
211+
it('should use the hovertemplate, hasCssTransform: ' + hasCssTransform, function(done) {
212+
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
213+
fig.data[1].hovertemplate = 'tpl %{z}<extra>x</extra>';
214+
215+
run(
216+
hasCssTransform,
217+
[400, 160],
218+
fig,
219+
['tpl 10', 'x']
220+
)
221+
.then(done);
222+
});
204223
});
205224

206-
it('should generate hover label info (\'text\' single value case)', function(done) {
207-
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
208-
fig.data[1].text = 'tExT';
209-
fig.data[1].hoverinfo = 'text';
210-
211-
run(
212-
[400, 160],
213-
fig,
214-
['tExT', null]
215-
)
216-
.then(done);
225+
[false, true].forEach(function(hasCssTransform) {
226+
it('should generate hover label info (\'text\' single value case), hasCssTransform: ' + hasCssTransform, function(done) {
227+
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
228+
fig.data[1].text = 'tExT';
229+
fig.data[1].hoverinfo = 'text';
230+
231+
run(
232+
hasCssTransform,
233+
[400, 160],
234+
fig,
235+
['tExT', null]
236+
)
237+
.then(done);
238+
});
217239
});
218240

219-
it('should generate hover label info (\'text\' array case)', function(done) {
220-
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
221-
fig.data[1].text = ['tExT', 'TeXt', '-text-'];
222-
fig.data[1].hoverinfo = 'text';
223-
224-
run(
225-
[400, 160],
226-
fig,
227-
['-text-', null]
228-
)
229-
.then(done);
241+
[false, true].forEach(function(hasCssTransform) {
242+
it('should generate hover label info (\'text\' array case), hasCssTransform: ' + hasCssTransform, function(done) {
243+
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
244+
fig.data[1].text = ['tExT', 'TeXt', '-text-'];
245+
fig.data[1].hoverinfo = 'text';
246+
247+
run(
248+
hasCssTransform,
249+
[400, 160],
250+
fig,
251+
['-text-', null]
252+
)
253+
.then(done);
254+
});
230255
});
231256

232-
it('should generate hover labels from `hovertext`', function(done) {
233-
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
234-
fig.data[1].hovertext = ['tExT', 'TeXt', '-text-'];
235-
fig.data[1].text = ['N', 'O', 'P'];
236-
fig.data[1].hoverinfo = 'text';
237-
238-
run(
239-
[400, 160],
240-
fig,
241-
['-text-', null]
242-
)
243-
.then(done);
257+
[false, true].forEach(function(hasCssTransform) {
258+
it('should generate hover labels from `hovertext`, hasCssTransform: ' + hasCssTransform, function(done) {
259+
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
260+
fig.data[1].hovertext = ['tExT', 'TeXt', '-text-'];
261+
fig.data[1].text = ['N', 'O', 'P'];
262+
fig.data[1].hoverinfo = 'text';
263+
264+
run(
265+
hasCssTransform,
266+
[400, 160],
267+
fig,
268+
['-text-', null]
269+
)
270+
.then(done);
271+
});
244272
});
245273

246-
it('should generate hover label with custom styling', function(done) {
247-
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
248-
fig.data[1].hoverlabel = {
249-
bgcolor: 'red',
250-
bordercolor: ['blue', 'black', 'green'],
251-
font: {family: 'Roboto'}
252-
};
274+
[false, true].forEach(function(hasCssTransform) {
275+
it('should generate hover label with custom styling, hasCssTransform: ' + hasCssTransform, function(done) {
276+
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
277+
fig.data[1].hoverlabel = {
278+
bgcolor: 'red',
279+
bordercolor: ['blue', 'black', 'green'],
280+
font: {family: 'Roboto'}
281+
};
253282

254-
run(
255-
[400, 160],
256-
fig,
257-
['RUS\n10', 'trace 1'],
258-
{
259-
bgcolor: 'rgb(255, 0, 0)',
260-
bordercolor: 'rgb(0, 128, 0)',
261-
fontColor: 'rgb(0, 128, 0)',
262-
fontSize: 13,
263-
fontFamily: 'Roboto'
264-
}
265-
)
266-
.then(done);
283+
run(
284+
hasCssTransform,
285+
[400, 160],
286+
fig,
287+
['RUS\n10', 'trace 1'],
288+
{
289+
bgcolor: 'rgb(255, 0, 0)',
290+
bordercolor: 'rgb(0, 128, 0)',
291+
fontColor: 'rgb(0, 128, 0)',
292+
fontSize: 13,
293+
fontFamily: 'Roboto'
294+
}
295+
)
296+
.then(done);
297+
});
267298
});
268299

269-
it('should generate hover label with arrayOk \'hoverinfo\' settings', function(done) {
270-
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
271-
fig.data[1].hoverinfo = ['location', 'z', 'location+name'];
272-
273-
run(
274-
[400, 160],
275-
fig,
276-
['RUS', 'trace 1']
277-
)
278-
.then(done);
300+
[false, true].forEach(function(hasCssTransform) {
301+
it('should generate hover label with arrayOk \'hoverinfo\' settings, hasCssTransform: ' + hasCssTransform, function(done) {
302+
var fig = Lib.extendDeep({}, require('@mocks/geo_first.json'));
303+
fig.data[1].hoverinfo = ['location', 'z', 'location+name'];
304+
305+
run(
306+
hasCssTransform,
307+
[400, 160],
308+
fig,
309+
['RUS', 'trace 1']
310+
)
311+
.then(done);
312+
});
279313
});
280314

281315
describe('should preserve z formatting hovetemplate equivalence', function() {
@@ -292,24 +326,30 @@ describe('Test choropleth hover:', function() {
292326
var pos = [400, 160];
293327
var exp = ['10.02132', 'RUS'];
294328

295-
it('- base case (truncate z decimals)', function(done) {
296-
run(pos, base(), exp).then(done);
329+
[false, true].forEach(function(hasCssTransform) {
330+
it('- base case (truncate z decimals), hasCssTransform: ' + hasCssTransform, function(done) {
331+
run(hasCssTransform, pos, base(), exp).then(done);
332+
});
297333
});
298334

299-
it('- hovertemplate case (same z truncation)', function(done) {
300-
var fig = base();
301-
fig.hovertemplate = '%{z}<extra>%{location}</extra>';
302-
run(pos, fig, exp).then(done);
335+
[false, true].forEach(function(hasCssTransform) {
336+
it('- hovertemplate case (same z truncation), hasCssTransform: ' + hasCssTransform, function(done) {
337+
var fig = base();
338+
fig.hovertemplate = '%{z}<extra>%{location}</extra>';
339+
run(hasCssTransform, pos, fig, exp).then(done);
340+
});
303341
});
304342
});
305343

306-
it('should include *properties* from input custom geojson', function(done) {
307-
var fig = Lib.extendDeep({}, require('@mocks/geo_custom-geojson.json'));
308-
fig.data = [fig.data[1]];
309-
fig.data[0].hovertemplate = '%{properties.name}<extra>%{ct[0]:.1f} | %{ct[1]:.1f}</extra>';
310-
fig.layout.geo.projection = {scale: 20};
344+
[false, true].forEach(function(hasCssTransform) {
345+
it('should include *properties* from input custom geojson, hasCssTransform: ' + hasCssTransform, function(done) {
346+
var fig = Lib.extendDeep({}, require('@mocks/geo_custom-geojson.json'));
347+
fig.data = [fig.data[1]];
348+
fig.data[0].hovertemplate = '%{properties.name}<extra>%{ct[0]:.1f} | %{ct[1]:.1f}</extra>';
349+
fig.layout.geo.projection = {scale: 20};
311350

312-
run([300, 200], fig, ['New York', '-75.1 | 42.6']).then(done);
351+
run(hasCssTransform, [300, 200], fig, ['New York', '-75.1 | 42.6']).then(done);
352+
});
313353
});
314354
});
315355

0 commit comments

Comments
 (0)