From 115f24aba21348b0a8340e655ec66a5272e92ce9 Mon Sep 17 00:00:00 2001
From: Jeff Sagal <sagalbot@gmail.com>
Date: Thu, 17 Feb 2022 16:57:27 -0800
Subject: [PATCH] fix: allow typeAheadSelect only when option is selectable
 (#1529)

---
 src/mixins/typeAheadPointer.js  |  2 +-
 tests/helpers.js                | 10 ++++++++--
 tests/unit/CreateOption.spec.js |  2 +-
 tests/unit/Selectable.spec.js   | 17 ++++++++++++++++-
 tests/unit/Tagging.spec.js      | 10 ++--------
 5 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/src/mixins/typeAheadPointer.js b/src/mixins/typeAheadPointer.js
index af35f89..4409c0a 100644
--- a/src/mixins/typeAheadPointer.js
+++ b/src/mixins/typeAheadPointer.js
@@ -67,7 +67,7 @@ export default {
     typeAheadSelect() {
       const typeAheadOption = this.filteredOptions[this.typeAheadPointer]
 
-      if (typeAheadOption) {
+      if (typeAheadOption && this.selectable(typeAheadOption)) {
         this.select(typeAheadOption)
       }
     },
diff --git a/tests/helpers.js b/tests/helpers.js
index b223097..ecabf3d 100755
--- a/tests/helpers.js
+++ b/tests/helpers.js
@@ -9,11 +9,17 @@ import Vue from 'vue'
  * @param Wrapper {Wrapper<Vue>}
  * @param searchText
  */
-export const searchSubmit = (Wrapper, searchText = false) => {
+export const searchSubmit = async (Wrapper, searchText = false) => {
+  const search = Wrapper.findComponent({ ref: 'search' })
+  await search.trigger('focus')
+
   if (searchText) {
     Wrapper.vm.search = searchText
+    await Wrapper.vm.$nextTick()
   }
-  Wrapper.findComponent({ ref: 'search' }).trigger('keydown.enter')
+
+  await search.trigger('keydown.enter')
+  await Wrapper.vm.$nextTick()
 }
 
 /**
diff --git a/tests/unit/CreateOption.spec.js b/tests/unit/CreateOption.spec.js
index 258e282..aa58b81 100644
--- a/tests/unit/CreateOption.spec.js
+++ b/tests/unit/CreateOption.spec.js
@@ -1,4 +1,4 @@
-import { searchSubmit, selectTag, selectWithProps } from '../helpers'
+import { selectTag, selectWithProps } from '../helpers'
 
 describe('CreateOption When Tagging Is Enabled', () => {
   it('can select the current search text as a string', async () => {
diff --git a/tests/unit/Selectable.spec.js b/tests/unit/Selectable.spec.js
index b17e57b..5c01ea7 100644
--- a/tests/unit/Selectable.spec.js
+++ b/tests/unit/Selectable.spec.js
@@ -1,4 +1,4 @@
-import { selectWithProps } from '../helpers'
+import { searchSubmit, selectWithProps } from '../helpers'
 
 describe('Selectable prop', () => {
   it('should select selectable option if clicked', async () => {
@@ -56,4 +56,19 @@ describe('Selectable prop', () => {
 
     expect(Select.vm.typeAheadPointer).toEqual(0)
   })
+
+  it('should not let the user select an unselectable option with return', async () => {
+    const Select = selectWithProps({
+      options: ['one', 'two'],
+      multiple: true,
+      selectable: (option) => option !== 'two',
+    })
+
+    // this sets the typeAheadPointer to 0
+    await searchSubmit(Select, 'one')
+    expect(Select.vm.selectedValue).toEqual(['one'])
+
+    await searchSubmit(Select, 'two')
+    expect(Select.vm.selectedValue).toEqual(['one'])
+  })
 })
diff --git a/tests/unit/Tagging.spec.js b/tests/unit/Tagging.spec.js
index 1b6c5fa..aa9a76d 100755
--- a/tests/unit/Tagging.spec.js
+++ b/tests/unit/Tagging.spec.js
@@ -165,10 +165,7 @@ describe('When Tagging Is Enabled', () => {
       options: [{ label: 'one' }, two],
     })
 
-    Select.vm.search = 'two'
-    await Select.vm.$nextTick()
-
-    searchSubmit(Select)
+    await searchSubmit(Select, 'two')
     expect(Select.vm.selectedValue).toEqual([two])
   })
 
@@ -180,10 +177,7 @@ describe('When Tagging Is Enabled', () => {
       options: [{ label: 'one' }, two],
     })
 
-    Select.vm.search = 'two'
-    await Select.vm.$nextTick()
-
-    searchSubmit(Select)
+    await searchSubmit(Select, 'two')
     expect(Select.vm.selectedValue).toEqual([two])
   })