1 files changed, 13 insertions, 14 deletions

diff --git a/toolkit/content/widgets/spinner.js b/toolkit/content/widgets/spinner.js
index 208ab1931..059e151fc 100644
--- a/toolkit/content/widgets/spinner.js
+++ b/toolkit/content/widgets/spinner.js
@@ -98,7 +98,7 @@ function Spinner(props, context) {
     setState(newState) {
       const { spinner } = this.elements;
       const { value, items } = this.state;
-      const { value: newValue, items: newItems, isValueSet, isInvalid } = newState;
+      const { value: newValue, items: newItems, isValueSet, isInvalid, smoothScroll = true } = newState;
 
       if (this._isArrayDiff(newItems, items)) {
         this.state = Object.assign(this.state, newState);
@@ -106,16 +106,18 @@ function Spinner(props, context) {
         this._scrollTo(newValue, true);
       } else if (newValue != value) {
         this.state = Object.assign(this.state, newState);
-        this._smoothScrollTo(newValue);
-      }
-
-      if (isValueSet) {
-        if (isInvalid) {
-          this._removeSelection();
+        if (smoothScroll) {
+          this._smoothScrollTo(newValue, true);
         } else {
-          this._updateSelection();
+          this._scrollTo(newValue, true);
         }
       }
+
+      if (isValueSet && !isInvalid) {
+        this._updateSelection();
+      } else {
+        this._removeSelection();
+      }
     },
 
     /**
@@ -266,11 +268,11 @@ function Spinner(props, context) {
      * Attach event listeners to the spinner and buttons.
      */
     _attachEventListeners() {
-      const { spinner } = this.elements;
+      const { spinner, container } = this.elements;
 
       spinner.addEventListener("scroll", this, { passive: true });
-      document.addEventListener("mouseup", this, { passive: true });
-      document.addEventListener("mousedown", this);
+      container.addEventListener("mouseup", this, { passive: true });
+      container.addEventListener("mousedown", this, { passive: true });
     },
 
     /**
@@ -288,9 +290,6 @@ function Spinner(props, context) {
           break;
         }
         case "mousedown": {
-          // Use preventDefault to keep focus on input boxes
-          event.preventDefault();
-          event.target.setCapture();
           this.state.mouseState = {
             down: true,
             layerX: event.layerX,