Image .gif frame timing off-by-one error in iOS #44608
Labels
Component: Image
Issue: Author Provided Repro
This issue can be reproduced in Snack or an attached project.
Platform: iOS
iOS applications.
Resolution: Fixed
A PR that fixes this issue has been merged.
Description
When using the Image component to render a .gif file with non-uniform frame timings, the frame durations are shifted one frame on iOS.
On web and Android, the timings are correct, but iOS is incorrect.
A snack with this gif is provided:
![timing](https://private-user-images.githubusercontent.com/5315418/331875859-72b86f88-8258-4542-a298-b466396b5459.gif?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTg3NTE2MzgsIm5iZiI6MTcxODc1MTMzOCwicGF0aCI6Ii81MzE1NDE4LzMzMTg3NTg1OS03MmI4NmY4OC04MjU4LTQ1NDItYTI5OC1iNDY2Mzk2YjU0NTkuZ2lmP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDYxOCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA2MThUMjI1NTM4WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9MjU0NTA5MmFiNmM3ZTY2MTJiNTFiYmEzMmJhNDA5N2Q4Y2MzMGYzNjEwODkzNTBhZjMzYThiZDI5YjAyM2EwNiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.MMX5VaeQEM3SigUznHCrL8NebTlHGdHzI4Ppm-trGPE)
The content of the image is pretty self explanatory. It consists of 6 frames with different duration, as shown in the image:
On web and Android, the gif is shown as expected, however on iOS, this is perceived:
The issue shows both in the snack as on physical devices.
Steps to reproduce
Use an Image with a non-uniformly timed .gif. See snack for repro.
React Native Version
0.74.0
Affected Platforms
Runtime - iOS
Output of
npx react-native info
Stacktrace or Logs
Reproducer
https://snack.expo.dev/@joepb/gif-timing-error
Screenshots and Videos
Timing on Android: (correct)
![Gif timing android](https://private-user-images.githubusercontent.com/5315418/331876711-012c0a86-0f05-497f-82e1-9ddb3117a605.gif?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTg3NTE2MzgsIm5iZiI6MTcxODc1MTMzOCwicGF0aCI6Ii81MzE1NDE4LzMzMTg3NjcxMS0wMTJjMGE4Ni0wZjA1LTQ5N2YtODJlMS05ZGRiMzExN2E2MDUuZ2lmP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDYxOCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA2MThUMjI1NTM4WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YjdlNTlmNDBkNWMxY2NjYzlhMTQ5ZWY0MDMwZjc1YzNlOTM3OWM2NTA0OWMwYzJjMzdjNjNhNDgyNmIzMTZlMCZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.axLoUSmrFUM7-IqhtYK7fak-yWD_VLDGuC0GN7P_Nds)
Timing on iOS: (incorrect)
![Gif timing ios](https://private-user-images.githubusercontent.com/5315418/331876726-1d43b0fe-642b-4840-869e-bc4233730d68.gif?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTg3NTE2MzgsIm5iZiI6MTcxODc1MTMzOCwicGF0aCI6Ii81MzE1NDE4LzMzMTg3NjcyNi0xZDQzYjBmZS02NDJiLTQ4NDAtODY5ZS1iYzQyMzM3MzBkNjguZ2lmP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDYxOCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA2MThUMjI1NTM4WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YWUwZjJkNmRlY2Y2YmQwMjJlYWJjNjZmZDcwNjdjOGRjMTE5ZWU5Yjk5OGEzZmM5MDUxODAxN2Q3ZTZlZGUyMCZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.cr7dFxuhfrTX0t5r3kmkwq8Dv0L94cLBamErGnb27Nc)
The text was updated successfully, but these errors were encountered: