Explicitly assign dummy scrollbars to the correct width/height

Previously, dummy scrollbars were always 15px wide/tall. This caused
them to obscure the ability to click for the entire 15px region, even if
the actual scrollbar was styled to be much thinner. Now we explicitly
measure the size of scrollbars on mount and when the stylesheets change
and set the height/width explicitly.

spec/editor-component-spec.coffee

@@ -603,6 +603,21 @@ describe "EditorComponent", ->
       expect(verticalScrollbarNode.style.display).toBe 'none'
       expect(horizontalScrollbarNode.style.display).toBe ''
 
+    it "makes the dummy scrollbar divs only as tall/wide as the actual scrollbars", ->
+      atom.themes.applyStylesheet "test", """
+        ::-webkit-scrollbar {
+          width: 8px;
+          height: 8px;
+        }
+      """
+
+      node.style.height = 4 * lineHeightInPixels + 'px'
+      node.style.width = 10 * charWidth + 'px'
+      component.measureHeightAndWidth()
+
+      expect(verticalScrollbarNode.offsetWidth).toBe 8
+      expect(horizontalScrollbarNode.offsetHeight).toBe 8
+
     it "assigns the bottom/right of the scrollbars to the width of the opposite scrollbar if it is visible", ->
       scrollbarCornerNode = node.querySelector('.scrollbar-corner')