separate logic into mixin, complete test coverage with mocks and spies

src/mixins/pointerScroll.js

@@ -0,0 +1,71 @@
+export default {
+  methods: {
+    /**
+     * Adjust the scroll position of the dropdown list
+     * if the current pointer is outside of the
+     * overflow bounds.
+     * @returns {*}
+     */
+    maybeAdjustScroll() {
+      let pixelsToPointerTop = this.pixelsToPointerTop()
+      let pixelsToPointerBottom = this.pixelsToPointerBottom()
+
+      if ( pixelsToPointerTop <= this.viewport().top) {
+        return this.scrollTo( pixelsToPointerTop )
+      } else if (pixelsToPointerBottom >= this.viewport().bottom) {
+        return this.scrollTo( this.viewport().top + this.pointerHeight() )
+      }
+    },
+
+    /**
+     * The distance in pixels from the top of the dropdown
+     * list to the top of the current pointer element.
+     * @returns {number}
+     */
+    pixelsToPointerTop() {
+      let pixelsToPointerTop = 0
+      for (let i = 0; i < this.typeAheadPointer; i++) {
+        pixelsToPointerTop += this.$els.dropdownMenu.children[i].offsetHeight
+      }
+      return pixelsToPointerTop
+    },
+
+    /**
+     * The distance in pixels from the top of the dropdown
+     * list to the bottom of the current pointer element.
+     * @returns {*}
+     */
+    pixelsToPointerBottom() {
+      return this.pixelsToPointerTop() + this.pointerHeight()
+    },
+
+    /**
+     * The offsetHeight of the current pointer element.
+     * @returns {number}
+     */
+    pointerHeight() {
+      let element = this.$els.dropdownMenu.children[this.typeAheadPointer]
+      return element ? element.offsetHeight : 0
+    },
+
+    /**
+     * The currently viewable portion of the dropdownMenu.
+     * @returns {{top: (string|*|number), bottom: *}}
+     */
+    viewport() {
+      return {
+        top: this.$els.dropdownMenu.scrollTop,
+        bottom: this.$els.dropdownMenu.offsetHeight + this.$els.dropdownMenu.scrollTop
+      }
+    },
+
+    /**
+     * Scroll the dropdownMenu to a given position.
+     * @param position
+     * @returns {*}
+     */
+    scrollTo(position) {
+      return this.$els.dropdownMenu.scrollTop = position
+    },
+  }
+}