fix / SCROLLBAR_WIDTH returned value

when on an iOS device and the scrollbar pseudo element was present with
an explicit width value, (e.g: `::-webkit-scrollbar {width: 5px}`) the
SCROLLBAR_WIDTH variable will hold `5` instead of `0` (which is the value
we expect in order to prevent the custom-scrollbars), so, as a result the
custom-scrollbars were present, but they sould not.

to fix this, we are adding the `::-webkit-scrollbar` pseudo element on
the temporal element we use to measure the scrollbar-width setting its
`width` property to the `initial` value. This will return `0` on iOS
devices.

gemini-scrollbar.css

@@ -1,5 +1,16 @@
+/* @helper: used to measure the scrollbar width on a temporal element */
+.gm-test {
+  visibility: hidden;
+  width: 100px;
+  overflow: scroll;
+  -ms-overflow-style: scrollbar;
+}
+.gm-test::-webkit-scrollbar {
+  width: initial;
+}
+
 /* disable selection while dragging */
-body.gm-scrollbar-disable-selection {
+.gm-scrollbar-disable-selection {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;

index.js

@@ -7,24 +7,6 @@
 (function() {
     var SCROLLBAR_WIDTH, CLASSNAMES;
 
-    SCROLLBAR_WIDTH = (function() {
-        var tmpElement = document.createElement("div");
-        tmpElement.style.visibility = "hidden";
-        tmpElement.style.width = "100px";
-        tmpElement.style.msOverflowStyle = "scrollbar";
-        document.body.appendChild(tmpElement);
-
-        var widthNoScroll = tmpElement.offsetWidth;
-        var inner = document.createElement("div");
-        tmpElement.style.overflow = "scroll";
-        inner.style.width = "100%";
-        tmpElement.appendChild(inner);
-        var widthWithScroll = inner.offsetWidth;
-        tmpElement.parentNode.removeChild(tmpElement);
-
-        return (widthNoScroll - widthWithScroll);
-    }());
-
     CLASSNAMES = {
         element: 'gm-scrollbar-container',
         verticalScrollbar: 'gm-scrollbar -vertical',
@@ -33,9 +15,21 @@
         view: 'gm-scroll-view',
         autoshow: 'gm-autoshow',
         disable: 'gm-scrollbar-disable-selection',
-        smoothScrolling: 'gm-smooth-scrolling'
+        prevented: 'gm-prevented',
+        scrollbarWidthTest: 'gm-test'
     };
 
+    SCROLLBAR_WIDTH = (function() {
+        var scrollDiv = document.createElement("div");
+        scrollDiv.className = CLASSNAMES.scrollbarWidthTest;
+        document.body.appendChild(scrollDiv);
+
+        var scrollbarWidth = (scrollDiv.offsetWidth - scrollDiv.clientWidth);
+        document.body.removeChild(scrollDiv);
+
+        return scrollbarWidth;
+    }());
+
     function GeminiScrollbar(config) {
         this.element = null;
         this.autoshow = false;
@@ -62,7 +56,7 @@
 
     GeminiScrollbar.prototype.create = function create() {
         if (SCROLLBAR_WIDTH === 0) {
-            this.element.classList.add(CLASSNAMES.smoothScrolling);
+            this.element.classList.add(CLASSNAMES.prevented);
             return this;
         }