Got Error while FlutterImageCompress.compressWithList on web (not on Android or Ios) = Error: Expected a value of type 'Function', but got one of type 'Null'

[FabriceACohen]

Version

2.0.4

Platforms

Web

Device Model

Chrome

flutter info

[√] Flutter (Channel stable, 3.10.6, on Microsoft Windows [version 10.0.22621.1702], locale fr-FR)
    • Flutter version 3.10.6 on channel stable at C:\DEV\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision f468f3366c (5 weeks ago), 2023-07-12 15:19:05 -0700
    • Engine revision cdbeda788a
    • Dart version 3.0.6
    • DevTools version 2.23.1

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    • Android SDK at C:\Users\Fabrice\AppData\Local\Android\sdk
    • Platform android-33, build-tools 33.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.15+0-b2043.56-9505619)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop for Windows (Visual Studio Build Tools 2019 16.11.26)
    • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\BuildTools
    • Visual Studio Build Tools 2019 version 16.11.33529.622
    • Windows 10 SDK version 10.0.19041.0

[√] Android Studio (version 2022.1)
    • 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.15+0-b2043.56-9505619)

[√] VS Code (version 1.80.2)
    • VS Code at C:\Users\Fabrice\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.70.0

[√] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [version 10.0.22621.1702]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 111.0.5563.65
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 107.0.1418.42

[√] Network resources
    • All expected network resources are available.

How to reproduce?

Try to compress image on Web.

I let the Coversize print line in order to show that the object is not empty.

Logs

CoverSize = 15022

Error: Expected a value of type 'Function', but got one of type 'Null'
../dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 288:49      throw_
../dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 121:3       castError
../dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 529:12  cast
../dart-sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart 143:17                as
../dart-sdk/lib/_internal/js_shared/lib/js_util_patch.dart 77:5                      getProperty
../packages/flutter_image_compress_web/src/window.dart 16:25                         JSWindowExtension.get$35pica
../packages/flutter_image_compress_web/src/pica.dart 42:25                           resizeWithList
../dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 84:54                runBody
../dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 123:5                _async
../packages/flutter_image_compress_web/src/pica.dart 34:33                           resizeWithList
../packages/flutter_image_compress_web/flutter_image_compress_web.dart 83:12         compressWithList
../packages/flutter_image_compress/flutter_image_compress.dart 51:22                 compressWithList
../dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 84:54                runBody
../dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 123:5                _async
../packages/flutter_image_compress/flutter_image_compress.dart 40:55                 compressWithList
../packages/spotsyde/services/image_picker_service.dart 91:56                        uploadCover
../dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 45:50                <fn>
../dart-sdk/lib/async/zone.dart 1661:54                                              runUnary
../dart-sdk/lib/async/future_impl.dart 147:18                                        handleValue
../dart-sdk/lib/async/future_impl.dart 784:44                                        handleValueCallback
../dart-sdk/lib/async/future_impl.dart 813:13                                        _propagateToListeners
../dart-sdk/lib/async/future_impl.dart 584:5                                         [_completeWithValue]
../dart-sdk/lib/async/future_impl.dart 657:7                                         callback
../dart-sdk/lib/async/schedule_microtask.dart 40:11                                  _microtaskLoop
../dart-sdk/lib/async/schedule_microtask.dart 49:5                                   _startMicrotaskLoop
../dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 177:15               <fn>

Example code (optional)

Uint8List bufCrop = img.encodePng(crop);
print('CoverSize = ${bufCrop.length}');

var bufCropCompressed = await FlutterImageCompress.compressWithList(bufCrop, minWidth: 720, minHeight: 1280, quality: 80);

Contact

No response

[FabriceACohen]

Not yet.

[pasanediri97]

add

<script src="https://unpkg.com/pica/dist/pica.min.js" ></script>

to index.html and do a flutter clean

[Mihai-B]

You are correct @pasanediri97 . It even says in the documentation, dunno how I missed it but adding the required js file works

[donuthappy]

Hi, @FabriceACohen @Mihai-B So did you fix this issue?

[Mihai-B]

Hi @donuthappy . Yes, personali, I did fix it with the fix provided in the documentation. It is the same as @pasanediri97 suggested. Add that line in your index file.

[donuthappy]

Thanks @Mihai-B it works well.