Skip to content

Commit 6ccc457

Browse files
committed
mv mathjax axis title test to a bundle_test suite
- Removing MathJax from the page currently leads to errors in downstream tests.
1 parent ed7be86 commit 6ccc457

File tree

2 files changed

+164
-154
lines changed

2 files changed

+164
-154
lines changed
+164
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
var Plotly = require('@lib/index');
2+
var d3 = require('d3');
3+
4+
var createGraphDiv = require('../assets/create_graph_div');
5+
var destroyGraphDiv = require('../assets/destroy_graph_div');
6+
var failTest = require('../assets/fail_test');
7+
8+
describe('Test MathJax:', function() {
9+
var mathJaxScriptTag;
10+
11+
// N.B. we have to load MathJax "dynamically" as Karam
12+
// does not undefined the MathJax's `?config=` parameter.
13+
//
14+
// Eventually, it might be nice to move these tests in the "regular" test
15+
// suites, but to do that we'll need to find a way to remove MathJax from
16+
// page without breaking things downstream.
17+
beforeAll(function(done) {
18+
mathJaxScriptTag = document.createElement('script');
19+
mathJaxScriptTag.type = 'text/javascript';
20+
mathJaxScriptTag.onload = function() {
21+
require('@src/fonts/mathjax_config')();
22+
done();
23+
};
24+
mathJaxScriptTag.onerror = function() {
25+
fail('MathJax failed to load');
26+
};
27+
mathJaxScriptTag.src = '/base/dist/extras/mathjax/MathJax.js?config=TeX-AMS-MML_SVG';
28+
document.body.appendChild(mathJaxScriptTag);
29+
});
30+
31+
describe('Test axis title scoot:', function() {
32+
var gd;
33+
34+
beforeEach(function() {
35+
gd = createGraphDiv();
36+
});
37+
38+
afterEach(destroyGraphDiv);
39+
40+
function assertNoIntersect(msg) {
41+
var gd3 = d3.select(gd);
42+
var xTitle = gd3.select('.g-xtitle');
43+
var xTicks = gd3.selectAll('.xtick > text');
44+
45+
expect(xTitle.size()).toBe(1, '1 x-axis title');
46+
expect(xTicks.size()).toBeGreaterThan(1, 'x-axis ticks');
47+
48+
var titleTop = xTitle.node().getBoundingClientRect().top;
49+
50+
xTicks.each(function(_, i) {
51+
var tickBottom = this.getBoundingClientRect().bottom;
52+
expect(tickBottom).toBeLessThan(titleTop, 'xtick #' + i + ' - ' + msg);
53+
});
54+
}
55+
56+
function testTitleScoot(fig, opts) {
57+
var xCategories = opts.xCategories;
58+
59+
return Plotly.plot(gd, fig)
60+
.then(function() { assertNoIntersect('base'); })
61+
.then(function() { return Plotly.relayout(gd, 'xaxis.titlefont.size', 40); })
62+
.then(function() { assertNoIntersect('large title font size'); })
63+
.then(function() { return Plotly.relayout(gd, 'xaxis.titlefont.size', null); })
64+
.then(function() { assertNoIntersect('back to base'); })
65+
.then(function() { return Plotly.relayout(gd, 'xaxis.tickfont.size', 40); })
66+
.then(function() { assertNoIntersect('large title font size'); })
67+
.then(function() { return Plotly.relayout(gd, 'xaxis.tickfont.size', null); })
68+
.then(function() { assertNoIntersect('back to base 2'); })
69+
.then(function() { return Plotly.update(gd, {x: [xCategories]}, {'xaxis.tickangle': 90}); })
70+
.then(function() { assertNoIntersect('long tick labels'); })
71+
.then(function() { return Plotly.update(gd, {x: [null]}, {'xaxis.tickangle': null}); })
72+
.then(function() { assertNoIntersect('back to base 3'); });
73+
}
74+
75+
var longCats = ['aaaaaaaaa', 'bbbbbbbbb', 'cccccccc'];
76+
var texTitle = '$f(x) = \\int_0^\\infty \\psi(t) dt$';
77+
var texCats = ['$\\phi$', '$\\nabla \\cdot \\vec{F}$', '$\\frac{\\partial x}{\\partial y}$'];
78+
var longTexCats = [
79+
'$\\int_0^\\infty \\psi(t) dt$',
80+
'$\\alpha \\int_0^\\infty \\eta(t) dt$',
81+
'$\\int_0^\\infty \\zeta(t) dt$'
82+
];
83+
84+
it('should scoot x-axis title below x-axis ticks', function(done) {
85+
testTitleScoot({
86+
data: [{
87+
y: [1, 2, 1]
88+
}],
89+
layout: {
90+
xaxis: {title: 'TITLE'},
91+
width: 500,
92+
height: 500,
93+
margin: {t: 100, b: 100, l: 100, r: 100}
94+
}
95+
}, {
96+
xCategories: longCats
97+
})
98+
.catch(failTest)
99+
.then(done);
100+
});
101+
102+
it('should scoot x-axis title (with MathJax) below x-axis ticks', function(done) {
103+
expect(window.MathJax).toBeDefined();
104+
105+
testTitleScoot({
106+
data: [{
107+
y: [1, 2, 1]
108+
}],
109+
layout: {
110+
xaxis: {title: texTitle},
111+
width: 500,
112+
height: 500,
113+
margin: {t: 100, b: 100, l: 100, r: 100}
114+
}
115+
}, {
116+
xCategories: longCats
117+
})
118+
.catch(failTest)
119+
.then(done);
120+
});
121+
122+
it('should scoot x-axis title below x-axis ticks (with MathJax)', function(done) {
123+
expect(window.MathJax).toBeDefined();
124+
125+
testTitleScoot({
126+
data: [{
127+
x: texCats,
128+
y: [1, 2, 1]
129+
}],
130+
layout: {
131+
xaxis: {title: 'TITLE'},
132+
width: 500,
133+
height: 500,
134+
margin: {t: 100, b: 100, l: 100, r: 100}
135+
}
136+
}, {
137+
xCategories: longTexCats
138+
})
139+
.catch(failTest)
140+
.then(done);
141+
});
142+
143+
it('should scoot x-axis title (with MathJax) below x-axis ticks (with MathJax)', function(done) {
144+
expect(window.MathJax).toBeDefined();
145+
146+
testTitleScoot({
147+
data: [{
148+
x: texCats,
149+
y: [1, 2, 1]
150+
}],
151+
layout: {
152+
xaxis: {title: texTitle},
153+
width: 500,
154+
height: 500,
155+
margin: {t: 100, b: 100, l: 100, r: 100}
156+
}
157+
}, {
158+
xCategories: longTexCats
159+
})
160+
.catch(failTest)
161+
.then(done);
162+
});
163+
});
164+
});

