| 1 | // Copyright 2011 Google Inc. All Rights Reserved. |
| 2 | |
| 3 | /** |
| 4 | * @fileoverview Tests for the updateOptions function. |
| 5 | * @author antrob@google.com (Anthony Robledo) |
| 6 | */ |
| 7 | |
| 8 | import Dygraph from '../../src/dygraph'; |
| 9 | |
| 10 | describe("update-options", function() { |
| 11 | |
| 12 | cleanupAfterEach(); |
| 13 | |
| 14 | var opts = { |
| 15 | width: 480, |
| 16 | height: 320, |
| 17 | }; |
| 18 | |
| 19 | var data = "X,Y1,Y2\n" + |
| 20 | "2011-01-01,2,3\n" + |
| 21 | "2011-02-02,5,3\n" + |
| 22 | "2011-03-03,6,1\n" + |
| 23 | "2011-04-04,9,5\n" + |
| 24 | "2011-05-05,8,3\n"; |
| 25 | |
| 26 | /* |
| 27 | * Tweaks the dygraph so it sets g._testDrawCalled to true when internal method |
| 28 | * drawGraph_ is called. Call unWrapDrawGraph when done with this. |
| 29 | */ |
| 30 | var wrapDrawGraph = function(g) { |
| 31 | g._testDrawCalled = false; |
| 32 | g._oldDrawGraph = g.drawGraph_; |
| 33 | g.drawGraph_ = function() { |
| 34 | g._testDrawCalled = true; |
| 35 | g._oldDrawGraph.call(g); |
| 36 | } |
| 37 | }; |
| 38 | |
| 39 | /* |
| 40 | * See wrapDrawGraph |
| 41 | */ |
| 42 | var unwrapDrawGraph = function(g) { |
| 43 | g.drawGraph_ = g._oldDrawGraph; |
| 44 | } |
| 45 | |
| 46 | it('testStrokeAll', function() { |
| 47 | var graphDiv = document.getElementById("graph"); |
| 48 | var graph = new Dygraph(graphDiv, data, opts); |
| 49 | var updatedOptions = { }; |
| 50 | |
| 51 | updatedOptions['strokeWidth'] = 3; |
| 52 | |
| 53 | // These options will allow us to jump to renderGraph_() |
| 54 | // drawGraph_() will be skipped. |
| 55 | wrapDrawGraph(graph); |
| 56 | graph.updateOptions(updatedOptions); |
| 57 | unwrapDrawGraph(graph); |
| 58 | assert.isFalse(graph._testDrawCalled); |
| 59 | }); |
| 60 | |
| 61 | it('testStrokeSingleSeries', function() { |
| 62 | var graphDiv = document.getElementById("graph"); |
| 63 | var graph = new Dygraph(graphDiv, data, opts); |
| 64 | var updatedOptions = { }; |
| 65 | var optionsForY1 = { }; |
| 66 | |
| 67 | optionsForY1['strokeWidth'] = 3; |
| 68 | updatedOptions['series'] = {'Y1': optionsForY1}; |
| 69 | |
| 70 | // These options will allow us to jump to renderGraph_() |
| 71 | // drawGraph_() will be skipped. |
| 72 | wrapDrawGraph(graph); |
| 73 | graph.updateOptions(updatedOptions); |
| 74 | unwrapDrawGraph(graph); |
| 75 | assert.isFalse(graph._testDrawCalled); |
| 76 | }); |
| 77 | |
| 78 | it('testSingleSeriesRequiresNewPoints', function() { |
| 79 | var graphDiv = document.getElementById("graph"); |
| 80 | var graph = new Dygraph(graphDiv, data, opts); |
| 81 | var updatedOptions = { |
| 82 | series: { |
| 83 | Y1: { |
| 84 | strokeWidth: 2 |
| 85 | }, |
| 86 | Y2: { |
| 87 | stepPlot: true |
| 88 | } |
| 89 | } |
| 90 | }; |
| 91 | |
| 92 | // These options will not allow us to jump to renderGraph_() |
| 93 | // drawGraph_() must be called |
| 94 | wrapDrawGraph(graph); |
| 95 | graph.updateOptions(updatedOptions); |
| 96 | unwrapDrawGraph(graph); |
| 97 | assert.isTrue(graph._testDrawCalled); |
| 98 | }); |
| 99 | |
| 100 | it('testWidthChangeNeedsNewPoints', function() { |
| 101 | var graphDiv = document.getElementById("graph"); |
| 102 | var graph = new Dygraph(graphDiv, data, opts); |
| 103 | var updatedOptions = { }; |
| 104 | |
| 105 | // This will require new points. |
| 106 | updatedOptions['width'] = 600; |
| 107 | |
| 108 | // These options will not allow us to jump to renderGraph_() |
| 109 | // drawGraph_() must be called |
| 110 | wrapDrawGraph(graph); |
| 111 | graph.updateOptions(updatedOptions); |
| 112 | unwrapDrawGraph(graph); |
| 113 | assert.isTrue(graph._testDrawCalled); |
| 114 | }); |
| 115 | |
| 116 | // Test https://github.com/danvk/dygraphs/issues/87 |
| 117 | it('testUpdateLabelsDivDoesntInfiniteLoop', function() { |
| 118 | var graphDiv = document.getElementById("graph"); |
| 119 | var labelsDiv = document.getElementById("labels"); |
| 120 | var graph = new Dygraph(graphDiv, data, opts); |
| 121 | graph.updateOptions({labelsDiv : labelsDiv}); |
| 122 | }); |
| 123 | |
| 124 | // Test https://github.com/danvk/dygraphs/issues/247 |
| 125 | it('testUpdateColors', function() { |
| 126 | var graphDiv = document.getElementById("graph"); |
| 127 | var graph = new Dygraph(graphDiv, data, opts); |
| 128 | |
| 129 | var defaultColors = ["rgb(0,128,0)", "rgb(0,0,128)"]; |
| 130 | assert.deepEqual(["rgb(0,128,0)", "rgb(0,0,128)"], graph.getColors()); |
| 131 | |
| 132 | var colors1 = [ "#aaa", "#bbb" ]; |
| 133 | graph.updateOptions({ colors: colors1 }); |
| 134 | assert.deepEqual(colors1, graph.getColors()); |
| 135 | |
| 136 | // extra colors are ignored until you add additional data series. |
| 137 | var colors2 = [ "#ddd", "#eee", "#fff" ]; |
| 138 | graph.updateOptions({ colors: colors2 }); |
| 139 | assert.deepEqual(["#ddd", "#eee"], graph.getColors()); |
| 140 | |
| 141 | graph.updateOptions({ file: |
| 142 | "X,Y1,Y2,Y3\n" + |
| 143 | "2011-01-01,2,3,4\n" + |
| 144 | "2011-02-02,5,3,2\n" |
| 145 | }); |
| 146 | assert.deepEqual(colors2, graph.getColors()); |
| 147 | |
| 148 | graph.updateOptions({ colors: null, file: data }); |
| 149 | assert.deepEqual(defaultColors, graph.getColors()); |
| 150 | }); |
| 151 | |
| 152 | // Regression test for http://code.google.com/p/dygraphs/issues/detail?id=249 |
| 153 | // Verifies that setting 'legend: always' via update immediately shows the |
| 154 | // legend. |
| 155 | it('testUpdateLegendAlways', function() { |
| 156 | var graphDiv = document.getElementById("graph"); |
| 157 | var graph = new Dygraph(graphDiv, data, opts); |
| 158 | |
| 159 | var legend = document.getElementsByClassName("dygraph-legend"); |
| 160 | assert.equal(1, legend.length); |
| 161 | legend = legend[0]; |
| 162 | assert.equal("", legend.innerHTML); |
| 163 | |
| 164 | graph.updateOptions({legend: 'always'}); |
| 165 | |
| 166 | legend = document.getElementsByClassName("dygraph-legend"); |
| 167 | assert.equal(1, legend.length); |
| 168 | legend = legend[0]; |
| 169 | assert.notEqual(-1, legend.textContent.indexOf("Y1")); |
| 170 | assert.notEqual(-1, legend.textContent.indexOf("Y2")); |
| 171 | }); |
| 172 | |
| 173 | }); |