shipshapecode / shipshapecode/shepherd
Targeted input loses focus on android and ios devices
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 13.8k
- Forks
- 658
- Avg merge
- 4d 5h
- Merged PRs (30d)
- 15
Description
Hey, I am having a weird issue in mobile devices that I cannot figure out.
Basically I have one step that targets an input element, and it is expected that the user types something to proceed to the next step.
This works fine when trying on desktop, but on android or ios when I click the input element to start typing the input immediately loses focus. On android is very obvious that the keyboard shows for a little bit and disappears
Here's a simple codesanbox showing the issue:
https://codesandbox.io/s/silly-ritchie-o0w88?file=/src/index.js
The issue doesn't appear in the browser's responsive mode, only in the actual devices.
One thing that I noticed is that If I remove the 'shepherd-element' element from the dom it works fine. Not sure if this indicates something relevant
Thanks
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the CodeSandbox reproduction at src/index.js and run it on physical Android and iOS devices, comparing behavior with and without the shepherd-element. Confirm the focus loss and keyboard dismissal, then isolate the change needed so the targeted input stays focused while the tour element remains present.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend, mobile-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100