Can't unfocus on mobile

[Haroenv]

• react-autocompletely version:
• node version:
• npm (or yarn) version:

Relevant code or config

https://codesandbox.io/s/9rWEmzEv8

What you did:

Open it on an iPhone, try to press "done", but it doesn't dismiss the focusing

What happened:

Input is permanently focused, not even the url bar is accessible. Can get the focus back out of it when pressing refresh only

Reproduction repository:

https://codesandbox.io/s/9rWEmzEv8

Problem description:

Suggested solution:

Allow the input to blur

[kentcdodds]

I cannot reproduce this on my Android phone. Are you sure it's a problem? Maybe something it's only an ios issue?

[FezVrasta]

I can reproduce it on iOS on both Chrome and Safari. The input seems to keep focus and the keyboard can't be closed.

[Haroenv]

Here's a reproducible example in the iOS simulator, might be related to how Safari deals with blurring?

[kentcdodds]

Oh, that's odd. And that's how it works on native (no simulated) iOS as well?

We definitely want to fix that! Could you dig into it a little bit?

[FezVrasta]

I tested only on real device so I'd say "yes"

[dashed]

Interesting. I can confirm this issue.

[kentcdodds]

Alrighty! Who wants to fix it? 😄

[joao-alberto]

@kentcdodds I want 🤘

[dashed]

I skimmed through this. The bug seems to be resolved when commenting this line out: https://github.com/paypal/react-autocompletely/blob/008129dca3da8ef7e118fd1bbc93c7cad55dc6d5/src/input.js#L77

When the input is blurred, handleBlur is called, which then calls this.autocomplete.reset(), which then calls this.input.reset().

Im guessing moveCursorToTheEnd re-focuses the input element. On my iphone device, attempting to dismiss the input box actually flickers the keyboard (i.e. sliding down and back up).

You can even see this in action in the gif at: #32 (comment)

FYI, I debugged this in Safari.

---

@kentcdodds what was the reason for moving the cursor to the end after resetting?

@psicotropicos I'm wondering if you've reached similar findings. Since you've called dibs on this, I'd let you PR this if this is the proper fix 👍

[joao-alberto]

@dashed This was the same solution I found so far.
I'm studying the rest of the code to understand the reason for moving the cursor to the end

[kentcdodds]

You know, I think that we probably don't need that. At least not in the core library. People could implement it themselves if they need. Let's remove that code 👍 Thanks!

[kentcdodds]

Who wants to do that?

[joao-alberto]

I will send the PR

[joao-alberto]

Done in #46
Thank you very much @dashed 🤘

[kentcdodds]

This has been fixed. I'll push another beta release as soon as I get the rest of the PRs merged.