consolidating scripts
[dygraphs.git] / auto_tests / tests / annotations.js
1 /**
2 * @fileoverview Tests relating to annotations
3 *
4 * @author danvk@google.com (Dan Vanderkam)
5 */
6
7 import Dygraph from '../../src/dygraph';
8 import Util from './Util';
9
10 describe("annotations", function() {
11
12 cleanupAfterEach();
13
14 it('testAnnotationsDrawn', function() {
15 var opts = {
16 width: 480,
17 height: 320
18 };
19 var data = "X,Y\n" +
20 "0,-1\n" +
21 "1,0\n" +
22 "2,1\n" +
23 "3,0\n"
24 ;
25
26 var graph = document.getElementById("graph");
27 var g = new Dygraph(graph, data, opts);
28 g.setAnnotations([
29 {
30 series: 'Y',
31 x: 1,
32 shortText: 'A',
33 text: 'Long A',
34 cssClass: 'ann1'
35 },
36 {
37 series: 'Y',
38 x: 2,
39 shortText: 'B',
40 text: 'Long B',
41 cssClass: 'ann2'
42 }
43 ]);
44
45 assert.equal(2, g.annotations().length);
46 var a1 = document.getElementsByClassName('ann1');
47 assert.equal(1, a1.length);
48 a1 = a1[0];
49 assert.equal('A', a1.textContent);
50
51 var a2 = document.getElementsByClassName('ann2');
52 assert.equal(1, a2.length);
53 a2 = a2[0];
54 assert.equal('B', a2.textContent);
55 });
56
57 // Some errors that should be flagged:
58 // 1. Invalid series name (e.g. 'X' or 'non-existent')
59 // 2. Passing a string as 'x' instead of a number (e.g. x: '1')
60
61 it('testAnnotationsDontDisappearOnResize', function() {
62 var opts = {
63 };
64 var data = "X,Y\n" +
65 "0,-1\n" +
66 "1,0\n" +
67 "2,1\n" +
68 "3,0\n"
69 ;
70
71 var graph = document.getElementById("graph");
72 var g = new Dygraph(graph, data, opts);
73 g.setAnnotations([
74 {
75 series: 'Y',
76 x: 1,
77 shortText: 'A',
78 text: 'Long A',
79 cssClass: 'ann1'
80 }
81 ]);
82
83 // Check that it displays at all
84 assert.equal(1, g.annotations().length);
85 var a1 = document.getElementsByClassName('ann1');
86 assert.equal(1, a1.length);
87 a1 = a1[0];
88 assert.equal('A', a1.textContent);
89
90 // ... and that resizing doesn't kill it.
91 g.resize(400, 300);
92 assert.equal(1, g.annotations().length);
93 var a1 = document.getElementsByClassName('ann1');
94 assert.equal(1, a1.length);
95 a1 = a1[0];
96 assert.equal('A', a1.textContent);
97 });
98
99 // Verify that annotations outside of the visible x-range are not shown.
100 it('testAnnotationsOutOfRangeX', function() {
101 var opts = {
102 };
103 var data = "X,Y\n" +
104 "0,-1\n" +
105 "1,0\n" +
106 "2,1\n" +
107 "3,0\n"
108 ;
109
110 var graph = document.getElementById("graph");
111 var g = new Dygraph(graph, data, opts);
112 g.setAnnotations([
113 {
114 series: 'Y',
115 x: 1,
116 shortText: 'A',
117 text: 'Long A',
118 cssClass: 'ann1'
119 }
120 ]);
121
122 // Check that it displays at all
123 assert.equal(1, g.annotations().length);
124 var a1 = document.getElementsByClassName('ann1');
125 assert.equal(1, a1.length);
126 a1 = a1[0];
127 assert.equal('A', a1.textContent);
128
129 // ... and that panning right removes the annotation.
130 g.updateOptions({dateWindow: [2, 6]});
131 assert.equal(1, g.annotations().length);
132 a1 = document.getElementsByClassName('ann1');
133 assert.equal(0, a1.length);
134
135 // ... and that panning left brings it back.
136 g.updateOptions({dateWindow: [0, 4]});
137 assert.equal(1, g.annotations().length);
138 a1 = document.getElementsByClassName('ann1');
139 assert.equal(1, a1.length);
140 });
141
142 // Verify that annotations outside of the visible y-range are not shown.
143 it('testAnnotationsOutOfRangeY', function() {
144 var opts = {
145 };
146 var data = "X,Y\n" +
147 "0,-1\n" +
148 "1,0\n" +
149 "2,1\n" +
150 "3,0\n"
151 ;
152
153 var graph = document.getElementById("graph");
154 var g = new Dygraph(graph, data, opts);
155 g.setAnnotations([
156 {
157 series: 'Y',
158 x: 1,
159 shortText: 'A',
160 text: 'Long A',
161 cssClass: 'ann1'
162 }
163 ]);
164
165 // ... check that panning up removes the annotation.
166 g.updateOptions({valueRange: [0.5, 2.5]});
167 assert.equal(1, g.annotations().length);
168 var a1 = document.getElementsByClassName('ann1');
169 assert.equal(0, a1.length);
170
171 // ... and that panning down brings it back.
172 g.updateOptions({valueRange: [-1, 1]});
173 assert.equal(1, g.annotations().length);
174 a1 = document.getElementsByClassName('ann1');
175 assert.equal(1, a1.length);
176 });
177
178 it('testAnnotationsDrawnInDrawCallback', function() {
179 var data = "X,Y\n" +
180 "0,-1\n" +
181 "1,0\n" +
182 "2,1\n";
183
184 var graph = document.getElementById("graph");
185
186 var calls = [];
187 var g = new Dygraph(graph, data, {
188 width: 480,
189 height: 320,
190 drawCallback: function(g, initial) {
191 calls.push(initial);
192 if (initial) {
193 g.setAnnotations([
194 {
195 series: 'Y',
196 x: 1,
197 shortText: 'A',
198 text: 'Long A',
199 },
200 ]);
201 }
202 }
203 });
204
205 assert.deepEqual([true, false], calls);
206 });
207
208
209 // Test that annotations on the same point are stacked.
210 // Regression test for http://code.google.com/p/dygraphs/issues/detail?id=256
211 it('testAnnotationsStacked', function() {
212 var data = 'X,Y1,Y2\n' +
213 '0,1,2\n' +
214 '1,2,3\n';
215 var graph = document.getElementById("graph");
216 var annotations = [
217 {
218 series: 'Y1',
219 x: 0,
220 shortText: '1',
221 attachAtBottom: true
222 },
223 {
224 series: 'Y2',
225 x: 0,
226 shortText: '2',
227 attachAtBottom: true
228 }
229 ];
230 var g = new Dygraph(graph, data, {
231 width: 480,
232 height: 320
233 });
234 g.setAnnotations(annotations);
235
236 var annEls = document.getElementsByClassName('dygraphDefaultAnnotation');
237 assert.equal(2, annEls.length);
238
239 assert.equal(annEls[0].offsetLeft, annEls[1].offsetLeft);
240 assert(annEls[1].offsetTop < annEls[0].offsetTop - 10);
241 });
242
243
244 // Test the .ready() method, which is most often used with setAnnotations().
245 it('testReady', function() {
246 var data = 'X,Y1,Y2\n' +
247 '0,1,2\n' +
248 '1,2,3\n';
249 var mockXhr = Util.overrideXMLHttpRequest(data);
250
251 var graph = document.getElementById("graph");
252 var g = new Dygraph(graph, "data.csv", {
253 width: 480,
254 height: 320
255 });
256
257 var ready_calls = 0;
258 g.ready(function() { ready_calls++; });
259
260 assert.equal(0, ready_calls);
261 mockXhr.respond();
262 assert.equal(1, ready_calls);
263
264 // Make sure that ready isn't called on redraws.
265 g.updateOptions({});
266 assert.equal(1, ready_calls);
267
268 // Or data changes.
269 g.updateOptions({file: data});
270 assert.equal(1, ready_calls);
271 });
272
273 });