fix(VSelect): ignore keypress when readonly (#8194)

Author: sukano

packages/vuetify/src/components/VSelect/VSelect.ts

@@ -567,7 +567,10 @@ export default baseMixins.extend<options>().extend({
       }
     },
     onKeyPress (e: KeyboardEvent) {
-      if (this.multiple) return
+      if (
+        this.multiple ||
+        this.readonly
+      ) return
 
       const KEYBOARD_LOOKUP_THRESHOLD = 1000 // milliseconds
       const now = performance.now()

packages/vuetify/src/components/VSelect/__tests__/VSelect4.spec.ts

@@ -253,4 +253,27 @@ describe('VSelect.ts', () => {
     expect(wrapper.vm.internalValue).toBe('Foo')
     expect(wrapper.vm.$refs.menu.listIndex).toBe(-1)
   })
+
+  it('should not change value when typing on readonly field', async () => {
+    const wrapper = mountFunction({
+      propsData: {
+        items: ['Foo', 'Bar', 'Fizz', 'Buzz'],
+        readonly: true,
+        value: 'Foo',
+      },
+    })
+
+    const input = wrapper.find('input')
+    input.trigger('click')
+
+    await wrapper.vm.$nextTick()
+
+    expect(wrapper.vm.internalValue).toBe('Foo')
+
+    input.trigger('keypress', { key: 'b' })
+
+    await wrapper.vm.$nextTick()
+
+    expect(wrapper.vm.internalValue).toBe('Foo')
+  })
 })