A gif image can't be added to the post on iOS

[irfano]

Describe the bug
When a gif image from the device is added to the post on iOS, the post can't be updated, and it always shows an error message that states the upload is in progress.

To Reproduce
Steps to reproduce the behavior:

1. Launch the WP/JP app on an iOS device.
2. Log in.
3. Edit your post or create a new one.
4. Add an Image block.
5. Tap on the block and select "Choose from the device"
6. Select a GIF image.
7. Update the post.
8. Notice that you see an error message even if the GIF image is already uploaded.

Expected behavior
After a GIF image from the device is added to a post on iOS, the post should be able to be updated.

Screenshots

RPReplay_Final1699540356.MP4

Smartphone (please complete the following information):

• Device: iPad mini 6th gen
• OS: iPadOS 17.1
• Version 23.6

[tiagomar]

Couldn't reproduce it on

• iPhone 13, iOS 16.6.1
• iPad, iPadOS 17.0

[twstokes]

I was able to reproduce with:

• iPhone 15 in Simulator running iOS 17
• Built using Xcode 15
• Built from this WPiOS commit (currently trunk)

I can also confirm that uploading media in the WPiOS app via the "Media" view (outside the editor), there were no issues.

[derekblank]

I was able to reproduce on an iPhone SE running iOS 16.6.1, but with a slightly different experience:

1. Upload gif and hit "Publish"
2. Returns to Posts screen and the post hangs indefinitely in drafts with the upload progress bar around ~95%

I did not see the "Uploading Media" dialog like in the video above, but it is present in the draft post:

[derekblank]

Replicated the same behavior above when debugging locally. The error output so far:

2023-11-10 10:20:18:533 WordPress[98177:18989117] Could not find image file:///Users/derekblank/Library/Developer/CoreSimulator/Devices/3F6F476A-9B9B-4577-A96F-146E73030824/data/Containers/Data/Application/715E9599-AF41-4469-BF48-85041FBE4617/tmp/-466378314.png
2023-11-10 10:20:18:584 WordPress[98177:18970961] Unable to download image for attachment with url = Optional(http://localhost:8081/symbolicate). Details: Optional("The operation couldn’t be completed. (WordPress.ImageDownloaderError error 0.)")
2023-11-10 10:20:18:636 WordPress[98177:18970961] Unable to download image for attachment with url = Optional(https://i0.wp.com/localhost:8081/assets/gutenberg/node_modules/react-native/Libraries/LogBox/UI/LogBoxImages/close.png?platform=ios&hash=369745d4a4a6fa62fa0ed495f89aa964?quality=80&w=16). Details: Optional("The operation couldn’t be completed. (WordPress.ImageDownloaderError error 0.)")
2023-11-10 10:20:18:646 WordPress[98177:18992108] Failed to get size for image file:///Users/derekblank/Library/Developer/CoreSimulator/Devices/3F6F476A-9B9B-4577-A96F-146E73030824/data/Containers/Data/Application/715E9599-AF41-4469-BF48-85041FBE4617/tmp/-466378314
2023-11-10 10:20:18:652 WordPress[98177:18970961] Unable to download image for attachment with url = Optional(http://localhost:8081/symbolicate). Details: Optional("The operation couldn’t be completed. (WordPress.ImageDownloaderError error 0.)")

[derekblank]

Possibly related:

• Tenor GIF picker for Gutenberg editor WordPress-iOS#13910
• Images broken if previewing a Post without updating it first WordPress-iOS#13929

[derekblank]

Further investigation details:

• When adding the GIF on iOS, the file actually uploads successfully to the server, a valid URL is created, and the GIF appears in WordPress Media Library.
• When running locally, warnings are thrown from RNImage.getSize in the native Image component here: Failed to get size for image.
• When uploading a GIF, there are two image files created and returned from the server: the animated GIF, and a static image from the first frame.
• On Android, (where the GIF uploads successfully), the static image of the GIF is displayed in the Editor Image Block as a preview. Tapping on this static image displays the animated GIF. (Video example below.) On iOS, it's the opposite: the animated GIF is displayed in the Image Block, and tapping it displays the static file. On iOS It seems like the static and animated image URLs are inverted somehow.
• It's not possible to publish a post with a GIF on iOS. Even after removing an Image block that contained a GIF, it is still not possible to publish the post. There is likely something that is triggered in the state of the Image component that prevents this.

Android (working)	iOS (not working)
Screen_Recording_20231110_135827_Jetpack.mov	iOS.mov

[geriux]

I'm currently debugging but wanted to share that we recently changed quite a few things related to Media over WordPress iOS.

So far what I'm seeing is that for local GIFs, the progress value never reaches 1.0 when they're actually successfully uploaded. For GIFs uploaded from the free library, they do reach that value and are marked as uploaded correctly.

[kean]

RCA

• ItemProviderMediaExporter doesn't contribute progress to the overall uploads progress when it comes to GIFs

[kean]

I opened a PR with a fix wordpress-mobile/WordPress-iOS#22025