1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
|
describe('Platform.basic', function() {
it('should automatically choose the BasicPlatform for offscreen canvas', function() {
const chart = acquireChart({type: 'line'}, {useOffscreenCanvas: true});
expect(chart.platform).toBeInstanceOf(Chart.platforms.BasicPlatform);
chart.destroy();
});
it('should disable animations', function() {
const chart = acquireChart({type: 'line', options: {animation: {}}}, {useOffscreenCanvas: true});
expect(chart.options.animation).toEqual(false);
chart.destroy();
});
it('supports choosing the BasicPlatform in a web worker', function(done) {
const canvas = document.createElement('canvas');
if (!canvas.transferControlToOffscreen) {
pending();
}
const offscreenCanvas = canvas.transferControlToOffscreen();
const worker = new Worker('base/test/BasicChartWebWorker.js');
worker.onmessage = (event) => {
worker.terminate();
const {type, errorMessage} = event.data;
if (type === 'error') {
done.fail(errorMessage);
} else if (type === 'success') {
expect(type).toEqual('success');
done();
} else {
done.fail('invalid message type sent by worker: ' + type);
}
};
worker.postMessage({type: 'initialize', canvas: offscreenCanvas}, [offscreenCanvas]);
});
describe('with offscreenCanvas', function() {
it('supports laying out a simple chart', function() {
const chart = acquireChart({
type: 'bar',
data: {
datasets: [
{data: [10, 5, 0, 25, 78, -10]}
],
labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick5', 'tick6']
}
}, {
canvas: {
height: 150,
width: 250
},
useOffscreenCanvas: true,
});
expect(chart.platform).toBeInstanceOf(Chart.platforms.BasicPlatform);
expect(chart.chartArea.bottom).toBeCloseToPixel(120);
expect(chart.chartArea.left).toBeCloseToPixel(31);
expect(chart.chartArea.right).toBeCloseToPixel(250);
expect(chart.chartArea.top).toBeCloseToPixel(32);
});
it('supports resizing a chart', function() {
const chart = acquireChart({
type: 'bar',
data: {
datasets: [
{data: [10, 5, 0, 25, 78, -10]}
],
labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick5', 'tick6']
}
}, {
canvas: {
height: 150,
width: 250
},
useOffscreenCanvas: true,
});
expect(chart.platform).toBeInstanceOf(Chart.platforms.BasicPlatform);
const canvasElement = chart.canvas;
canvasElement.height = 200;
canvasElement.width = 300;
chart.resize();
expect(chart.chartArea.bottom).toBeCloseToPixel(150);
expect(chart.chartArea.left).toBeCloseToPixel(31);
expect(chart.chartArea.right).toBeCloseToPixel(300);
expect(chart.chartArea.top).toBeCloseToPixel(32);
});
});
});
|
