feat: set pointer to most recent selected option on open (#1574)

Co-authored-by: Jeff Sagal <sagalbot@gmail.com>

tests/unit/Accessibility.spec.js

@@ -4,7 +4,7 @@ describe('Search Slot Scope', () => {
   /**
    * @see https://www.w3.org/WAI/PF/aria/states_and_properties#aria-activedescendant
    */
-  describe('aria-activedescendant', () => {
+  fdescribe('aria-activedescendant', () => {
     it('adds the active descendant attribute only when the dropdown is open and there is a typeAheadPointer value', async () => {
       const Select = mountDefault()
 
@@ -21,7 +21,7 @@ describe('Search Slot Scope', () => {
     })
 
     it("adds the active descendant attribute when there's a typeahead value and an open dropdown", async () => {
-      const Select = mountDefault()
+      const Select = mountDefault({ value: 'three' }, ['one', 'two', 'three'])
 
       Select.vm.open = true
       Select.vm.typeAheadPointer = 1
@@ -29,7 +29,7 @@ describe('Search Slot Scope', () => {
 
       expect(
         Select.vm.scope.search.attributes['aria-activedescendant']
-      ).toEqual(`vs${Select.vm.uid}__option-1`)
+      ).toEqual(`vs${Select.vm.uid}__option-2`)
     })
   })
 })

tests/unit/TypeAhead.spec.js

@@ -44,4 +44,37 @@ describe('Moving the Typeahead Pointer', () => {
     Select.vm.typeAheadDown()
     expect(Select.vm.typeAheadPointer).toEqual(2)
   })
+
+  it('will set the pointer to the selected option when opening', async () => {
+    const Select = shallowMount(VueSelect, {
+      propsData: {
+        value: 'three',
+        options: ['one', 'two', 'three'],
+      },
+    })
+
+    Select.findComponent({ ref: 'search' }).trigger('focus')
+    await Select.vm.$nextTick()
+
+    expect(Select.vm.typeAheadPointer).toEqual(2)
+  })
+
+  it('will set the pointer to the reduced selected option when opening', async () => {
+    const Select = shallowMount(VueSelect, {
+      propsData: {
+        value: 3,
+        reduce: ({ value }) => value,
+        options: [
+          { label: 'one', value: 1 },
+          { label: 'two', value: 2 },
+          { label: 'three', value: 3 },
+        ],
+      },
+    })
+
+    Select.findComponent({ ref: 'search' }).trigger('focus')
+    await Select.vm.$nextTick()
+
+    expect(Select.vm.typeAheadPointer).toEqual(2)
+  })
 })