Non-JVM targets broken with latest CMP 1.8.0-alpha01

[TheKeeperOfPie]

Describe the bug

On the latest CMP 1.8.0-alpha01, Coil in a wasmJs target is broken. The error is nebulous and I'm not really sure what's broken. It's highly likely this is just the alpha being an incomplete implementation, but wanted to file in case it actually is a Coil issue.

1.7.3

[Violation] 'requestAnimationFrame' handler took 52ms
composeApp.uninstantiated.mjs:128 🚨 Failed - NullRequestData
composeApp.uninstantiated.mjs:128 NullRequestDataException: The request's data is null.
    at kotlin.captureStackTrace (webpack-internal:///./kotlin/composeApp.uninstantiated.mjs:20:44)
    at <KotlinProject:composeApp>.kotlin.captureStackTrace__externalAdapter (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[11582]:0x28937f)
    at <KotlinProject:composeApp>.kotlin.Throwable.<init> (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[11572]:0x2891d6)
    at <KotlinProject:composeApp>.kotlin.Throwable.<init> (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[11573]:0x28920f)
    at <KotlinProject:composeApp>.kotlin.Exception.<init> (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[11942]:0x28d699)
    at <KotlinProject:composeApp>.kotlin.RuntimeException.<init> (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[11932]:0x28d4bb)
    at <KotlinProject:composeApp>.coil3.request.NullRequestDataException.<init> (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[19919]:0x352a8c)
    at <KotlinProject:composeApp>.coil3.$executeCOROUTINE$1.doResume (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[19102]:0x3415ee)
    at <KotlinProject:composeApp>.coil3.RealImageLoader.execute (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[19115]:0x341dce)
    at <KotlinProject:composeApp>.coil3.$executeCOROUTINE$0.doResume (http://localhost:8080/2a426ea507bff4d77b00.wasm:wasm-function[19100]:0x3412c9)

(with no error and a red box displayed)

1.8.0-alpha01

[Violation] 'requestAnimationFrame' handler took 89ms
composeApp.uninstantiated.mjs:128 🚨 Failed - NullRequestData
composeApp.uninstantiated.mjs:128 NullRequestDataException: The request's data is null.
    at kotlin.captureStackTrace (webpack-internal:///./kotlin/composeApp.uninstantiated.mjs:20:44)
    at <KotlinProject:composeApp>.kotlin.captureStackTrace__externalAdapter (http://localhost:8080/9d2d9c8….wasm:wasm-function[11617]:0x29b82c)
    at <KotlinProject:composeApp>.kotlin.Throwable.<init> (http://localhost:8080/9d2d9c8….wasm:wasm-function[11607]:0x29b683)
    at <KotlinProject:composeApp>.kotlin.Throwable.<init> (http://localhost:8080/9d2d9c8….wasm:wasm-function[11608]:0x29b6bc)
    at <KotlinProject:composeApp>.kotlin.Exception.<init> (http://localhost:8080/9d2d9c8….wasm:wasm-function[11980]:0x29fbb9)
    at <KotlinProject:composeApp>.kotlin.RuntimeException.<init> (http://localhost:8080/9d2d9c8….wasm:wasm-function[11970]:0x29f9db)
    at <KotlinProject:composeApp>.coil3.request.NullRequestDataException.<init> (http://localhost:8080/9d2d9c8….wasm:wasm-function[19957]:0x364fcc)
    at <KotlinProject:composeApp>.coil3.$executeCOROUTINE$1.doResume (http://localhost:8080/9d2d9c8….wasm:wasm-function[19140]:0x353b2e)
    at <KotlinProject:composeApp>.coil3.RealImageLoader.execute (http://localhost:8080/9d2d9c8….wasm:wasm-function[19153]:0x35430e)
    at <KotlinProject:composeApp>.coil3.$executeCOROUTINE$0.doResume (http://localhost:8080/9d2d9c8….wasm:wasm-function[19138]:0x353809)
9d2d9c8….wasm:0x5a6d3b Uncaught 
Exception {}
$androidx.compose.ui.scene.BaseComposeScene.render	@	9d2d9c8….wasm:0x5a6d3b
$androidx.compose.ui.window.<no name provided>.onRender	@	9d2d9c8….wasm:0x5b3f2e
$org.jetbrains.skiko.<no name provided>.drawFrame	@	9d2d9c8….wasm:0x34c55c
$org.jetbrains.skiko.CanvasRenderer$needRedraw$lambda.invoke	@	9d2d9c8….wasm:0x34bee2
$org.jetbrains.skiko.CanvasRenderer$needRedraw$lambda.invoke	@	9d2d9c8….wasm:0x34bf3a
$org.jetbrains.skiko.w3c.__callFunction_((Double)->Unit)	@	9d2d9c8….wasm:0x34c84d
eval	@	composeApp.uninstantiated.mjs:214
requestAnimationFrame		
org.jetbrains.skiko.w3c.requestAnimationFrame_$external_fun	@	composeApp.uninstantiated.mjs:213
$org.jetbrains.skiko.w3c.requestAnimationFrame_$external_fun__externalAdapter	@	9d2d9c8….wasm:0x34c813
$org.jetbrains.skiko.CanvasRenderer.needRedraw	@	9d2d9c8….wasm:0x34c188
$org.jetbrains.skiko.SkiaLayer.needRedraw	@	9d2d9c8….wasm:0x34c64d
$androidx.compose.ui.window.SkiaLayer$needRedraw$ref.invoke	@	9d2d9c8….wasm:0x5b3f72
$androidx.compose.ui.window.SkiaLayer$needRedraw$ref.invoke	@	9d2d9c8….wasm:0x5b3f7c
$androidx.compose.ui.scene.BaseComposeScene.updateInvalidations	@	9d2d9c8….wasm:0x5a666c
$androidx.compose.ui.scene.BaseComposeScene$updateInvalidations$ref.invoke	@	9d2d9c8….wasm:0x5a5f9d
$androidx.compose.ui.scene.BaseComposeScene$updateInvalidations$ref.invoke	@	9d2d9c8….wasm:0x5a5fa7
$androidx.compose.runtime.BroadcastFrameClock$withFrameNanos$lambda.invoke	@	9d2d9c8….wasm:0x40438b
$androidx.compose.runtime.BroadcastFrameClock$withFrameNanos$lambda.invoke	@	9d2d9c8….wasm:0x404400
$androidx.compose.runtime.$withFrameNanosCOROUTINE$0.doResume	@	9d2d9c8….wasm:0x40450e
$androidx.compose.runtime.BroadcastFrameClock.withFrameNanos	@	9d2d9c8….wasm:0x4047ec
$androidx.compose.runtime.Recomposer$runRecomposeAndApplyChanges$slambda.doResume	@	9d2d9c8….wasm:0x424513
$kotlin.coroutines.CoroutineImpl.resumeWith	@	9d2d9c8….wasm:0x2a0981
$kotlinx.coroutines.DispatchedTask.run	@	9d2d9c8….wasm:0x2d2f9e
$androidx.compose.ui.platform.FlushCoroutineDispatcher$dispatch$slambda$lambda.invoke	@	9d2d9c8….wasm:0x59f273
$androidx.compose.ui.platform.FlushCoroutineDispatcher$dispatch$slambda$lambda.invoke	@	9d2d9c8….wasm:0x59f27e
$androidx.compose.ui.platform.FlushCoroutineDispatcher.performRun	@	9d2d9c8….wasm:0x59fe1d
$androidx.compose.ui.platform.FlushCoroutineDispatcher$dispatch$slambda.doResume	@	9d2d9c8….wasm:0x59f4a3
$androidx.compose.ui.platform.FlushCoroutineDispatcher$dispatch$slambda.invoke	@	9d2d9c8….wasm:0x59f3f3
$androidx.compose.ui.platform.FlushCoroutineDispatcher$dispatch$slambda.invoke	@	9d2d9c8….wasm:0x59f43d
$kotlin.coroutines.intrinsics.<no name provided>.doResume	@	9d2d9c8….wasm:0x2a0f64
$kotlin.coroutines.CoroutineImpl.resumeWith	@	9d2d9c8….wasm:0x2a0981
$kotlinx.coroutines.DispatchedTask.run	@	9d2d9c8….wasm:0x2d2f9e
$kotlinx.coroutines.MessageQueue.process	@	9d2d9c8….wasm:0x2dc05e
$kotlinx.coroutines.WindowMessageQueue$process$ref.invoke	@	9d2d9c8….wasm:0x2dd300
$kotlinx.coroutines.WindowMessageQueue$process$ref.invoke	@	9d2d9c8….wasm:0x2dd309
$kotlin.js.__callFunction_(()->Unit)	@	9d2d9c8….wasm:0x29c0e9
eval	@	composeApp.uninstantiated.mjs:125
Promise.then		
eval	@	composeApp.uninstantiated.mjs:187
kotlinx.coroutines.__callJsClosure_(()->Unit)	@	composeApp.uninstantiated.mjs:188
$kotlinx.coroutines.__JsClosureToKotlinClosure_(()->Unit).invoke	@	9d2d9c8….wasm:0x2dd4ec
$kotlinx.coroutines.__JsClosureToKotlinClosure_(()->Unit).invoke	@	9d2d9c8….wasm:0x2dd4f4
$kotlinx.coroutines.WindowMessageQueue.schedule	@	9d2d9c8….wasm:0x2dd423
$kotlinx.coroutines.MessageQueue.enqueue	@	9d2d9c8….wasm:0x2dbfc7
$kotlinx.coroutines.WindowDispatcher.dispatch	@	9d2d9c8….wasm:0x2db64a
$kotlinx.coroutines.JsMainDispatcher.dispatch	@	9d2d9c8….wasm:0x2dc58f
$kotlinx.coroutines.dispatch	@	9d2d9c8….wasm:0x2d319d
$kotlinx.coroutines.CancellableContinuationImpl.dispatchResume	@	9d2d9c8….wasm:0x2b02e3
$kotlinx.coroutines.CancellableContinuationImpl.completeResume	@	9d2d9c8….wasm:0x2b0728
$kotlinx.coroutines.channels.tryResume0	@	9d2d9c8….wasm:0x2c5c06
$kotlinx.coroutines.channels.BufferedChannelIterator.tryResumeHasNext	@	9d2d9c8….wasm:0x2bacfd
$kotlinx.coroutines.channels.BufferedChannel.tryResumeReceiver	@	9d2d9c8….wasm:0x2c00bf
$kotlinx.coroutines.channels.BufferedChannel.updateCellSend	@	9d2d9c8….wasm:0x2bfd94
$kotlinx.coroutines.channels.BufferedChannel.trySend	@	9d2d9c8….wasm:0x2bf0b0
$androidx.compose.ui.platform.GlobalSnapshotManager$ensureStarted$lambda.invoke	@	9d2d9c8….wasm:0x5a0476
$androidx.compose.ui.platform.GlobalSnapshotManager$ensureStarted$lambda.invoke	@	9d2d9c8….wasm:0x5a0488
$androidx.compose.runtime.snapshots.notifyWrite	@	9d2d9c8….wasm:0x467bb9
$androidx.compose.runtime.SnapshotMutableStateImpl.<set-value>	@	9d2d9c8….wasm:0x43a7f2
$androidx.compose.animation.core.AnimationScope.<set-value>	@	9d2d9c8….wasm:0x5ba626
$androidx.compose.animation.core.doAnimationFrame	@	9d2d9c8….wasm:0x5c1cf4
$androidx.compose.animation.core.doAnimationFrameWithScale	@	9d2d9c8….wasm:0x5c1cc2
$androidx.compose.animation.core.animate$lambda.invoke	@	9d2d9c8….wasm:0x5c2109
$androidx.compose.animation.core.animate$lambda.invoke	@	9d2d9c8….wasm:0x5c2137
$androidx.compose.animation.core.callWithFrameNanos$lambda.invoke	@	9d2d9c8….wasm:0x5c21d1
$androidx.compose.animation.core.callWithFrameNanos$lambda.invoke	@	9d2d9c8….wasm:0x5c21fe
$androidx.compose.runtime.FrameAwaiter.resume	@	9d2d9c8….wasm:0x4040ce
$androidx.compose.runtime.BroadcastFrameClock.sendFrame	@	9d2d9c8….wasm:0x404780
$androidx.compose.runtime.Recomposer$runRecomposeAndApplyChanges$slambda$lambda.invoke	@	9d2d9c8….wasm:0x420c6b
$androidx.compose.runtime.Recomposer$runRecomposeAndApplyChanges$slambda$lambda.invoke	@	9d2d9c8….wasm:0x421da1
$androidx.compose.runtime.FrameAwaiter.resume	@	9d2d9c8….wasm:0x4040ce
$androidx.compose.runtime.BroadcastFrameClock.sendFrame	@	9d2d9c8….wasm:0x404780
$androidx.compose.ui.scene.BaseComposeScene.render	@	9d2d9c8….wasm:0x5a6c8c
$androidx.compose.ui.window.<no name provided>.onRender	@	9d2d9c8….wasm:0x5b3f2e
$org.jetbrains.skiko.<no name provided>.drawFrame	@	9d2d9c8….wasm:0x34c55c
$org.jetbrains.skiko.CanvasRenderer$needRedraw$lambda.invoke	@	9d2d9c8….wasm:0x34bee2
$org.jetbrains.skiko.CanvasRenderer$needRedraw$lambda.invoke	@	9d2d9c8….wasm:0x34bf3a
$org.jetbrains.skiko.w3c.__callFunction_((Double)->Unit)	@	9d2d9c8….wasm:0x34c84d
eval	@	composeApp.uninstantiated.mjs:214
requestAnimationFrame	

To Reproduce
Using the demo from https://kotlinlang.org/docs/wasm-get-started.html, change the CMP version to 1.8.0-alpha01 , add implementation("io.coil-kt.coil3:coil-compose:3.0.4"), and add this to App.kt:

AsyncImage(
    model = null,
    contentDescription = null,
    modifier = Modifier.size(200.dp)
        .background(Color.Red)
)

Version
Coil: 3.0.4
Chrome: Version 133.0.6938.0 (Official Build) canary (64-bit)

[colinrtwhite]

Is this present in the latest snapshot? I wonder if it's related to 3.0.4 being built with Kotlin 2.0.21 instead of 2.1.0.

[TheKeeperOfPie]

Unfortunately it still happens with the snapshot. I also ended up trying with CMP 1.8.0+dev1992 and still no dice.

I added -Xwasm-use-new-exception-proposal to see if I could get a better error message and now I'm seeing

$kotlin.wasm.internal.throwLinkageError	@	85a53e7….wasm:0x280c66
$coil3.compose.Content$lambda.invoke	@	85a53e7….wasm:0x6288ea
$coil3.compose.Content$lambda.invoke	@	85a53e7….wasm:0x62898f
$coil3.compose.sam$androidx_compose_ui_layout_MeasurePolicy$0.measure	@	85a53e7….wasm:0x628587
$androidx.compose.ui.node.InnerNodeCoordinator.measure

Which points to

coil/coil-compose-core/src/commonMain/kotlin/coil3/compose/AsyncImage.kt

Line 187 in 8e8820c

private fun Content(

There might be a method call in there that is broken on wasmJs. I think I can narrow it down, although not sure when I'll get to it.

[TheKeeperOfPie]

Actually, this is really bizarre. If I copy in a minimal working version of the demo app into the coil project, and point it to projects.coilCompose, it works and renders the red box correctly on CMP 1.8.0-alpha01.

But if I point to 3.1.0-SNAPSHOT, it's broken. I can't explain what would differ between those. Maybe the release process didn't compile the wasmJs variant of the library correctly?

I have a commit here with what I'm using to test. Linking to the dependency line that can be uncommented to test: main...TheKeeperOfPie:coil:main#diff-1c254051ac7f6b44bc168eec7bb31439bdc0593a0581463451988a906ec3af87R28

[TheKeeperOfPie]

Actually this would make sense if something in 1.8.0-alpha01 broke binary compatibility or an experimental API or something. Since including the project locally would compile it against 1.8.0-alpha01.

So likely this is a CMP issue. I'll come back to this once CMP ships another alpha or Coil updates to 1.8.0.

[colinrtwhite]

Looks like this is due to binary incompatibility introduced in Compose 1.8.0 that only affects non-JVM platforms. I believe this is the ticket to watch for the fix. This comment indicates it should be fixed by 1.8.0-beta01, though I'm not sure if Google's also confirmed that.

In the meantime to unblock users from using the CMP 1.8.0 alphas I'm going to update Coil's snapshots to compile with 1.8.0-alpha02. To use the latest snapshot add this repo to your repositories:

allprojects {
    repositories {
        maven("https://oss.sonatype.org/content/repositories/snapshots")
    }
}

and update your Coil version to 3.1.0-SNAPSHOT:

implementation("io.coil-kt.coil3:coil-compose:3.1.0-SNAPSHOT")

[TheKeeperOfPie]

The CMP 1.8.0-alpha02 version was reverted in 009abba#diff-697f70cdd88ba88fe77eebda60c7e143f6ad1286bca75017421e93ad84fb87dfL8, although the commit message says "Give up on Compose multiplatform test", so maybe this was intended. Just wanted to mention it in case anyone else is using the snapshot.

[colinrtwhite]

@TheKeeperOfPie Sorry that was a mistake - main is now using 1.8.0-alpha02 again (#2825).

[MatkovIvan]

This breaking change was reverted in AOSP, and included to 1.8.0-alpha03

[colinrtwhite]

Sounds good, I'm going to revert Coil's main branch to use 1.7.3. This issue should be resolved by Compose 1.8.0-alpha03 now that the Compose change is reverted, but please let me know if you still run into issues with the alphas.