`tabSubmit` does not work when `clearable` is enabled

[OlaAlsaker]

Describe the bug

If the clearable is set to true (which is default), the tabSubmit option in :textInput will not work correctly. This is because when pressing tab, the focus shifts to the clear-button. For some reason, the datepicker will not validate the input-string.

However, setting :clearable="false" will fix the issue.

Reproduction

A full reproduction is linked below. The first datepicker will not work, but the second one will.

https://stackblitz.com/edit/vuepic-vue-datepicker-wklyj4?file=src%2Fcomponents%2FPlayground.vue

Expected behavior

I would expect the string to be validated as soon as I tab away, even if I tab to the clear-button inside the input. Especially since this would be the default behavior.

Desktop & mobile (please complete the following information):

• Browser Chrome
• Library version 9.0.1

[OlaAlsaker]

@Jasenkoo Unfortunately, this issue is still present in 9.0.2.

I believe the issue is this code:

vue-datepicker/src/VueDatePicker/components/DatepickerInput.vue

Lines 250 to 252 in 6993cd9

	if (defaultedTextInput.value.enabled && defaultedTextInput.value.tabSubmit) {
	parseInput((ev.target as HTMLInputElement).value);
	}

When you tab away from the clear-button, ev.target becomes the <button>-element. And trying to do (ev.target as HTMLInputElement).value on a <button> will result in null. And because it is null, the datepicker will just reset back to today's date.

That is why I changed this to use inputRef.value in my PR, because then it fetches the value from the actual input. You reverted this change in dced8f5 . But of course, it might have some side-effects that I don't know of 😄

[OlaAlsaker]

@Jasenkoo , any thoughts around my previous comment? I don't think the issue is totally fixed.