auto_tests/tests/callback.js

   1 /**
   2  * @fileoverview Test cases for the callbacks.
   3  *
   4  * @author uemit.seren@gmail.com (Ümit Seren)
   5  */
   6
   7 var CallbackTestCase = TestCase("callback");
   8
   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);
  14 };
  15
  16 CallbackTestCase.prototype.tearDown = function() {
  17 };
  18
  19  var data = "X,a\,b,c\n" +
  20  "10,-1,1,2\n" +
  21  "11,0,3,1\n" +
  22  "12,1,4,2\n" +
  23  "13,0,2,3\n";
  24
  25
  26  /**
  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)
  29   *
  30   */
  31  CallbackTestCase.prototype.testHighlightCallbackIsCalled = function() {
  32    var h_row;
  33    var h_pts;
  34
  35    var highlightCallback  =  function(e, x, pts, row) {
  36           h_row = row;
  37           h_pts = pts;
  38    };
  39
  40
  41
  42    var graph = document.getElementById("graph");
  43    var g = new Dygraph(graph, data,
  44        {
  45          width: 100,
  46          height : 100,
  47          visibility: [false, true, true],
  48          highlightCallback : highlightCallback
  49        });
  50
  51    DygraphOps.dispatchMouseMove(g, 13, 10);
  52
  53    //check correct row is returned
  54    assertEquals(3, h_row);
  55    //check there are only two points (because first series is hidden)
  56    assertEquals(2, h_pts.length);
  57  };
  58
  59 var runClosestTest = function(isStacked, widthNormal, widthHighlighted) {
  60   var h_row;
  61   var h_pts;
  62   var h_series;
  63
  64   var graph = document.getElementById("graph");
  65   var g = new Dygraph(graph, data,
  66       {
  67         width: 600,
  68         height : 400,
  69         visibility: [false, true, true],
  70         stackedGraph: isStacked,
  71         strokeWidth: widthNormal,
  72         strokeBorderWidth: 2,
  73         highlightCircleSize: widthNormal * 2,
  74         highlightSeriesBackgroundFade: 0.7,
  75         highlightSeriesAnimate: true,
  76
  77         highlightSeriesOpts: {
  78           strokeWidth: widthHighlighted,
  79           highlightCircleSize: widthHighlighted * 2
  80         }
  81       });
  82
  83   var highlightCallback  =  function(e, x, pts, row, set) {
  84     h_row = row;
  85     h_pts = pts;
  86     h_series = set;
  87     document.getElementById('selection').innerHTML='row=' + row + ', set=' + set;
  88   };
  89
  90   g.updateOptions({highlightCallback: highlightCallback}, true);
  91
  92   if (isStacked) {
  93     DygraphOps.dispatchMouseMove(g, 11.45, 1.4);
  94     assertEquals(1, h_row);
  95     assertEquals('c', h_series);
  96
  97     //now move up in the same row
  98     DygraphOps.dispatchMouseMove(g, 11.45, 1.5);
  99     assertEquals(1, h_row);
 100     assertEquals('b', h_series);
 101
 102     //and a bit to the right
 103     DygraphOps.dispatchMouseMove(g, 11.55, 1.5);
 104     assertEquals(2, h_row);
 105     assertEquals('c', h_series);
 106   } else {
 107     DygraphOps.dispatchMouseMove(g, 11, 1.5);
 108     assertEquals(1, h_row);
 109     assertEquals('c', h_series);
 110
 111     //now move up in the same row
 112     DygraphOps.dispatchMouseMove(g, 11, 2.5);
 113     assertEquals(1, h_row);
 114     assertEquals('b', h_series);
 115   }
 116
 117   return g;
 118 };
 119
 120 /**
 121  * Test basic closest-point highlighting.
 122  */
 123 CallbackTestCase.prototype.testClosestPointCallback = function() {
 124   runClosestTest(false, 1, 3);
 125 }
 126
 127 /**
 128  * Test setSelection() with series name
 129  */
 130 CallbackTestCase.prototype.testSetSelection = function() {
 131   var g = runClosestTest(false, 1, 3);
 132   assertEquals(1, g.attr_('strokeWidth', 'c'));
 133   g.setSelection(false, 'c');
 134   assertEquals(3, g.attr_('strokeWidth', 'c'));
 135 }
 136
 137 /**
 138  * Test closest-point highlighting for stacked graph
 139  */
 140 CallbackTestCase.prototype.testClosestPointStackedCallback = function() {
 141   runClosestTest(true, 1, 3);
 142 }
 143
 144 /**
 145  * Closest-point highlighting with legend CSS - border around active series.
 146  */
 147 CallbackTestCase.prototype.testClosestPointCallbackCss1 = function() {
 148   var css = "div.dygraph-legend > span { display: block; }\n" +
 149     "div.dygraph-legend > span.highlight { border: 1px solid grey; }\n";
 150   this.styleSheet.innerHTML = css;
 151   runClosestTest(false, 2, 4);
 152 }
 153
 154 /**
 155  * Closest-point highlighting with legend CSS - show only closest series.
 156  */
 157 CallbackTestCase.prototype.testClosestPointCallbackCss2 = function() {
 158   var css = "div.dygraph-legend > span { display: none; }\n" +
 159     "div.dygraph-legend > span.highlight { display: inline; }\n";
 160   this.styleSheet.innerHTML = css;
 161   runClosestTest(false, 10, 15);
 162   // TODO(klausw): verify that the highlighted line is drawn on top?
 163 }