react.dev icon indicating copy to clipboard operation
react.dev copied to clipboard

Published 20 hours ago • verified publisher icon reactjs

[Bug]: Search functionality not working correctly on react.dev in Safari on iOS real device (iPhone 12 Pro)

Open ramizackaryshamir opened this issue 1 year ago • 2 comments
trafficstars

Summary

The current behavior

Search functionality does not work correctly on iOS real device (iPhone 12 Pro).

https://github.com/reactjs/react.dev/assets/57572988/f50ff514-d84b-4e8c-b067-628eedd2d762

Since search functionality is currently working as expected on macOS, both in Chrome and Safari, the issue might be in implementation of Algolia InstantSearch iOS:

https://github.com/reactjs/react.dev/assets/57572988/44ddea01-cd10-4323-bcdb-aec1788da64d

The expected behavior

Search functionality is working as expected on macOS, both in Chrome and Safari. Should work similarly on iOS real device:

macOs Chrome

https://github.com/reactjs/react.dev/assets/57572988/41c9cd76-3ac8-4820-9917-52141d68c8ed

macOS Safari

https://github.com/reactjs/react.dev/assets/57572988/4daf9a68-2671-446c-a9c3-8a39bfefc8e5

Page

https://react.dev

Details

Steps To Reproduce

  1. Open react.dev in Safari on iPhone (real device)
  2. Tap search icon: note that search function is working as intended
  3. Scroll down to "Write components with code and markup" section
  4. Tap search icon: note that action doesn't open search
  5. Scroll down again and tap the search icon several times: note that action doesn't open search
  6. Repeat step 5: note that eventually screen freezes

The iOS real device that this behavior was recorded on is using the current iOS version:

react_github-bug-report_ios-version

ramizackaryshamir avatar Mar 12 '24 19:03 ramizackaryshamir

Hi @pwbriggs👋 I was wondering if I could open a pull request and begin work on this issue.

ramizackaryshamir avatar Mar 20 '24 13:03 ramizackaryshamir

Go ahead, @MeetYourCreator! Thanks in advance for the help!

pwbriggs avatar Mar 20 '24 13:03 pwbriggs

Hi @pwbriggs 👋 I'm about to open a PR for this bug-fix. Since it's my first time contributing, I just want to make sure I have the right protocol for opening a PR for this repo:

  1. fork repo
  2. clone forked repo to local machine
  3. git checkout -b my-branch-name
  4. when ready, git push my-fork-name my-branch-name

ramizackaryshamir avatar Apr 08 '24 14:04 ramizackaryshamir

Yes, that's correct. Commit the changes to the branch on your fork, then open your fork on GitHub. You should see a message something like this:

image

Hit the "Contribute" button to start a pull request. Include "Fixes #6693" in the description so GitHub will automatically link it to this issue.

Thanks again! ❤️

pwbriggs avatar Apr 08 '24 23:04 pwbriggs