test/jasmine/tests/axes_test.js

-154
Original file line numberDiff line numberDiff line change
@@ -3426,157 +3426,3 @@ describe('Test tickformatstops:', function() {
34263426
.then(done);
34273427
});
34283428
});
3429-
3430-
describe('Test axis title scoot:', function() {
3431-
var gd;
3432-
var mathJaxScriptTag;
3433-
3434-
beforeAll(function(done) {
3435-
mathJaxScriptTag = document.createElement('script');
3436-
mathJaxScriptTag.type = 'text/javascript';
3437-
mathJaxScriptTag.onload = function() {
3438-
require('@src/fonts/mathjax_config')();
3439-
done();
3440-
};
3441-
mathJaxScriptTag.onerror = function() {
3442-
fail('MathJax failed to load');
3443-
};
3444-
mathJaxScriptTag.src = '/base/dist/extras/mathjax/MathJax.js?config=TeX-AMS-MML_SVG';
3445-
document.body.appendChild(mathJaxScriptTag);
3446-
});
3447-
3448-
beforeEach(function() {
3449-
gd = createGraphDiv();
3450-
});
3451-
3452-
afterEach(destroyGraphDiv);
3453-
3454-
afterAll(function() {
3455-
document.body.removeChild(mathJaxScriptTag);
3456-
delete window.MathJax;
3457-
});
3458-
3459-
function assertNoIntersect(msg) {
3460-
var gd3 = d3.select(gd);
3461-
var xTitle = gd3.select('.g-xtitle');
3462-
var xTicks = gd3.selectAll('.xtick > text');
3463-
3464-
expect(xTitle.size()).toBe(1, '1 x-axis title');
3465-
expect(xTicks.size()).toBeGreaterThan(1, 'x-axis ticks');
3466-
3467-
var titleTop = xTitle.node().getBoundingClientRect().top;
3468-
3469-
xTicks.each(function(_, i) {
3470-
var tickBottom = this.getBoundingClientRect().bottom;
3471-
expect(tickBottom).toBeLessThan(titleTop, 'xtick #' + i + ' - ' + msg);
3472-
});
3473-
}
3474-
3475-
function testTitleScoot(fig, opts) {
3476-
var xCategories = opts.xCategories;
3477-
3478-
return Plotly.plot(gd, fig)
3479-
.then(function() { assertNoIntersect('base'); })
3480-
.then(function() { return Plotly.relayout(gd, 'xaxis.titlefont.size', 40); })
3481-
.then(function() { assertNoIntersect('large title font size'); })
3482-
.then(function() { return Plotly.relayout(gd, 'xaxis.titlefont.size', null); })
3483-
.then(function() { assertNoIntersect('back to base'); })
3484-
.then(function() { return Plotly.relayout(gd, 'xaxis.tickfont.size', 40); })
3485-
.then(function() { assertNoIntersect('large title font size'); })
3486-
.then(function() { return Plotly.relayout(gd, 'xaxis.tickfont.size', null); })
3487-
.then(function() { assertNoIntersect('back to base 2'); })
3488-
.then(function() { return Plotly.update(gd, {x: [xCategories]}, {'xaxis.tickangle': 90}); })
3489-
.then(function() { assertNoIntersect('long tick labels'); })
3490-
.then(function() { return Plotly.update(gd, {x: [null]}, {'xaxis.tickangle': null}); })
3491-
.then(function() { assertNoIntersect('back to base 3'); });
3492-
}
3493-
3494-
var longCats = ['aaaaaaaaa', 'bbbbbbbbb', 'cccccccc'];
3495-
var texTitle = '$f(x) = \\int_0^\\infty \\psi(t) dt$';
3496-
var texCats = ['$\\phi$', '$\\nabla \\cdot \\vec{F}$', '$\\frac{\\partial x}{\\partial y}$'];
3497-
var longTexCats = [
3498-
'$\\int_0^\\infty \\psi(t) dt$',
3499-
'$\\alpha \\int_0^\\infty \\eta(t) dt$',
3500-
'$\\int_0^\\infty \\zeta(t) dt$'
3501-
];
3502-
3503-
it('should scoot x-axis title below x-axis ticks', function(done) {
3504-
testTitleScoot({
3505-
data: [{
3506-
y: [1, 2, 1]
3507-
}],
3508-
layout: {
3509-
xaxis: {title: 'TITLE'},
3510-
width: 500,
3511-
height: 500,
3512-
margin: {t: 100, b: 100, l: 100, r: 100}
3513-
}
3514-
}, {
3515-
xCategories: longCats
3516-
})
3517-
.catch(failTest)
3518-
.then(done);
3519-
});
3520-
3521-
it('should scoot x-axis title (with MathJax) below x-axis ticks', function(done) {
3522-
expect(window.MathJax).toBeDefined();
3523-
3524-
testTitleScoot({
3525-
data: [{
3526-
y: [1, 2, 1]
3527-
}],
3528-
layout: {
3529-
xaxis: {title: texTitle},
3530-
width: 500,
3531-
height: 500,
3532-
margin: {t: 100, b: 100, l: 100, r: 100}
3533-
}
3534-
}, {
3535-
xCategories: longCats
3536-
})
3537-
.catch(failTest)
3538-
.then(done);
3539-
});
3540-
3541-
it('should scoot x-axis title below x-axis ticks (with MathJax)', function(done) {
3542-
expect(window.MathJax).toBeDefined();
3543-
3544-
testTitleScoot({
3545-
data: [{
3546-
x: texCats,
3547-
y: [1, 2, 1]
3548-
}],
3549-
layout: {
3550-
xaxis: {title: 'TITLE'},
3551-
width: 500,
3552-
height: 500,
3553-
margin: {t: 100, b: 100, l: 100, r: 100}
3554-
}
3555-
}, {
3556-
xCategories: longTexCats
3557-
})
3558-
.catch(failTest)
3559-
.then(done);
3560-
});
3561-
3562-
it('should scoot x-axis title (with MathJax) below x-axis ticks (with MathJax)', function(done) {
3563-
expect(window.MathJax).toBeDefined();
3564-
3565-
testTitleScoot({
3566-
data: [{
3567-
x: texCats,
3568-
y: [1, 2, 1]
3569-
}],
3570-
layout: {
3571-
xaxis: {title: texTitle},
3572-
width: 500,
3573-
height: 500,
3574-
margin: {t: 100, b: 100, l: 100, r: 100}
3575-
}
3576-
}, {
3577-
xCategories: longTexCats
3578-
})
3579-
.catch(failTest)
3580-
.then(done);
3581-
});
3582-
});

0 commit comments

Comments
 (0)