Some webp fails to load, throws `multi_frame_codec.cc(112)] Could not getPixels for frame 2`

[wasabia]

this webp image is ok preview on chrome

[ +320 ms] E/flutter (31817): [ERROR:flutter/lib/ui/painting/multi_frame_codec.cc(112)] Could not getPixels for frame 2
[ +113 ms]
                    ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════
                    The following _Exception was thrown resolving an image frame:
                    Exception: Codec failed to produce an image, possibly due to invalid image data.

                    When the exception was thrown, this was the stack:
                    ...

                    Image provider: AssetImage(bundle: null, name: "assets/test.webp")
                    Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#8e3b4(), name: "assets/test.webp", scale:
                      1.0)
                    ════════════════════════════════════════════════════════════════════════════════════════════════════

test.webp.zip

[asashour]

I am able to reproduce on desktop. It works fine with web, using master.

flutter doctor -v

``` [√] Flutter (Channel master, 2.4.0-1.0.pre.77, on Microsoft Windows [Version 10.0.19042.1052], locale en-US) • Flutter version 2.4.0-1.0.pre.77 at C:\use\flutter\flutter • Upstream repository https://github.com/flutter/flutter.git • Framework revision a28a12ae7d (25 minutes ago), 2021-07-05 04:01:03 -0400 • Engine revision e2d1cf3273 • Dart version 2.14.0 (build 2.14.0-276.0.dev) [√] Android toolchain - develop for Android devices (Android SDK version 30.0.3) • Android SDK at C:\Users\ahmed_ashour\AppData\Local\Android\Sdk • Platform android-30, build-tools 30.0.3 • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6842174) • All Android licenses accepted. [√] Chrome - develop for the web • Chrome at C:\Program Files (x86)\Google\Chrome\Application\chrome.exe [√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.10.2) • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community • Visual Studio Community 2019 version 16.10.31410.357 • Windows 10 SDK version 10.0.19041.0 [√] Android Studio (version 4.2.0) • Android Studio at C:\Program Files\Android\Android Studio • Flutter plugin can be installed from: https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6842174) [√] IntelliJ IDEA Community Edition (version 2021.1) • IntelliJ at C:\Program Files\JetBrains\IntelliJ IDEA Community Edition 2021.1.1 • Flutter plugin can be installed from: https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: https://plugins.jetbrains.com/plugin/6351-dart [√] IntelliJ IDEA Ultimate Edition (version 2021.2) • IntelliJ at C:\Program Files\JetBrains\IntelliJ IDEA 212.4037.9 • Flutter plugin can be installed from: https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: https://plugins.jetbrains.com/plugin/6351-dart [√] VS Code (version 1.57.1) • VS Code at C:\Users\ahmed_ashour\AppData\Local\Programs\Microsoft VS Code • Flutter extension can be installed from: https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter [√] Connected device (2 available) • Windows (desktop) • windows • windows-x64 • Microsoft Windows [Version 10.0.19042.1052] • Chrome (web) • chrome • web-javascript • Google Chrome 91.0.4472.124 • No issues found!

[TahaTesser]

Hi @wasabia Thanks for filing the issue, I can reproduce the issue only on the desktop on Windows, Linux, and macOS. While it loads on the web.

Used the following minimal code sample

minimal code sample

```dart import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Material App', theme: ThemeData.dark(), home: Home(), ); } } class Home extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Material App Bar'), ), body: Center( child: Image.asset('assets/test.webp'), ), floatingActionButton: FloatingActionButton( child: Icon(Icons.add), onPressed: () {}, ), ); } } ```

logs

```console tahatesser@Tahas-MacBook-Pro master_flutter % fm run -d macos --local-engine-src-path /Users/tahatesser/Code/engine/src --local-engine=host_debug_unopt Launching lib/main.dart on macOS in debug mode... Building macOS application... Syncing files to device macOS... 74ms Flutter run key commands. r Hot reload. 🔥🔥🔥 R Hot restart. h List all available interactive commands. d Detach (terminate "flutter run" but leave application running). c Clear the screen q Quit (terminate the application on the device). 💪 Running with sound null safety 💪 An Observatory debugger and profiler on macOS is available at: http://127.0.0.1:54158/sNw8c-3GunY=/ [ERROR:flutter/lib/ui/painting/multi_frame_codec.cc(116)] Could not getPixels for frame 2 ══╡ EXCEPTION CAUGHT BY IMAGE RESOURCE SERVICE ╞════════════════════════════════════════════════════ The following _Exception was thrown resolving an image frame: Exception: Codec failed to produce an image, possibly due to invalid image data. When the exception was thrown, this was the stack Image provider: AssetImage(bundle: null, name: "assets/test.webp") Image key: AssetBundleImageKey(bundle: PlatformAssetBundle#dbef9(), name: "assets/test.webp", scale: 1.0) ════════════════════════════════════════════════════════════════════════════════ ════════════════════ The Flutter DevTools debugger and profiler on macOS is available at: http://127.0.0.1:9102?uri=http://127.0.0.1:54158/sNw8c-3GunY=/ ```

