Bug 1316505 part.1 The "wheel" event handler of <scrollbox> should use |.scrollByPixels()| for respecting wheel event's scroll speed and scrolling smoother r=mstange

Currently, ths "wheel" event handler of <scrollbox> uses |.scrollByIndex()|.  However, it scrolls too fast when "wheel" event has high resolution delta value when its deltaMode is DOM_DELTA_LINE.

For respecting the delta value, it should use |.scrollByPixels()|.  Therefore, this patch implements new readonly property, |.lineScrollAmount|, which returns font size of the |.scrollbox| and makes "wheel" event handler multiplies the delta value and |.lineScrollAmount|.

MozReview-Commit-ID: KzIvJyxqrn5

--HG--
extra : rebase_source : 0e11608bf4c47cd7aeef3c1a91b705cfcdf281ab

browser/base/content/test/general/browser_overflowScroll.js

@@ -75,14 +75,6 @@ function runOverflowTests(aEvent) {
   ok(left(scrollbox) <= firstScrollableLeft, "Scrolled to the start with a triple click " +
      "(" + left(scrollbox) + " <= " + firstScrollableLeft + ")");
 
-  for (var i = 2; i; i--)
-    EventUtils.synthesizeWheel(scrollbox, 1, 1, { deltaX: -1.0, deltaMode: WheelEvent.DOM_DELTA_LINE });
-  is(left(firstScrollable()), firstScrollableLeft, "Remained at the start with the mouse wheel");
-
-  element = nextRightElement();
-  EventUtils.synthesizeWheel(scrollbox, 1, 1, { deltaX: 1.0, deltaMode: WheelEvent.DOM_DELTA_LINE});
-  isRight(element, "Scrolled one tab to the right with the mouse wheel");
-
   while (tabs.length > 1)
     gBrowser.removeTab(tabs[0]);
 

toolkit/content/widgets/scrollbox.xml

@@ -156,6 +156,23 @@
                  this._scrollbox.scrollWidth;
         ]]></getter>
       </property>
+
+      <property name="lineScrollAmount" readonly="true">
+        <getter><![CDATA[
+          // If inherited element wants to customize line scroll amount by
+          // wheel events, it should override this.
+          var px = document.defaultView
+                           .getComputedStyle(this._scrollbox, "")
+                           .getPropertyValue("font-size");
+          if (px.endsWith("px")) {
+            return parseInt(px);
+          }
+          // XXX Is this possible case?  For the last resote, let's return
+          //     default font-size of web contents.
+          return 16;
+        ]]></getter>
+      </property>
+
       <property name="scrollPaddingRect" readonly="true">
         <getter><![CDATA[
           // This assumes that this._scrollbox doesn't have any border.
@@ -569,7 +586,7 @@
           else if (event.deltaMode == event.DOM_DELTA_PAGE)
             this.scrollByPage(event.deltaY);
           else
-            this.scrollByIndex(event.deltaY);
+            this.scrollByPixels(event.deltaY * this.lineScrollAmount);
         }
         // We allow vertical scrolling to scroll a horizontal scrollbox
         // because many users have a vertical scroll wheel but no
@@ -590,7 +607,7 @@
             else if (event.deltaMode == event.DOM_DELTA_PAGE)
               this.scrollByPage(scrollByDelta);
             else
-              this.scrollByIndex(scrollByDelta);
+              this.scrollByPixels(scrollByDelta * this.lineScrollAmount);
           }
 
           if (this._prevMouseScrolls.length > 1)