A big part of the reason that JavaScript controls can't capture the nuance is because it takes a lot of work to capture the nuance. So teams justifiably implement the 90% use case and move on.
There are projects that dedicate an unreasonable amount of resources to making these controls in JavaScript and show just how far you can get in JS. For example, https://headlessui.dev.
There are projects that dedicate an unreasonable amount of resources to making these controls in JavaScript and show just how far you can get in JS. For example, https://headlessui.dev.
EDIT:
To directly address the "invisible buffer" thing, look at this control from Headless UI: https://headlessui.dev/react/listbox.
Open it, start typing, and notice the invisible buffer actually does work here.