stable	master
❌	❌

Check flutter doctor -v outputs for each channel below

flutter doctor -v

```console [✓] Flutter (Channel stable, 2.2.3, on macOS 12.0 21A5268h darwin-x64, locale en-GB) • Flutter version 2.2.3 at /Users/tahatesser/Code/flutter_stable • Framework revision f4abaa0735 (4 days ago), 2021-07-01 12:46:11 -0700 • Engine revision 241c87ad80 • Dart version 2.13.4 [✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3) • Android SDK at /Users/tahatesser/Code/SDK • Platform android-30, build-tools 30.0.3 • ANDROID_HOME = /Users/tahatesser/Code/SDK • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS • Xcode at /Applications/Xcode.app/Contents/Developer • Xcode 12.5.1, Build version 12E507 • CocoaPods version 1.10.1 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 4.2) • Android Studio at /Applications/Android Studio.app/Contents • Flutter plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264) [✓] VS Code (version 1.57.1) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.24.0 [✓] Connected device (3 available) • iPhone 12 Pro (mobile) • 77C62AB9-8B71-43CF-BCAB-85B0A5B52F85 • ios • com.apple.CoreSimulator.SimRuntime.iOS-14-5 (simulator) • macOS (desktop) • macos • darwin-x64 • macOS 12.0 21A5268h darwin-x64 • Chrome (web) • chrome • web-javascript • Google Chrome 91.0.4472.114 • No issues found! ``` ```console \[✓] Flutter (Channel master, 2.4.0-1.0.pre.78, on macOS 12.0 21A5268h darwin-x64, locale en-GB) • Flutter version 2.4.0-1.0.pre.78 at /Users/tahatesser/Code/flutter_master • Upstream repository https://github.com/flutter/flutter.git • Framework revision 761d568421 (2 hours ago), 2021-07-05 05:21:03 -0400 • Engine revision 37e3922ae8 • Dart version 2.14.0 (build 2.14.0-276.0.dev) [✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3) • Android SDK at /Users/tahatesser/Code/SDK • Platform android-30, build-tools 30.0.3 • ANDROID_HOME = /Users/tahatesser/Code/SDK • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS • Xcode at /Applications/Xcode.app/Contents/Developer • Xcode 12.5.1, Build version 12E507 • CocoaPods version 1.10.1 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 4.2) • Android Studio at /Applications/Android Studio.app/Contents • Flutter plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264) [✓] VS Code (version 1.57.1) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.24.0 [✓] Connected device (3 available) • iPhone 12 Pro (mobile) • 77C62AB9-8B71-43CF-BCAB-85B0A5B52F85 • ios • com.apple.CoreSimulator.SimRuntime.iOS-14-5 (simulator) • macOS (desktop) • macos • darwin-x64 • macOS 12.0 21A5268h darwin-x64 • Chrome (web) • chrome • web-javascript • Google Chrome 91.0.4472.114 • No issues found! ```

✅ : No Issue ❌: Issue reproduced

Investigation

When running the app, first frame is laoded and then the error is shown. Which fits the error message as it says Could not getPixels for frame 2

Source of the error message

[ivan-semkin]

also experiencing this issue on Flutter 3.0.5

[darshankawar]

Came across this issue while verifying https://github.com/flutter/flutter/issues/132645 and observed that the reported error in this issue also occurs on mobile platforms as verified here, so updating this issue and labels to reflect the same.

[darshankawar]

Adding team-framework to this issue since it is not specific to desktop, hence, removing team-desktop. /cc @goderbauer for thoughts if this need to be re-prioritised since team label has changed.

[flutter-triage-bot[bot]]

The triaged-desktop label is irrelevant if there is no team-desktop label or fyi-desktop label.

[Gi-lo]

Hey, adding some findings from our team:

• Lossy webps do NOT WORK.
• Lossless webps do WORK.

This might be related to either the used color model (YUV vs RGB) or the used compression (VP8 vs WebP Intern) which differ on lossy vs lossless webps.

We fixed the issue in our scenario by pre-processing the webps on our server before sending them out to our application.

[pavanpodila]

This is still a problem in Flutter 3.24.3 with WebP in iOS Simulator