Commit | Line | Data |
---|---|---|
1715eee9 | 1 | /** |
6833c463 DV |
2 | * @fileoverview Tests for the highlightSeriesBackgroundAlpha and |
3 | * highlightSeriesBackgroundColor options. | |
1715eee9 SS |
4 | * @author sergeyslepian@gmail.com |
5 | */ | |
6 | ||
6833c463 DV |
7 | import Dygraph from '../../src/dygraph'; |
8 | import * as utils from '../../src/dygraph-utils'; | |
9 | import Util from './Util'; | |
1715eee9 | 10 | |
6833c463 | 11 | describe("highlight-series-background", function() { |
1715eee9 | 12 | |
6833c463 | 13 | cleanupAfterEach(); |
1715eee9 | 14 | |
75ef32c9 DV |
15 | var origRepeatAndCleanup; |
16 | ||
17 | beforeEach(function() { | |
18 | // A "fast" version of repeatAndCleanup | |
19 | origRepeatAndCleanup = utils.repeatAndCleanup; | |
20 | // utils.repeatAndCleanup = function(repeatFn, maxFrames, framePeriodInMillis, cleanupFn) { | |
21 | // repeatFn(0); | |
22 | // if (maxFrames > 1) repeatFn(maxFrames - 1); | |
23 | // cleanupFn(); | |
24 | // }; | |
25 | }); | |
26 | ||
27 | afterEach(function() { | |
28 | utils.repeatAndCleanup = origRepeatAndCleanup; | |
29 | }); | |
30 | ||
6833c463 DV |
31 | function setupGraph(highlightSeriesBackgroundAlpha, |
32 | highlightSeriesBackgroundColor) { | |
1715eee9 SS |
33 | var opts = { |
34 | width: 480, | |
35 | height: 320, | |
36 | labels: ['x', 'y'], | |
37 | legend: 'always', | |
38 | highlightSeriesOpts: { | |
39 | strokeWidth: 1, | |
40 | strokeBorderWidth: 1, | |
41 | highlightCircleSize: 1 | |
42 | } | |
43 | }; | |
44 | ||
6833c463 DV |
45 | if (highlightSeriesBackgroundAlpha) utils.update(opts, {highlightSeriesBackgroundAlpha}); |
46 | if (highlightSeriesBackgroundColor) utils.update(opts, {highlightSeriesBackgroundColor}); | |
1715eee9 SS |
47 | |
48 | var data = []; | |
49 | for (var j = 0; j < 10; j++) { | |
50 | data.push([j, 0]); | |
51 | } | |
52 | ||
6833c463 | 53 | return new Dygraph('graph', data, opts); |
1715eee9 SS |
54 | } |
55 | ||
56 | it('testDefaultHighlight', function(done) { | |
57 | var graph = setupGraph(); | |
58 | ||
59 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [0,0,0,0]); | |
60 | ||
61 | graph.setSelection(0, 'y', true); | |
62 | ||
63 | // handle background color fade-in time | |
75ef32c9 | 64 | window.setTimeout(() => { |
1715eee9 SS |
65 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [255,255,255,127]); |
66 | done(); | |
75ef32c9 | 67 | }, 500); |
1715eee9 SS |
68 | }); |
69 | ||
70 | it('testNoHighlight', function(done) { | |
71 | var graph = setupGraph(1); | |
72 | ||
73 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [0,0,0,0]); | |
74 | ||
75 | graph.setSelection(0, 'y', true); | |
76 | ||
77 | // handle background color fade-in time | |
75ef32c9 | 78 | window.setTimeout(() => { |
1715eee9 SS |
79 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [0,0,0,0]); |
80 | done(); | |
75ef32c9 | 81 | }, 500); |
1715eee9 SS |
82 | }); |
83 | ||
84 | it('testCustomHighlightColor', function(done) { | |
6833c463 | 85 | var graph = setupGraph(null, 'rgb(0,255,255)'); |
1715eee9 SS |
86 | |
87 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [0,0,0,0]); | |
88 | ||
89 | graph.setSelection(0, 'y', true); | |
90 | ||
91 | // handle background color fade-in time | |
75ef32c9 | 92 | window.setTimeout(() => { |
1715eee9 SS |
93 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [0,255,255,127]); |
94 | done(); | |
75ef32c9 | 95 | }, 500); |
1715eee9 SS |
96 | }); |
97 | ||
98 | it('testCustomHighlightAlpha', function(done) { | |
99 | var graph = setupGraph(0.3); | |
100 | ||
101 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [0,0,0,0]); | |
102 | ||
103 | graph.setSelection(0, 'y', true); | |
104 | ||
105 | // handle background color fade-in time | |
75ef32c9 | 106 | window.setTimeout(() => { |
1715eee9 SS |
107 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [255,255,255,179]); |
108 | done(); | |
75ef32c9 | 109 | }, 500); |
1715eee9 SS |
110 | }); |
111 | ||
112 | it('testCustomHighlightColorAndAlpha', function(done) { | |
113 | var graph = setupGraph(0.7,'rgb(255,0,0)'); | |
114 | ||
115 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [0,0,0,0]); | |
116 | ||
117 | graph.setSelection(0, 'y', true); | |
118 | ||
119 | // handle background color fade-in time | |
75ef32c9 | 120 | window.setTimeout(() => { |
1715eee9 SS |
121 | assert.deepEqual(Util.samplePixel(graph.canvas_, 100, 100), [255,0,0,76]); |
122 | done(); | |
75ef32c9 | 123 | }, 500); |
1715eee9 | 124 | }); |
da6089e8 JR |
125 | |
126 | it('testGetSelectionZeroCanvasY', function () { | |
127 | var graph = document.getElementById("graph"); | |
128 | var calls = [] | |
129 | function callback(g, seriesName, canvasContext, cx, cy, color, pointSize, idx) { | |
130 | calls.push(arguments); | |
131 | }; | |
132 | ||
133 | var g = new Dygraph(document.getElementById("graph"), | |
134 | "X,Y\n" + | |
135 | "1,5\n" + | |
136 | "1,10\n" + | |
137 | "1,12\n", | |
138 | { | |
139 | drawHighlightPointCallback: callback, | |
140 | axes: { | |
141 | y: { | |
142 | valueRange: [0, 10] | |
143 | } | |
144 | } | |
145 | }); | |
146 | g.setSelection(1); | |
147 | var args = calls[0]; | |
148 | assert.equal(args[4], 0); | |
149 | }); | |
6833c463 | 150 | }); |