From c54c398c567454eafde64666204d07b52dee4310 Mon Sep 17 00:00:00 2001
From: Jeff Sagal <sagalbot@gmail.com>
Date: Sun, 1 Aug 2021 13:15:23 -0700
Subject: [PATCH] fix tests

---
 src/components/Select.vue            | 27 ++++++++++++++++-----------
 src/mixins/i18n.js                   |  6 +++++-
 src/mixins/index.js                  |  2 ++
 tests/unit/InternationalText.spec.js |  2 +-
 4 files changed, 24 insertions(+), 13 deletions(-)

diff --git a/src/components/Select.vue b/src/components/Select.vue
index a99a5ef..7bfc85b 100644
--- a/src/components/Select.vue
+++ b/src/components/Select.vue
@@ -12,7 +12,7 @@
       role="combobox"
       :aria-expanded="dropdownOpen.toString()"
       :aria-owns="`vs${uid}__listbox`"
-      aria-label="Search for option"
+      :aria-label="i18n.search.ariaLabel"
       @mousedown="toggleDropdown($event)"
     >
       <div ref="selectedOptions" class="vs__selected-options">
@@ -37,8 +37,10 @@
               :disabled="disabled"
               type="button"
               class="vs__deselect"
-              :title="`Deselect ${getOptionLabel(option)}`"
-              :aria-label="`Deselect ${getOptionLabel(option)}`"
+              :title="i18n.deselectButton.title(getOptionLabel(option))"
+              :aria-label="
+                i18n.deselectButton.ariaLabel(getOptionLabel(option))
+              "
               @click="deselect(option)"
             >
               <component :is="childComponents.Deselect" />
@@ -78,7 +80,9 @@
         </slot>
 
         <slot name="spinner" v-bind="scope.spinner">
-          <div v-show="mutableLoading" class="vs__spinner">Loading...</div>
+          <div v-show="mutableLoading" class="vs__spinner">
+            {{ i18n.spinner.text }}
+          </div>
         </slot>
       </div>
     </div>
@@ -116,9 +120,9 @@
           </slot>
         </li>
         <li v-if="filteredOptions.length === 0" class="vs__no-options">
-          <slot name="no-options" v-bind="scope.noOptions"
-            >Sorry, no matching options.</slot
-          >
+          <slot name="no-options" v-bind="scope.noOptions">
+            {{ i18n.noOptions.text }}
+          </slot>
         </li>
         <slot name="list-footer" v-bind="scope.listFooter" />
       </ul>
@@ -134,9 +138,10 @@
 </template>
 
 <script>
-import pointerScroll from '../mixins/pointerScroll'
-import typeAheadPointer from '../mixins/typeAheadPointer'
-import ajax from '../mixins/ajax'
+import ajax from '../mixins/ajax.js'
+import i18n from '../mixins/i18n.js'
+import pointerScroll from '../mixins/pointerScroll.js'
+import typeAheadPointer from '../mixins/typeAheadPointer.js'
 import childComponents from './childComponents'
 import appendToBody from '../directives/appendToBody'
 import sortAndStringify from '../utility/sortAndStringify'
@@ -150,7 +155,7 @@ export default {
 
   directives: { appendToBody },
 
-  mixins: [pointerScroll, typeAheadPointer, ajax],
+  mixins: [pointerScroll, typeAheadPointer, ajax, i18n],
 
   props: {
     /**
diff --git a/src/mixins/i18n.js b/src/mixins/i18n.js
index 2743da4..a6857f1 100644
--- a/src/mixins/i18n.js
+++ b/src/mixins/i18n.js
@@ -1,3 +1,5 @@
+const deselectLabel = (label) => `Deselect ${label}`
+
 export const text = {
   spinner: {
     text: 'Loading...',
@@ -10,10 +12,12 @@ export const text = {
   },
   selectedOption: {},
   deselectButton: {
-    ariaLabel: (label) => 'Deselect Option',
+    ariaLabel: deselectLabel,
+    title: deselectLabel,
   },
   clearButton: {
     ariaLabel: 'Clear Selection',
+    title: 'Clear Selection',
   },
 }
 
diff --git a/src/mixins/index.js b/src/mixins/index.js
index b6693ab..941d764 100644
--- a/src/mixins/index.js
+++ b/src/mixins/index.js
@@ -4,3 +4,5 @@ import pointer from './typeAheadPointer'
 import pointerScroll from './pointerScroll'
 
 export default { ajax, pointer, pointerScroll, i18n }
+
+// export const mixins = [ajax, i18n, pointer, pointerScroll]
diff --git a/tests/unit/InternationalText.spec.js b/tests/unit/InternationalText.spec.js
index 8a8cceb..d7e75f2 100644
--- a/tests/unit/InternationalText.spec.js
+++ b/tests/unit/InternationalText.spec.js
@@ -25,7 +25,7 @@ describe('International Text', () => {
   it('renders default text for deselect.ariaLabel', () => {
     const Select = mountDefault({ value: 'one', multiple: true })
     expect(Select.find('.vs__deselect').attributes()['aria-label']).toBe(
-      'Deselect Option'
+      'Deselect one'
     )
   })
 })