قالب وردپرس درنا توس
Home / IOS Development / ios – React PWA Image Upload in Mobile Safari break application?

ios – React PWA Image Upload in Mobile Safari break application?



We were surprised that we did not find any mention of this anywhere online, so we post here in hopes that we will find a solution.

Using an iPhone with mobile safari is when we encounter this problem and run the two easy-to-follow tests below, one works, one does not.

Here is the link
https://pwa-react.netlify.com/vud19659002??There are the two tests we run (both are listed in the link), one works when not in PWA mode and the other fails when in PWA mode.

Test # 1: Works perfectly (expected behavior)

  Visit https://pwa-react.netlify.com/ from iPhone in Mobile Safari
1. Make sure you have a google drive on your phone but not signed in.
2. Click "Select File". It will show you the list of options you can choose from.
3. Click "Browse" to look for the image.
4. Click "Cancel" and you're back.
5. Click "Select File", it will still show you the list of options you can choose from.
This works perfectly in mobile safari, but NOT in PWA mode below.

Test # 2: NOT Working (Unexpected Behavior) (PWA)

  Visit https://pwa-react.netlify.com/ from iPhone in Mobile Safari, touch the stock
button, and then add to the Home screen. This will add the PWA app to your phone. Open app.
1
. Make sure you have a google drive on your phone but not signed in. 2. Click "Select File". It will show you the list of options you can choose from. 3. Click "Browse" to look for the image. 4. When it displays the Google Drive logo with a login, double-click on the home button, then return to PWA. 5. Click "Select File", it will NOT show you the list of options you can choose from. This is now 100% destroyed. The only way to fix it is to go to Settings> Safari> Clear history and site data (right down) How can we fix this so that when the user hits "Select File", it displays the list of alternatives to choose from in PWA?

Screenshot # 1: These are the options that appear in Test # 1 and stop showing in Test # 2

 submit image description here

Screenshot # 2: This screen allows us to cancel Test # 1 but it disappears in Test # 2

 enter image description here

Any idea how we get Test # 2 to work by letting us select upload options as in Screenshot # 1 without breaking the app and having to go to safari settings to remove history and site data for it to work again?

PS – Here is the repository file https://github.com/MovingGifts/pwa-react/blob/ master / src / App.js


Source link