cleanup
[dygraphs.git] / auto_tests / tests / scrolling_div.js
index 93a6fc6..ceb2a3d 100644 (file)
@@ -17,11 +17,10 @@ var LOREM_IPSUM =
     "laborum.</p>";
 
   document.body.innerHTML = 
-      "<div style='overflow: scroll; height: 450px; width: 800px;'>" +
-      "<a name='TOP'></a><div id='graph'></div>" +
+      "<div id='scroller' style='overflow: scroll; height: 450px; width: 800px;'>" +
+      "<div id='graph'></div>" +
       "<div style='height:100px; background-color:green;'>" + LOREM_IPSUM + " </div>" +
       "<div style='height:100px; background-color:red;'>" + LOREM_IPSUM + "</div>" +
-      "<a name='BOTTOM'></a>" +
       "</div>";
 
   var data = [
@@ -51,6 +50,29 @@ var LOREM_IPSUM =
   
 };
 
+// This is usually something like 15, but for OS X Lion and its auto-hiding
+// scrollbars, it's 0. This is a large enough difference that we need to
+// consider it when synthesizing clicks.
+// Adapted from http://davidwalsh.name/detect-scrollbar-width
+ScrollingDivTestCase.prototype.detectScrollbarWidth = function() {
+  // Create the measurement node
+  var scrollDiv = document.createElement("div");
+  scrollDiv.style.width = "100px";
+  scrollDiv.style.height = "100px";
+  scrollDiv.style.overflow = "scroll";
+  scrollDiv.style.position = "absolute";
+  scrollDiv.style.top = "-9999px";
+  document.body.appendChild(scrollDiv);
+
+  // Get the scrollbar width
+  var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
+
+  // Delete the DIV 
+  document.body.removeChild(scrollDiv);
+
+  return scrollbarWidth;
+};
+
 ScrollingDivTestCase.prototype.tearDown = function() {
 };
 
@@ -59,7 +81,7 @@ ScrollingDivTestCase.prototype.tearDown = function() {
  */
 ScrollingDivTestCase.prototype.testUnscrolledDiv = function() {
 
-  window.location.href="#TOP";
+  document.getElementById('scroller').scrollTop = 0;
 
   var clickOn4_40 = {
     clientX: 244,
@@ -80,11 +102,11 @@ ScrollingDivTestCase.prototype.testUnscrolledDiv = function() {
  * This tests that when the nested div is scrolled, things work normally.
  */
 ScrollingDivTestCase.prototype.testScrolledDiv = function() {
-  window.location.href="#BOTTOM";
+  document.getElementById('scroller').scrollTop = 117;
 
   var clickOn4_40 = {
     clientX: 244,
-    clientY: 20,
+    clientY: 30 - this.detectScrollbarWidth(),
     screenX: 416,
     screenY: 160
   };
@@ -96,89 +118,3 @@ ScrollingDivTestCase.prototype.testScrolledDiv = function() {
   assertEquals(40, this.point.xval);
   assertEquals(4, this.point.yval);
 };
-
-/*
-NORMAL
-
-mousedown 
-MouseEvent
-
-defaultPrevented?
-detail?
-returnValue?
-
-srcElement
-target
-toElement
-
-type: "mousedown"
-
-pageX: 244
-pageY: 131
-layerX: 233
-layerY: 281
-offsetX: 236
-offsetY: 235
-which: 1
-x: 244
-y: 131
-
-mouseup 
-MouseEvent
-
-clientX: 244
-clientY: 131
-screenX: 416
-screenY: 320
-type: "mouseup"
-
-pageX: 244
-pageY: 131
-layerX: 233
-layerY: 281
-offsetX: 236
-offsetY: 235
-which: 1
-x: 244
-y: 131
-
-
-SCROLLED
-
-mousedown 
-MouseEvent
-
-clientX: 244
-clientY: 20
-pageX: 244
-pageY: 20
-screenX: 417
-screenY: 160
-type: "mousedown"
-
-layerX: 233
-layerY: 170
-offsetX: 236
-offsetY: 124
-which: 1
-x: 244
-y: 20
-
-mouseup 
-MouseEvent
-
-clientX: 244
-clientY: 20
-layerX: 233
-layerY: 170
-offsetX: 236
-offsetY: 124
-pageX: 244
-pageY: 20
-screenX: 417
-screenY: 160
-type: "mouseup"
-which: 1
-x: 244
-y: 20
-*/
\ No newline at end of file