Skip to content

Commit 1f6e711

Browse files
etpinardetpinard
committed
improve axis automargin tests
- start tests with margin:{l:0, t:0, r:0, b:0} to get more consistent result machine-to-machine - add a few check to 🔒 #3579 even more
1 parent 6c7db5e commit 1f6e711

File tree

1 file changed

+132
-174
lines changed

1 file changed

+132
-174
lines changed

‎test/jasmine/tests/axes_test.js

+132-174
Original file line numberDiff line numberDiff line change
@@ -3235,23 +3235,7 @@ describe('Test axes', function() {
32353235
});
32363236

32373237
describe('automargin', function() {
3238-
var data = [{
3239-
x: [
3240-
'short label 1', 'loooooong label 1',
3241-
'short label 2', 'loooooong label 2',
3242-
'short label 3', 'loooooong label 3',
3243-
'short label 4', 'loooooongloooooongloooooong label 4',
3244-
'short label 5', 'loooooong label 5'
3245-
],
3246-
y: [
3247-
'short label 1', 'loooooong label 1',
3248-
'short label 2', 'loooooong label 2',
3249-
'short label 3', 'loooooong label 3',
3250-
'short label 4', 'loooooong label 4',
3251-
'short label 5', 'loooooong label 5'
3252-
]
3253-
}];
3254-
var gd, initialSize, previousSize, savedBottom;
3238+
var gd;
32553239

32563240
beforeEach(function() {
32573241
gd = createGraphDiv();
@@ -3260,170 +3244,144 @@ describe('Test axes', function() {
32603244
afterEach(destroyGraphDiv);
32613245

32623246
it('should grow and shrink margins', function(done) {
3247+
var initialSize;
3248+
var previousSize;
3249+
3250+
function assertSize(msg, actual, exp) {
3251+
for(var k in exp) {
3252+
var parts = exp[k].split(' -');
3253+
var op = parts[0];
3254+
3255+
var method = {
3256+
'=': 'toBe',
3257+
'~=': 'toBeWithin',
3258+
grew: 'toBeGreaterThan',
3259+
shrunk: 'toBeLessThan',
3260+
initial: 'toBe'
3261+
}[op];
3262+
3263+
var val = op === 'initial' ? initialSize[k] : previousSize[k];
3264+
var msgk = msg + ' ' + k + (parts[1] ? ' -' + parts[1] : '');
3265+
var args = op === '~=' ? [val, 1.1, msgk] : [val, msgk, ''];
3266+
3267+
expect(actual[k])[method](args[0], args[1], args[2]);
3268+
}
3269+
}
32633270

3264-
Plotly.plot(gd, data)
3265-
.then(function() {
3266-
expect(gd._fullLayout.xaxis._tickAngles.xtick).toBe(30);
3267-
3268-
initialSize = previousSize = Lib.extendDeep({}, gd._fullLayout._size);
3269-
return Plotly.relayout(gd, {'yaxis.automargin': true});
3270-
})
3271-
.then(function() {
3272-
var size = gd._fullLayout._size;
3273-
expect(size.l).toBeGreaterThan(previousSize.l);
3274-
expect(size.r).toBe(previousSize.r);
3275-
expect(size.b).toBe(previousSize.b);
3276-
expect(size.t).toBe(previousSize.t);
3277-
3278-
previousSize = Lib.extendDeep({}, size);
3279-
return Plotly.relayout(gd, {'xaxis.automargin': true});
3280-
})
3281-
.then(function() {
3282-
var size = gd._fullLayout._size;
3283-
expect(size.l).toBe(previousSize.l);
3284-
expect(size.r).toBe(previousSize.r);
3285-
expect(size.b).toBeGreaterThan(previousSize.b);
3286-
expect(size.t).toBe(previousSize.t);
3287-
3288-
previousSize = Lib.extendDeep({}, size);
3289-
savedBottom = previousSize.b;
3290-
3291-
// move all the long x labels off-screen
3292-
return Plotly.relayout(gd, {'xaxis.range': [-10, -5]});
3293-
})
3294-
.then(function() {
3295-
var size = gd._fullLayout._size;
3296-
expect(size.l).toBe(previousSize.l);
3297-
expect(size.r).toBe(previousSize.r);
3298-
expect(size.t).toBe(previousSize.t);
3299-
expect(size.b).toBe(initialSize.b);
3300-
3301-
// move all the long y labels off-screen
3302-
return Plotly.relayout(gd, {'yaxis.range': [-10, -5]});
3303-
})
3304-
.then(function() {
3305-
var size = gd._fullLayout._size;
3306-
expect(size.l).toBe(initialSize.l);
3307-
expect(size.r).toBe(previousSize.r);
3308-
expect(size.t).toBe(previousSize.t);
3309-
expect(size.b).toBe(initialSize.b);
3310-
3311-
// bring the long labels back
3312-
return Plotly.relayout(gd, {
3313-
'xaxis.autorange': true,
3314-
'yaxis.autorange': true
3315-
});
3316-
})
3317-
.then(function() {
3318-
var size = gd._fullLayout._size;
3319-
expect(size.l).toBe(previousSize.l);
3320-
expect(size.r).toBe(previousSize.r);
3321-
expect(size.t).toBe(previousSize.t);
3322-
expect(size.b).toBe(previousSize.b);
3323-
3324-
return Plotly.relayout(gd, {'xaxis.tickangle': 45});
3325-
})
3326-
.then(function() {
3327-
var size = gd._fullLayout._size;
3328-
expect(size.l).toBe(previousSize.l);
3329-
expect(size.r).toBe(previousSize.r);
3330-
expect(size.b).toBeGreaterThan(previousSize.b);
3331-
expect(size.t).toBe(previousSize.t);
3332-
3333-
previousSize = Lib.extendDeep({}, size);
3334-
return Plotly.relayout(gd, {'xaxis.tickangle': 30});
3335-
})
3336-
.then(function() {
3337-
var size = gd._fullLayout._size;
3338-
expect(size.l).toBe(previousSize.l);
3339-
expect(size.r).toBe(previousSize.r);
3340-
expect(size.b).toBe(savedBottom);
3341-
expect(size.t).toBe(previousSize.t);
3342-
3343-
previousSize = Lib.extendDeep({}, size);
3344-
return Plotly.relayout(gd, {'yaxis.ticklen': 30});
3345-
})
3346-
.then(function() {
3347-
var size = gd._fullLayout._size;
3348-
expect(size.l).toBeGreaterThan(previousSize.l);
3349-
expect(size.r).toBe(previousSize.r);
3350-
expect(size.b).toBe(previousSize.b);
3351-
expect(size.t).toBe(previousSize.t);
3352-
3353-
previousSize = Lib.extendDeep({}, size);
3354-
return Plotly.relayout(gd, {'yaxis.title.font.size': 30});
3355-
})
3356-
.then(function() {
3357-
var size = gd._fullLayout._size;
3358-
expect(size).toEqual(previousSize);
3359-
3360-
previousSize = Lib.extendDeep({}, size);
3361-
return Plotly.relayout(gd, {'yaxis.title.text': 'hello'});
3362-
})
3363-
.then(function() {
3364-
var size = gd._fullLayout._size;
3365-
expect(size.l).toBeGreaterThan(previousSize.l);
3366-
expect(size.r).toBe(previousSize.r);
3367-
expect(size.b).toBe(previousSize.b);
3368-
expect(size.t).toBe(previousSize.t);
3369-
3370-
previousSize = Lib.extendDeep({}, size);
3371-
return Plotly.relayout(gd, {'yaxis.anchor': 'free'});
3372-
})
3373-
.then(function() {
3374-
var size = gd._fullLayout._size;
3375-
expect(size.l).toBeWithin(previousSize.l, 1.1);
3376-
expect(size.r).toBe(previousSize.r);
3377-
expect(size.b).toBe(previousSize.b);
3378-
expect(size.t).toBe(previousSize.t);
3379-
3380-
previousSize = Lib.extendDeep({}, size);
3381-
return Plotly.relayout(gd, {'yaxis.position': 0.1});
3382-
})
3383-
.then(function() {
3384-
var size = gd._fullLayout._size;
3385-
expect(size.l).toBeLessThan(previousSize.l, 'axis moved right');
3386-
expect(size.r).toBe(previousSize.r);
3387-
expect(size.b).toBe(previousSize.b);
3388-
expect(size.t).toBe(previousSize.t);
3389-
3390-
previousSize = Lib.extendDeep({}, size);
3391-
return Plotly.relayout(gd, {'yaxis.anchor': 'x'});
3392-
})
3393-
.then(function() {
3394-
var size = gd._fullLayout._size;
3395-
expect(size.l).toBeGreaterThan(previousSize.l, 'axis snapped back');
3396-
expect(size.r).toBe(previousSize.r);
3397-
expect(size.b).toBe(previousSize.b);
3398-
expect(size.t).toBe(previousSize.t);
3271+
function check(msg, relayoutObj, exp) {
3272+
return function() {
3273+
return Plotly.relayout(gd, relayoutObj).then(function() {
3274+
var gs = Lib.extendDeep({}, gd._fullLayout._size);
3275+
assertSize(msg, gs, exp);
3276+
previousSize = gs;
3277+
});
3278+
};
3279+
}
33993280

3400-
previousSize = Lib.extendDeep({}, size);
3401-
return Plotly.relayout(gd, {
3402-
'yaxis.side': 'right',
3403-
'xaxis.side': 'top'
3404-
});
3281+
Plotly.plot(gd, [{
3282+
x: [
3283+
'short label 1', 'loooooong label 1',
3284+
'short label 2', 'loooooong label 2',
3285+
'short label 3', 'loooooong label 3',
3286+
'short label 4', 'loooooongloooooongloooooong label 4',
3287+
'short label 5', 'loooooong label 5'
3288+
],
3289+
y: [
3290+
'short label 1', 'loooooong label 1',
3291+
'short label 2', 'loooooong label 2',
3292+
'short label 3', 'loooooong label 3',
3293+
'short label 4', 'loooooong label 4',
3294+
'short label 5', 'loooooong label 5'
3295+
]
3296+
}], {
3297+
margin: {l: 0, r: 0, b: 0, t: 0},
3298+
width: 600, height: 600
34053299
})
34063300
.then(function() {
3407-
var size = gd._fullLayout._size;
3408-
// left to right and bottom to top
3409-
expect(size.l).toBe(initialSize.r);
3410-
expect(size.r).toBe(previousSize.l);
3411-
expect(size.b).toBe(initialSize.b);
3412-
expect(size.t).toBeWithin(previousSize.b, 1.1);
3301+
expect(gd._fullLayout.xaxis._tickAngles.xtick).toBe(30);
34133302

3414-
return Plotly.relayout(gd, {
3415-
'xaxis.automargin': false,
3416-
'yaxis.automargin': false
3417-
});
3418-
})
3419-
.then(function() {
3420-
var size = gd._fullLayout._size;
3421-
// back to the defaults
3422-
expect(size).toEqual(initialSize);
3423-
})
3303+
var gs = gd._fullLayout._size;
3304+
initialSize = Lib.extendDeep({}, gs);
3305+
previousSize = Lib.extendDeep({}, gs);
3306+
})
3307+
.then(check('automargin y', {'yaxis.automargin': true}, {
3308+
t: '=', l: 'grew',
3309+
b: '=', r: '='
3310+
}))
3311+
.then(check('automargin x', {'xaxis.automargin': true}, {
3312+
t: '=', l: '=',
3313+
b: 'grew', r: 'grew'
3314+
}))
3315+
.then(check('move all x label off-screen', {'xaxis.range': [-10, -5]}, {
3316+
t: '=', l: '=',
3317+
b: 'initial', r: 'initial'
3318+
}))
3319+
.then(check('move all y label off-screen', {'yaxis.range': [-10, -5]}, {
3320+
t: '=', l: 'initial',
3321+
b: '=', r: '='
3322+
}))
3323+
.then(check('back to label for auto ranges', {'xaxis.autorange': true, 'yaxis.autorange': true}, {
3324+
t: '=', l: 'grew',
3325+
b: 'grew', r: 'grew'
3326+
}))
3327+
.then(check('tilt x label to 45 degrees', {'xaxis.tickangle': 45}, {
3328+
t: '=', l: '=',
3329+
b: 'grew', r: 'shrunk'
3330+
}))
3331+
.then(check('tilt x labels back to 30 degrees', {'xaxis.tickangle': 30}, {
3332+
t: '=', l: '=',
3333+
b: 'shrunk', r: 'grew'
3334+
}))
3335+
.then(check('bump y-axis tick length', {'yaxis.ticklen': 30}, {
3336+
t: '=', l: 'grew',
3337+
b: '=', r: 'grew - as x ticks got shifted right'
3338+
}))
3339+
.then(check('add y-axis title', {'yaxis.title.text': 'hello'}, {
3340+
t: '=', l: 'grew',
3341+
b: '=', r: 'grew - as x ticks got shifted right'
3342+
}))
3343+
.then(check('size up y-axis title', {'yaxis.title.font.size': 30}, {
3344+
t: '=', l: 'grew',
3345+
b: '=', r: 'grew - as x ticks got shifted right'
3346+
}))
3347+
.then(check('tilt y labels up 30 degrees', {'yaxis.tickangle': 30}, {
3348+
t: 'grew', l: 'shrunk',
3349+
b: '=', r: 'shrunk - as x ticks got shifted left'
3350+
}))
3351+
.then(check('un-tilt y labels', {'yaxis.tickangle': null}, {
3352+
t: 'shrunk', l: 'grew',
3353+
b: '=', r: 'grew'
3354+
}))
3355+
.then(check('unanchor y-axis', {'yaxis.anchor': 'free'}, {
3356+
t: '=', l: '~=',
3357+
b: '=', r: '='
3358+
}))
3359+
.then(check('offset y-axis to the left', {'yaxis.position': 0.1}, {
3360+
t: '=', l: 'shrunk - as y-axis shifted right',
3361+
b: '=', r: 'shrunk - as y-axis shifted right'
3362+
}))
3363+
.then(check('re-anchor y-axis', {'yaxis.anchor': 'x'}, {
3364+
t: '=', l: 'grew',
3365+
b: '=', r: 'grew'
3366+
}))
3367+
.then(check('flip axis side', {'yaxis.side': 'right', 'xaxis.side': 'top'}, {
3368+
t: 'grew', l: 'shrunk',
3369+
b: 'shrunk', r: 'grew'
3370+
}))
3371+
.then(check('tilt x labels vertically', {'xaxis.tickangle': 90}, {
3372+
t: 'grew', l: 'shrunk',
3373+
b: '=', r: '='
3374+
}))
3375+
.then(check('tilt y labels down 30 degrees', {'yaxis.tickangle': 30}, {
3376+
t: '=', l: '=',
3377+
b: 'grew', r: 'shrunk'
3378+
}))
3379+
.then(check('turn off automargin', {'xaxis.automargin': false, 'yaxis.automargin': false}, {
3380+
t: 'initial', l: 'initial',
3381+
b: 'initial', r: 'initial'
3382+
}))
34243383
.catch(failTest)
34253384
.then(done);
3426-
34273385
});
34283386
});
34293387

0 commit comments

Comments
 (0)