[Bug Report] VTextField append icons are not focusable

[phiter]

Environment

Vuetify Version: 2.2.4
Vue Version: 2.6.11
Browsers: Chrome 79.0.3945.117
OS: Windows 10

Steps to reproduce

1. Focus on the text field
2. Try to press tab or shift tab

Expected Behavior

The append/prepend icons should get focus and have an active focus state

Actual Behavior

They don't

Reproduction Link

https://codepen.io/phiter/pen/KKwGyWR

[phiter]

I tested this by replacing the genIcon function in VInput.ts and while it works for VTextField it makes some VSelect tests fail because it also uses an append icon for the dropdown icon.

vuetify/packages/vuetify/src/components/VInput/VInput.ts

Lines 166 to 209 in 2a802d1

	genIcon (
	type: string,
	cb?: (e: Event) => void
	) {
	const icon = (this as any)[`${type}Icon`]
	const eventName = `click:${kebabCase(type)}`
	const data: VNodeData = {
	props: {
	color: this.validationState,
	dark: this.dark,
	disabled: this.disabled,
	light: this.light,
	},
	on: !(this.listeners$[eventName] || cb)
	? undefined
	: {
	click: (e: Event) => {
	e.preventDefault()
	e.stopPropagation()
	this.$emit(eventName, e)
	cb && cb(e)
	},
	// Container has g event that will
	// trigger menu open if enclosed
	mouseup: (e: Event) => {
	e.preventDefault()
	e.stopPropagation()
	},
	},
	}
	return this.$createElement('div', {
	staticClass: `v-input__icon v-input__icon--${kebabCase(type)}`,
	key: type + icon,
	}, [
	this.$createElement(
	VIcon,
	data,
	icon
	),
	])
	},

    genIcon (
      type: string,
      cb?: (e: Event) => void
    ) {
      const icon = (this as any)[`${type}Icon`]
      const eventName = `click:${kebabCase(type)}`

      const data: VNodeData = {
        props: {
          color: this.validationState,
          dark: this.dark,
          disabled: this.disabled,
          light: this.light,
        },
      }

      return this.$createElement(VBtn, {
        props: {
          icon: true,
          small: true,
        },
        staticClass: `v-input__icon v-input__icon--${kebabCase(type)}`,
        key: type + icon,
        on: !(this.listeners$[eventName] || cb)
          ? undefined
          : {
            click: (e: Event) => {
              e.preventDefault()
              e.stopPropagation()

              this.$emit(eventName, e)
              cb && cb(e)
            },
            // Container has g event that will
            // trigger menu open if enclosed
            mouseup: (e: Event) => {
              e.preventDefault()
              e.stopPropagation()
            },
          },
      }, [
        this.$createElement(
          VIcon,
          data,
          icon
        ),
      ])
    },