Browser autocomplete suggestions prompt, generated from datalist, show twice.

[berridgeab]

Vue version

3.2.47

Link to minimal reproduction

https://play.vuejs.org/#eNq9VlFv2zYQ/itXoYAaIJLQZMUAVzaSpQMWoF2HNcge5j3Q0tnmQpECSdkNAv/3HUlJlhUvS1pgepJ4p7vv+3hH3kN0WdfppsFoEuWm0Ly2YNA29WwueVUrbeEBNC5hB0utKojJNe5NV6qqr2Xd2GCcR2nWL7mg82guAeayUNJY4G75lgmYuohv4viks9DnB2aZ4PQejH/GH+4lq3gBn2vLlYS38SmM186OrJ3Hf1HYPAtciAV9WKxqwSzSF0C+fjv7qVlBBtfGNJhn9O3XHWWg5wsKLCyXK2ASVIjq6TH45ebTRyg7pG/smllYMwMLRAllAMKEuIcVStSUsYTFPdw2SJBc6II1Bg3YNQJrrCpIK4EWuyxWUSQwa7Wl9y0vMCXtCFkWoDnkNwp+x1qrsikG0JVoseeCz64EL+7AhaM0XnMgYAQldrQ96TjNM/Lc/3NDrguttga1y9+I0sOA80Ocplmt0DisJkjimRijCu7JdtKMwwdJCRNRXfqfAmMzdrxcWoeg34G96+lj1fZoYMuFCIibGtiKcbmPnGdBnjZLq5l7Pi+I74Z5JK21l7QZSnodQPtd5waMpX/GG81T2i6p2lZgVMWMOGzQ/SkPgW+VvjOkG7nriomxCG22sHWuvKSCTVKpEgWUXDtpXhY2z3o2oY7ezULXUjM2OIGHh641dztS4F3w7RsiF2yBXQD6dAmTgM4pMo27bU/aFog7uNO4CxwfQJ3l2T5IHziB3NTUc4WgkprGqLXSse/VtlOdtfcODNxxQ2UlqRu33K67xCfQGFc/x3tyWKae2mGb1SMEIWN/QA2bYF93oeqADQtYyVeHgV8saKi0Z4q3mP3RVQB+LQgAlsRw8e+K/argNvk01OtoZT+S6yip4eL3Fc//RfaZxfHdxLpN/NameDHVY53wDTv7Kkngo6t4OrPD792xDUkSXPq7kJePCXdCtbfbxh020/hLiNRf60Q7ODzH/exl7uf/5T6y51nHoXM/TrAr1f3uD7Uia8Uei0UtYvv0yVLpadx+0bkxmIBimLTogvkpjHk2mG1yY+9FGHJSf3TBQzt2KKH0hHKU79tbcKmkTbbIV2s7gYUS5Xu3vvODkw8SnUYHk5wbDx3Hq8ZYVfXLgVs7ONJbllG5YXsB0XEe1t1gUyIdqrq/+OcSv/oRssQlawRNmQ4Al2vU3F5aq80ElkwYnMuAajDOjcZUisAl/qZVbWhs9EXv7zU/CAbjzxW3ztjUpB1ORj5PDYuhodsNmUf7P8No2z4X3o3sr5EyvTmS5xRe44aaM7VMr5C0c6snB0E2yYLL0gVhjv88yg43mLYkjN1Jxer0b6MkbYqXbd4a6B+6zNtai/z8PaGXtbW1mWRZI+u7VUpnTHZBtkw30vIKk1JVF+fpWfrDj1lJVTVcT9FUSTsXUsZ5dDoInrnhCXWikVTWqJ9MNvI9SDiyPUraluYu2v0Dm7NJiw==

Steps to reproduce

1. Click on the input labelled 'Bug Issue'.
2. The browser should show 3 autocomplete suggestions from the associated datalist.
3. Select one of the options.
4. After selecting the option the autocomplete suggestion will show up again with the value just selected.

What is expected?

After selecting an autocomplete suggestion the box should close and be used as the inputs value.

What is actually happening?

After selecting an autocomplete suggestion the value is used as the inputs value but the autocomplete dropdown shows again.

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 10.77 GB / 31.84 GB
  Binaries:
    Node: 14.17.4 - C:\Program Files\nodejs\node.EXE
    npm: 6.14.14 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (112.0.1722.68)
    Internet Explorer: 11.0.19041.1566

Any additional comments?

• Only affects Chrome (Tested Chrome / Firefox, Safari untested).
• Works as expected if the datalist is statically generated (with or without v-model).
• Works as expected if the datalist is dynamically generated (but no v-model directive).
• Error only seems to happen if the datalist options are generated from a v-for and the associated input uses a v-model directive.
• Maybe just a Chrome related issue (Datalists implementations have been known to be buggy in the past).