The forceSelection property setted on true causes inconsistent behavior when the value is removed.
If you already had a value in the input and you want to remove it and to type directly another one (without clicking outside the input after clearing it), the value will no longer have the correct format.
That will work correctly only if you click outside the input after clearing it.
Step 1. Type a full country name (ex: 'Italy'), and click outside the input, without selecting anything from the list
Result: the value will be automatically selected from the available options and will be displayed as an object, like this:
{
"name": "Italy",
"code": "IT"
}
Step 2. Remove all the text from the input and then continue with step 1
Result: the value will be only a string, not in a good format ('Italy')
Step 3. Remove again all the text, CLICK OUTSIDE the input and then continue with step 1
Result: the value will have again the correct format
Describe the bug
The forceSelection property setted on true causes inconsistent behavior when the value is removed. If you already had a value in the input and you want to remove it and to type directly another one (without clicking outside the input after clearing it), the value will no longer have the correct format. That will work correctly only if you click outside the input after clearing it.
Reproducer
https://codesandbox.io/s/pedantic-smoke-75tr44?file=/src/AutoCompleteDemo.vue
PrimeVue version
3.21.0
Vue version
3.x
Language
ES6
Build / Runtime
Vue CLI App
Browser(s)
Chrome
Steps to reproduce the behavior
Step 1. Type a full country name (ex: 'Italy'), and click outside the input, without selecting anything from the list
Step 2. Remove all the text from the input and then continue with step 1
Step 3. Remove again all the text, CLICK OUTSIDE the input and then continue with step 1
Expected behavior
No response