2 * @fileoverview Test cases for the callbacks.
4 * @author uemit.seren@gmail.com (Ümit Seren)
7 var CallbackTestCase
= TestCase("callback");
9 CallbackTestCase
.prototype.setUp
= function() {
10 document
.body
.innerHTML
= "<div id='graph'></div><div id='selection'></div>";
11 this.styleSheet
= document
.createElement("style");
12 this.styleSheet
.type
= "text/css";
13 document
.getElementsByTagName("head")[0].appendChild(this.styleSheet
);
16 CallbackTestCase
.prototype.tearDown
= function() {
19 var data
= "X,a\,b,c\n" +
27 * This tests that when the function idxToRow_ returns the proper row and the onHiglightCallback
28 * is properly called when the first series is hidden (setVisibility = false)
31 CallbackTestCase
.prototype.testHighlightCallbackIsCalled
= function() {
35 var highlightCallback
= function(e
, x
, pts
, row
) {
40 var graph
= document
.getElementById("graph");
41 var g
= new Dygraph(graph
, data
,
45 visibility
: [false, true, true],
46 highlightCallback
: highlightCallback
49 DygraphOps
.dispatchMouseMove(g
, 13, 10);
51 //check correct row is returned
52 assertEquals(3, h_row
);
53 //check there are only two points (because first series is hidden)
54 assertEquals(2, h_pts
.length
);
59 * Test that drawPointCallback isn't called when drawPoints is false
61 CallbackTestCase
.prototype.testDrawPointCallback_disabled
= function() {
64 var callback
= function() {
68 var graph
= document
.getElementById("graph");
69 var g
= new Dygraph(graph
, data
, {
70 drawPointCallback
: callback
,
77 * Test that drawPointCallback is called when drawPoints is true
79 CallbackTestCase
.prototype.testDrawPointCallback_enabled
= function() {
82 var callback
= function() {
86 var graph
= document
.getElementById("graph");
87 var g
= new Dygraph(graph
, data
, {
89 drawPointCallback
: callback
96 * Test that drawPointCallback is called when drawPoints is true
98 CallbackTestCase
.prototype.testDrawPointCallback_pointSize
= function() {
102 var callback
= function(g
, seriesName
, canvasContext
, cx
, cy
, color
, pointSizeParam
) {
103 pointSize
= pointSizeParam
;
107 var graph
= document
.getElementById("graph");
108 var g
= new Dygraph(graph
, data
, {
110 drawPointCallback
: callback
113 assertEquals(1.5, pointSize
);
114 assertEquals(12, count
); // one call per data point.
116 var g
= new Dygraph(graph
, data
, {
118 drawPointCallback
: callback
,
122 assertEquals(8, pointSize
);
126 * This tests that when the function idxToRow_ returns the proper row and the onHiglightCallback
127 * is properly called when the first series is hidden (setVisibility = false)
130 CallbackTestCase
.prototype.testDrawHighlightPointCallbackIsCalled
= function() {
133 var drawHighlightPointCallback
= function() {
137 var graph
= document
.getElementById("graph");
138 var g
= new Dygraph(graph
, data
,
142 drawHighlightPointCallback
: drawHighlightPointCallback
146 DygraphOps
.dispatchMouseMove(g
, 13, 10);
151 * Test the closest-series highlighting methods for normal and stacked modes.
152 * Also pass in line widths for plain and highlighted lines for easier visual
153 * confirmation that the highlighted line is drawn on top of the others.
155 var runClosestTest
= function(isStacked
, widthNormal
, widthHighlighted
) {
160 var graph
= document
.getElementById("graph");
161 var g
= new Dygraph(graph
, data
,
165 visibility
: [false, true, true],
166 stackedGraph
: isStacked
,
167 strokeWidth
: widthNormal
,
168 strokeBorderWidth
: 2,
169 highlightCircleSize
: widthNormal
* 2,
170 highlightSeriesBackgroundFade
: 0.7,
171 highlightSeriesAnimate
: true,
173 highlightSeriesOpts
: {
174 strokeWidth
: widthHighlighted
,
175 highlightCircleSize
: widthHighlighted
* 2
179 var highlightCallback
= function(e
, x
, pts
, row
, set
) {
183 document
.getElementById('selection').innerHTML
='row=' + row
+ ', set=' + set
;
186 g
.updateOptions({highlightCallback
: highlightCallback
}, true);
189 DygraphOps
.dispatchMouseMove(g
, 11.45, 1.4);
190 assertEquals(1, h_row
);
191 assertEquals('c', h_series
);
193 //now move up in the same row
194 DygraphOps
.dispatchMouseMove(g
, 11.45, 1.5);
195 assertEquals(1, h_row
);
196 assertEquals('b', h_series
);
198 //and a bit to the right
199 DygraphOps
.dispatchMouseMove(g
, 11.55, 1.5);
200 assertEquals(2, h_row
);
201 assertEquals('c', h_series
);
203 DygraphOps
.dispatchMouseMove(g
, 11, 1.5);
204 assertEquals(1, h_row
);
205 assertEquals('c', h_series
);
207 //now move up in the same row
208 DygraphOps
.dispatchMouseMove(g
, 11, 2.5);
209 assertEquals(1, h_row
);
210 assertEquals('b', h_series
);
217 * Test basic closest-point highlighting.
219 CallbackTestCase
.prototype.testClosestPointCallback
= function() {
220 runClosestTest(false, 1, 3);
224 * Test setSelection() with series name
226 CallbackTestCase
.prototype.testSetSelection
= function() {
227 var g
= runClosestTest(false, 1, 3);
228 assertEquals(1, g
.attr_('strokeWidth', 'c'));
229 g
.setSelection(false, 'c');
230 assertEquals(3, g
.attr_('strokeWidth', 'c'));
234 * Test closest-point highlighting for stacked graph
236 CallbackTestCase
.prototype.testClosestPointStackedCallback
= function() {
237 runClosestTest(true, 1, 3);
241 * Closest-point highlighting with legend CSS - border around active series.
243 CallbackTestCase
.prototype.testClosestPointCallbackCss1
= function() {
244 var css
= "div.dygraph-legend > span { display: block; }\n" +
245 "div.dygraph-legend > span.highlight { border: 1px solid grey; }\n";
246 this.styleSheet
.innerHTML
= css
;
247 runClosestTest(false, 2, 4);
251 * Closest-point highlighting with legend CSS - show only closest series.
253 CallbackTestCase
.prototype.testClosestPointCallbackCss2
= function() {
254 var css
= "div.dygraph-legend > span { display: none; }\n" +
255 "div.dygraph-legend > span.highlight { display: inline; }\n";
256 this.styleSheet
.innerHTML
= css
;
257 runClosestTest(false, 10, 15);
258 // TODO(klausw): verify that the highlighted line is drawn on top?