8fa950e1f4bce47f8d619a4afff03f444fc0cfc0
2 * @fileoverview Test cases for a graph contained in a scrolling div
4 * @author konigsberg@google.com (Robert Konigsbrg)
6 var ScrollingDivTestCase
= TestCase("scrolling-div");
8 ScrollingDivTestCase
.prototype.setUp
= function() {
11 "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod\n" +
12 "tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,\n" +
13 "quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo\n" +
14 "consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse\n" +
15 "cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat\n" +
16 "non proident, sunt in culpa qui officia deserunt mollit anim id est\n" +
19 document
.body
.innerHTML
=
20 "<div id='scroller' style='overflow: scroll; height: 450px; width: 800px;'>" +
21 "<div id='graph'></div>" +
22 "<div style='height:100px; background-color:green;'>" + LOREM_IPSUM
+ " </div>" +
23 "<div style='height:100px; background-color:red;'>" + LOREM_IPSUM
+ "</div>" +
36 var graph
= document
.getElementById("graph");
40 this.g
= new Dygraph(graph
, data
,
44 highlightCircleSize
: 6,
45 pointClickCallback
: function(evt
, point
) {
46 // chrome sez: 243 30 248 124, scroller.offsetLeft/Top
= 8/8
47 // ff sez: 245 17 249 126, " "
48 console
.log(evt
.clientX
, evt
.clientY
, evt
.screenX
, evt
.screenY
);
56 // This is usually something like 15, but for OS X Lion and its auto-hiding
57 // scrollbars, it's 0. This is a large enough difference that we need to
58 // consider it when synthesizing clicks.
59 // Adapted from http://davidwalsh.name/detect-scrollbar
-width
60 ScrollingDivTestCase
.prototype.detectScrollbarWidth
= function() {
61 // Create the measurement node
62 var scrollDiv
= document
.createElement("div");
63 scrollDiv
.style
.width
= "100px";
64 scrollDiv
.style
.height
= "100px";
65 scrollDiv
.style
.overflow
= "scroll";
66 scrollDiv
.style
.position
= "absolute";
67 scrollDiv
.style
.top
= "-9999px";
68 document
.body
.appendChild(scrollDiv
);
70 // Get the scrollbar width
71 var scrollbarWidth
= scrollDiv
.offsetWidth
- scrollDiv
.clientWidth
;
74 document
.body
.removeChild(scrollDiv
);
76 return scrollbarWidth
;
79 ScrollingDivTestCase
.prototype.tearDown
= function() {
83 * This tests that when the nested div is unscrolled, things work normally.
85 ScrollingDivTestCase
.prototype.testUnscrolledDiv
= function() {
87 document
.getElementById('scroller').scrollTop
= 0;
96 DygraphOps
.dispatchCanvasEvent(this.g
, DygraphOps
.createEvent(clickOn4_40
, { type
: 'mousemove' }));
97 DygraphOps
.dispatchCanvasEvent(this.g
, DygraphOps
.createEvent(clickOn4_40
, { type
: 'mousedown' }));
98 DygraphOps
.dispatchCanvasEvent(this.g
, DygraphOps
.createEvent(clickOn4_40
, { type
: 'mouseup' }));
100 assertEquals(40, this.point
.xval
);
101 assertEquals(4, this.point
.yval
);
105 * This tests that when the nested div is scrolled, things work normally.
107 ScrollingDivTestCase
.prototype.testScrolledDiv
= function() {
108 document
.getElementById('scroller').scrollTop
= 117;
112 clientY
: 30 - this.detectScrollbarWidth(),
117 DygraphOps
.dispatchCanvasEvent(this.g
, DygraphOps
.createEvent(clickOn4_40
, { type
: 'mousemove' }));
118 DygraphOps
.dispatchCanvasEvent(this.g
, DygraphOps
.createEvent(clickOn4_40
, { type
: 'mousedown' }));
119 DygraphOps
.dispatchCanvasEvent(this.g
, DygraphOps
.createEvent(clickOn4_40
, { type
: 'mouseup' }));
121 assertEquals(40, this.point
.xval
);
122 assertEquals(4, this.point
.yval
);