Skip to content

Commit d30265d

Browse files
striezelstriezel
committed
tests: add test case for 'Smooth Line Chart' example
1 parent 07234bf commit d30265d

File tree

1 file changed

+212
-0
lines changed

1 file changed

+212
-0
lines changed

‎export-server/tests/charts/line.test.js‎

Lines changed: 212 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -231,6 +231,218 @@ fill:rgba(255,255,255,1);
231231
232232
]]>
233233
234+
</style>
235+
</svg>`) > 0);
236+
});
237+
});
238+
});
239+
240+
it('Smoothed Line Chart', () => {
241+
const options = {
242+
port: 3000,
243+
host: 'localhost',
244+
method: 'POST',
245+
headers: {
246+
'X-Image-Format': 'svg'
247+
}
248+
};
249+
250+
const req = http.request(options);
251+
// Data taken from https://echarts.apache.org/examples/en/editor.html?c=line-smooth example.
252+
const payload = `{
253+
"xAxis": {
254+
"type": "category",
255+
"data": [ "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun" ]
256+
},
257+
"yAxis": {
258+
"type": "value"
259+
},
260+
"series": [
261+
{
262+
"data": [820, 932, 901, 934, 1290, 1330, 1320],
263+
"type": "line",
264+
"smooth": true
265+
}
266+
],
267+
"backgroundColor": "#ffffff"
268+
}`;
269+
req.write(payload);
270+
req.end();
271+
272+
req.on('response', (response) => {
273+
assert.strictEqual(200, response.statusCode);
274+
let body = '';
275+
response.on('data', (chunk) => {
276+
body += chunk;
277+
});
278+
response.on('end', () => {
279+
assert.ok(body.startsWith('<svg'));
280+
assert.ok(body.endsWith('</svg>'));
281+
282+
/* Current server response is something like
283+
284+
<svg width="700" height="400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="full" viewBox="0 0 700 400">
285+
<rect width="700" height="400" x="0" y="0" fill="#ffffff"></rect>
286+
<path d="M70 330.5L630 330.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="zr0-cls-0"></path>
287+
<path d="M70 276.5L630 276.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="zr0-cls-0"></path>
288+
<path d="M70 222.5L630 222.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="zr0-cls-0"></path>
289+
<path d="M70 168.5L630 168.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="zr0-cls-0"></path>
290+
<path d="M70 114.5L630 114.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="zr0-cls-0"></path>
291+
<path d="M70 60.5L630 60.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="zr0-cls-0"></path>
292+
<path d="M70 330.5L630 330.5" fill="none" pointer-events="visible" stroke="#6E7079" stroke-linecap="round" class="zr0-cls-0"></path>
293+
<path d="M70.5 330L70.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="zr0-cls-0"></path>
294+
<path d="M150.5 330L150.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="zr0-cls-0"></path>
295+
<path d="M230.5 330L230.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="zr0-cls-0"></path>
296+
<path d="M310.5 330L310.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="zr0-cls-0"></path>
297+
<path d="M390.5 330L390.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="zr0-cls-0"></path>
298+
<path d="M470.5 330L470.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="zr0-cls-0"></path>
299+
<path d="M550.5 330L550.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="zr0-cls-0"></path>
300+
<path d="M630.5 330L630.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="zr0-cls-0"></path>
301+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 330)" fill="#6E7079">0</text>
302+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 276)" fill="#6E7079">300</text>
303+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 222)" fill="#6E7079">600</text>
304+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 168)" fill="#6E7079">900</text>
305+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 114)" fill="#6E7079">1,200</text>
306+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 60)" fill="#6E7079">1,500</text>
307+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(110 338)" fill="#6E7079">Mon</text>
308+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(190 338)" fill="#6E7079">Tue</text>
309+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(270 338)" fill="#6E7079">Wed</text>
310+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(350 338)" fill="#6E7079">Thu</text>
311+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(430 338)" fill="#6E7079">Fri</text>
312+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(510 338)" fill="#6E7079">Sat</text>
313+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(590 338)" fill="#6E7079">Sun</text>
314+
<g clip-path="url(#zr0-c0)">
315+
<path d="M110 182.4C110 182.4 149.4 162.2 190 162.2C229.4 162.2 230 167.8 270 167.8C310 167.8 314.9 167.8 350 161.9C394.9 154.3 385.1 107 430 97.8C465.1 90.6 469.9 90.6 510 90.6C549.9 90.6 590 92.4 590 92.4" fill="none" pointer-events="visible" stroke="#5470c6" stroke-width="2" stroke-linejoin="bevel" class="zr0-cls-2"></path>
316+
</g>
317+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,110,182.4)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="0" ecmeta_ssr_type="chart" class="zr0-cls-3"></path>
318+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,190,162.24)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="1" ecmeta_ssr_type="chart" class="zr0-cls-3"></path>
319+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,270,167.82)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="2" ecmeta_ssr_type="chart" class="zr0-cls-3"></path>
320+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,350,161.88)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="3" ecmeta_ssr_type="chart" class="zr0-cls-3"></path>
321+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,430,97.8)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="4" ecmeta_ssr_type="chart" class="zr0-cls-3"></path>
322+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,510,90.6)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="5" ecmeta_ssr_type="chart" class="zr0-cls-3"></path>
323+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,590,92.4)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="6" ecmeta_ssr_type="chart" class="zr0-cls-3"></path>
324+
<defs >
325+
<clipPath id="zr0-c0">
326+
<path d="M69 59l562 0l0 272l-562 0Z" fill="#000" class="zr0-cls-1"></path>
327+
</clipPath>
328+
</defs>
329+
<style ><![CDATA[
330+
.zr0-cls-0:hover {
331+
pointer-events:none;
332+
}
333+
.zr0-cls-1:hover {
334+
cursor:pointer;
335+
fill:rgba(0,0,0,1);
336+
}
337+
.zr0-cls-2:hover {
338+
cursor:pointer;
339+
}
340+
.zr0-cls-3:hover {
341+
cursor:pointer;
342+
fill:rgba(255,255,255,1);
343+
}
344+
345+
]]>
346+
347+
</style>
348+
</svg>
349+
350+
*/
351+
352+
// Check partial matches, avoiding the random class / id bits.
353+
assert.ok(body.indexOf('<svg width="700" height="400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="full" viewBox="0 0 700 400">') >= 0);
354+
assert.ok(body.indexOf('<rect width="700" height="400" x="0" y="0" fill="#ffffff"></rect>') > 0);
355+
assert.ok(body.indexOf(`<path d="M70 330.5L630 330.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="`) > 0);
356+
assert.ok(body.indexOf(`"></path>
357+
<path d="M70 276.5L630 276.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="`) > 0);
358+
assert.ok(body.indexOf(`"></path>
359+
<path d="M70 222.5L630 222.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="`) > 0);
360+
assert.ok(body.indexOf(`"></path>
361+
<path d="M70 168.5L630 168.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="`) > 0);
362+
assert.ok(body.indexOf(`"></path>
363+
<path d="M70 114.5L630 114.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="`) > 0);
364+
assert.ok(body.indexOf(`"></path>
365+
<path d="M70 60.5L630 60.5" fill="none" pointer-events="visible" stroke="#E0E6F1" class="`) > 0);
366+
assert.ok(body.indexOf(`"></path>
367+
<path d="M70 330.5L630 330.5" fill="none" pointer-events="visible" stroke="#6E7079" stroke-linecap="round" class="`) > 0);
368+
assert.ok(body.indexOf(`"></path>
369+
<path d="M70.5 330L70.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="`) > 0);
370+
assert.ok(body.indexOf(`"></path>
371+
<path d="M150.5 330L150.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="`) > 0);
372+
assert.ok(body.indexOf(`"></path>
373+
<path d="M230.5 330L230.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="`) > 0);
374+
assert.ok(body.indexOf(`"></path>
375+
<path d="M310.5 330L310.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="`) > 0);
376+
assert.ok(body.indexOf(`"></path>
377+
<path d="M390.5 330L390.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="`) > 0);
378+
assert.ok(body.indexOf(`"></path>
379+
<path d="M470.5 330L470.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="`) > 0);
380+
assert.ok(body.indexOf(`"></path>
381+
<path d="M550.5 330L550.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="`) > 0);
382+
assert.ok(body.indexOf(`"></path>
383+
<path d="M630.5 330L630.5 335" fill="none" pointer-events="visible" stroke="#6E7079" class="`) > 0);
384+
assert.ok(body.indexOf(`"></path>
385+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 330)" fill="#6E7079">0</text>
386+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 276)" fill="#6E7079">300</text>
387+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 222)" fill="#6E7079">600</text>
388+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 168)" fill="#6E7079">900</text>
389+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 114)" fill="#6E7079">1,200</text>
390+
<text dominant-baseline="central" text-anchor="end" style="font-size:12px;font-family:sans-serif;" transform="translate(62 60)" fill="#6E7079">1,500</text>
391+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(110 338)" fill="#6E7079">Mon</text>
392+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(190 338)" fill="#6E7079">Tue</text>
393+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(270 338)" fill="#6E7079">Wed</text>
394+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(350 338)" fill="#6E7079">Thu</text>
395+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(430 338)" fill="#6E7079">Fri</text>
396+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(510 338)" fill="#6E7079">Sat</text>
397+
<text dominant-baseline="central" text-anchor="middle" style="font-size:12px;font-family:sans-serif;" y="6" transform="translate(590 338)" fill="#6E7079">Sun</text>
398+
<g clip-path="url(#`) > 0);
399+
assert.ok(body.indexOf(`)">
400+
<path d="M110 182.4C110 182.4 149.4 162.2 190 162.2C229.4 162.2 230 167.8 270 167.8C310 167.8 314.9 167.8 350 161.9C394.9 154.3 385.1 107 430 97.8C465.1 90.6 469.9 90.6 510 90.6C549.9 90.6 590 92.4 590 92.4" fill="none" pointer-events="visible" stroke="#5470c6" stroke-width="2" stroke-linejoin="bevel" class="`) > 0);
401+
assert.ok(body.indexOf(`"></path>
402+
</g>
403+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,110,182.4)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="0" ecmeta_ssr_type="chart" class="`) > 0);
404+
assert.ok(body.indexOf(`"></path>
405+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,190,162.24)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="1" ecmeta_ssr_type="chart" class="`) > 0);
406+
assert.ok(body.indexOf(`"></path>
407+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,270,167.82)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="2" ecmeta_ssr_type="chart" class="`) > 0);
408+
assert.ok(body.indexOf(`"></path>
409+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,350,161.88)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="3" ecmeta_ssr_type="chart" class="`) > 0);
410+
assert.ok(body.indexOf(`"></path>
411+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,430,97.8)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="4" ecmeta_ssr_type="chart" class="`) > 0);
412+
assert.ok(body.indexOf(`"></path>
413+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,510,90.6)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="5" ecmeta_ssr_type="chart" class="`) > 0);
414+
assert.ok(body.indexOf(`"></path>
415+
<path d="M1 0A1 1 0 1 1 1 -0.1A1 1 0 0 1 1 0" transform="matrix(2,0,0,2,590,92.4)" fill="#fff" stroke="#5470c6" ecmeta_series_index="0" ecmeta_data_index="6" ecmeta_ssr_type="chart" class="`) > 0);
416+
assert.ok(body.indexOf(`"></path>
417+
<defs >
418+
<clipPath id="`) > 0);
419+
assert.ok(body.indexOf(`">
420+
<path d="M69 59l562 0l0 272l-562 0Z" fill="#000" class="`) > 0);
421+
assert.ok(body.indexOf(`"></path>
422+
</clipPath>
423+
</defs>
424+
<style ><![CDATA[
425+
.`) > 0);
426+
assert.ok(body.indexOf(`:hover {
427+
pointer-events:none;
428+
}
429+
.`) > 0);
430+
assert.ok(body.indexOf(`:hover {
431+
cursor:pointer;
432+
fill:rgba(0,0,0,1);
433+
}
434+
.`) > 0);
435+
assert.ok(body.indexOf(`:hover {
436+
cursor:pointer;
437+
}
438+
.`) > 0);
439+
assert.ok(body.indexOf(`:hover {
440+
cursor:pointer;
441+
fill:rgba(255,255,255,1);
442+
}
443+
444+
]]>
445+
234446
</style>
235447
</svg>`) > 0);
236448
});

0 commit comments

Comments
 (0)