Expo app chrash

[orefors]

I'm not sure if this is a bug or a config issue,
Only happens with large images using react-native-image-marker v1.2.5 on android with expo sdk 50 (react-native v73) , but works fine on react-native-image-marker 1.1.1 on expo sdk 49. In earlier versions you could set the maxSize option to work around similar errors but versions below 1.2 of react-native-image-marker cause failed builds, so not an option for me.

Any ideas?

Thanks!

---

Your app just crashed. See the error below.
com.bumptech.glide.load.engine.CallbackException: Unexpected exception thrown by non-Glide code
com.bumptech.glide.load.engine.EngineJob.callCallbackOnResourceReady(EngineJob.java:161)
com.bumptech.glide.load.engine.EngineJob$CallResourceReady.run(EngineJob.java:428)
android.os.Handler.handleCallback(Handler.java:958)
android.os.Handler.dispatchMessage(Handler.java:99)
android.os.Looper.loopOnce(Looper.java:230)
android.os.Looper.loop(Looper.java:319)
android.app.ActivityThread.main(ActivityThread.java:8893)
java.lang.reflect.Method.invoke(Native Method)
com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:608)
com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1103)
Caused by java.lang.IllegalArgumentException: Invalid crop options have been passed. Please make sure the requested crop rectangle is inside source image.
expo.modules.imagemanipulator.actions.CropAction.run(CropAction.kt:8)
expo.modules.imagemanipulator.ImageManipulatorModule.runActions(ImageManipulatorModule.kt:44)
expo.modules.imagemanipulator.ImageManipulatorModule.access$runActions(ImageManipulatorModule.kt:19)
expo.modules.imagemanipulator.ImageManipulatorModule$definition$1$1$1.onSuccess(ImageManipulatorModule.kt:32)
expo.modules.imageloader.ImageLoaderModule$loadImageForManipulationFromURL$2.onResourceReady(ImageLoaderModule.kt:84)
expo.modules.imageloader.ImageLoaderModule$loadImageForManipulationFromURL$2.onResourceReady(ImageLoaderModule.kt:82)
com.bumptech.glide.request.SingleRequest.onResourceReady(SingleRequest.java:667)
com.bumptech.glide.request.SingleRequest.onResourceReady(SingleRequest.java:596)
com.bumptech.glide.load.engine.EngineJob.callCallbackOnResourceReady(EngineJob.java:159)
com.bumptech.glide.load.engine.EngineJob$CallResourceReady.run(EngineJob.java:428)
android.os.Handler.handleCallback(Handler.java:958)
android.os.Handler.dispatchMessage(Handler.java:99)
android.os.Looper.loopOnce(Looper.java:230)
android.os.Looper.loop(Looper.java:319)
android.app.ActivityThread.main(ActivityThread.java:8893)
java.lang.reflect.Method.invoke(Native Method)
com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:608)
com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1103)

[JimmyDaddy]

Hello, 1.2.x use coil to load image instead of fresco which used by all the versions before 1.2.x. Coil doesn't support maxSize. Can you tell me the minimum size of an image that would crash the app? I'll see where the problem lies.

[orefors]

Not sure about the exact size when it starts playing up, but it appears to work with a file size of 200kb but not with a file size of 480. So somewhere between 200kb and 480kb. I have use cases with 5mb+ file sizes (which has not been a problem in the past).

Thank you!

[JimmyDaddy]

Hi @orefors , I have tested in the example project, the background image size is 3.5MB but it works fine, can you provide me a MRE or a sample code that can reproduce the problem?

[orefors]

Hey, it must be something to do with my setup. I will have a look and get back to you. Thank you.

[orefors]

Hi @JimmyDaddy , I've done some digging and it definitely has something to do with my own setup not being compatible.
The code below returns the expected url string when called in my project, but when getting file info or trying to manipulate the file it points to, the file does not exist. I have no idea why, perhaps some permissions issue.
For now, the most convenient workaround for me is to roll back to sdk 49 and add it on my TODO list. Thanks for looking into it.

import Marker, { Position, ImageFormat } from "react-native-image-marker"

const bgImage = require('../assets/images/background.jpg');
const wmImage = require('../assets/images/watermark.png');

export const imageWithMark = async () => {
    return await Marker.markImage({
        backgroundImage: {
            src: bgImage,
        },
        watermarkImages: [{
            src: wmImage,
            position: {
                position: Position.topLeft,
            },
        }],
       saveFormat: ImageFormat.jpg
    })
};

[JimmyDaddy]

I have tested Expo.ImageManipulator.manipulateAsync after Marker.markImage in the expo-example, which uses expo SDK 50, and it works fine. Could you provide me a complete sample code that demonstrates the entire process of manipulating an image in your project?

You can try the expo-example with the following steps：

## clone the repo
git clone git@github.com:JimmyDaddy/react-native-image-marker.git

## install deps
yarn

## run ios
yarn expo-example ios

## android
yarn expo-example android

[orefors]

Hi @JimmyDaddy . I have installed the expo-example project locally and it seems to work as expected. Will investigate more on the week-end. Thanks again.

[orefors]

Hi @JimmyDaddy . I have done some more digging. The background image gets scaled down to fit within 2154 pixels (although seems dependent on screen resolution) when the maximum of width/height goes beyond a trigger point (I'm not sure exactly where that is, around 3000 pixels it appears). In my case, what's causing the error above is that I try to manipulate the returned image using the original dimensions. Is the scaling expected behavior or a bug?
I've created a MRE here: https://github.com/orefors/image-marker-example.git

Thanks for your help.

[JimmyDaddy]

@orefors there is a temporary solution for this problem. I'll fix this later

[JimmyDaddy]

@orefors 1.2.6 is available