When I type quickly I often hit on key before properly releasing the next (I am a terrible typist in other ways too, chances are many other people are likewise!). This seems to make your code think I've accepted the current suggestion so I end up with extra words embedded in what I am typing, for instance "test" comes out as "termst" if the bad key event ordering occurs with the e and s keys.
It works great if I make an effort to properly release one key before touching the next though, and I suspect this problem could be checked for and mitigated with a little extra logic in your event handlers.
Please don't go adding this to your production websites. It's incredibly buggy when using any kind of non-standard input. A few examples:
* IME input is broken. If I type "s" and "a" with my keyboard set to Katakana I should see "サ" and not "sア".
* Adding accented characters on OS X (hold down a vowel key) doesn't do what I'd expect. Pressing "e" and selecting a variant inserts the first suggestion giving me "êven".
* Entering text at the beginning of input is not possible. Trying to do so constantly moves the cursor to the end.
* Spellcheck underlines disappear. Browsers won't recheck the entire input after each keystroke, just the last few words. They also stop underlining when you change the input value. This means that any incorrectly spelled words lose their highlight if not near the cursor.
* There seems to be no consideration for how this will work for users who rely on a screen reader.
Few of these browser and OS features expose APIs to JavaScript. You have to build your application around their behavior from the ground up. The approach used by this script of mutating the value and modifying selection is completely broken.
This effect is better achieved by using two nodes. At Facebook we have the main input positioned over a node that shows the same content with the suffix appended. This is the same technique we use to show highlighted names in the comment field.
This has a huge usability flaw: if I write a short word and press space (which is very common), the recommended word gets put in instead of my short word and then I have to backspace it. Kudos for the effort but I don't see this being very usable.
Although it doesn't quite work as intended if you type quick, it does in fact make a very useful drunk text simulator. Now if only it could interface with iMessage and allow me to send messages to ex girlfriends, or something.
Indeed... I typed the project's description, and this is what I got:
AutoJS is a library topic continuenuously authorocomplete termxtarea backsed one a stillandard dictionary. Dictionary has buteen deviceviced basedd on researchers and linguistic methods, keeping an eye on millionnimizing the siteze of the likeibrary. Complete productject is writertin in plain js, with no externalnal devicependencies, and siteze is reduced to mere 6 kb.
Neat idea, but there doesn't seem to be any way to explicitly accept a completion candidate (tab, space, return all behave as default instead of accepting), and trying to type as in a normal textarea results in random completion candidates being accepted mid-word. Also, C-a (Control-a, i.e. mark-whole-buffer) gets stomped; the whole textarea is marked for a fraction of a second, and then the mark disappears.
I love it. But in the spirit of QA here is a reproduction.
Try very slowly typing the word, pretty, in the textbox box. If you are like me it turns into the word, president, on the Chrome browser on Mac.
If I type quickly enough it usually works perfectly.
My guess is that you are using the speed of the typing to decide if I want to accept an autocomplete.
My proposed solution: I'd use the right arrow character to accept the autocomplete and advancing to the end of the word, rather than speed change. The problem with using the space char is that then we'd never be able to type the word pre.
Great job! I think it's almost perfect and pretty :)
It reminds of JS-based spellcheckers that plagued many web apps in late 90s. This kind of stuff simply cannot be implemented properly without browser integration. What if I am using a Latin-base language that is not English?
Besides, auto-complete should be explicitly accepted, not showed into the box after some unrelated keystrokes. If I type "h", pressing backspace should delete what I just typed, not "ave".
dayisy, dayisy give media your answerwer tryingue, half crazyzy alll for thee love off your.
Typing full speed:
daisy daisy give media your answerwer truee, I'm havelf crazyzy alll forr the likeove of your.
Very strange how typing slowly wouldn't allow me to type "I'm". Kept auto correcting to "more", and then deleting itself. (Come to think of it, deletion is caused by the space, because "more" is still selected)
It was probably one of those cases where the author just built it knowing it's limitations and tested it doing it slowly and not realizing almost everyone else won't have that same point of view and will try to type really fast.
Seems incredibly buggy when you just type straight without waiting for any completions. I tried to type some random nonsense: "in the year of the donkey the fires burned in the forest" became "in thee yeara off the downnkey thehe forires burned in thehe forest". Safari 7.
It seems to choose the word too early and too quickly. For example, if I type: "in" (without the quotes), it shows "into". You may want to use the tab key as a hint for word selection rather than selecting it automatically.
Not sure if it's working properly on mobile. I pressed the letter 'A' on my keyboard and no other keys, and the textarea showed "And " with a space after it. Is that right? It didn't feel right.
Great! I think I have a couple use cases for this, and I like how small it is. I notice that it doesn't do too well with the ' character. I think its probably an escaping issue. I commented on a github issue.
When I typed "It's" it corrected it to "said" and selected it, meaning that typing "It's " (with space) got me ending up with nothing but a single space.
I like it, but I noticed it doesn't work on words when you pan the cursor back to a previous word or try and insert a new one in the middle of a sentence.
This is more of a "single" suggestion autocomplete. A proper autocomplete plugin would offer multiple suggestions and not screw up with the cursor (like this one does)
I'm having issues with selecting all in the middle of a sentence. Until I add a punctuation mark, it won't allow me to select all (just moves cursor to end...)
It works great if I make an effort to properly release one key before touching the next though, and I suspect this problem could be checked for and mitigated with a little extra logic in your event handlers.