Pull onTab up to prop, add test

Jeff · Jeff · commit 237e946c1911 · 2018-08-07T21:13:34.000-07:00
diff --git a/src/components/Select.vue b/src/components/Select.vue
@@ -549,6 +549,18 @@
         }
       },
 
+      /**
+       * Select the current value if selectOnTab is enabled
+       */
+      onTab: {
+        type: Function,
+        default: function () {
+          if (this.selectOnTab) {
+            this.typeAheadSelect();
+          }
+        },
+      },
+
       /**
        * Enable/disable creating options from searchInput.
        * @type {Boolean}
@@ -927,16 +939,6 @@
         }
       },
 
-      /**
-       * Select the current value if selectOnTab is enabled
-       * @return {void}
-       */
-      onTab() {
-        if (this.selectOnTab) {
-          this.typeAheadSelect();
-        }
-      },
-
       /**
        * Determine if an option exists
        * within this.mutableOptions array.
diff --git a/test/unit/specs/Select.spec.js b/test/unit/specs/Select.spec.js
@@ -109,6 +109,22 @@ describe('Select.vue', () => {
 			expect(vm.$children[0].mutableValue).toEqual(vm.value)
 		})
 
+    it('can select an option on tab', (done) => {
+      const vm = new Vue({
+        template: `<div><v-select :options="['one','two']" select-on-tab></v-select></div>`,
+        components: {vSelect},
+      }).$mount()
+
+      vm.$children[0].typeAheadPointer = 0
+
+      trigger(vm.$children[0].$refs.search, 'keydown', (e) => e.keyCode = 9)
+
+      Vue.nextTick(() => {
+        expect(vm.$children[0].mutableValue).toEqual('one');
+        done();
+      })
+    })
+
 		it('can deselect a pre-selected object', () => {
 			const vm = new Vue({
 				template: '<div><v-select :options="options" :value="value" :multiple="true"></v-select></div>',
@@ -1377,7 +1393,7 @@ describe('Select.vue', () => {
 					value: 'foo'
 				}
 			}).$mount()
-			
+
 			expect(vm.mutableValue).toEqual('foo')
 			vm.$el.querySelector( 'button.clear' ).click()
 			expect(vm.mutableValue).toEqual(null)
@@ -1396,6 +1412,6 @@ describe('Select.vue', () => {
 			const buttonEl = vm.$el.querySelector( 'button.clear' )
 			expect(buttonEl.disabled).toEqual(true);
 		})
-	
+
 	});
 })
