What is the recommanded what to turn Javascript callback based API like `EventSource` to a `Flow` th...

# coroutines

[sdeleuze]

What is the recommanded what to turn Javascript callback based API like EventSource to a Flow that emits the data received by the onmessage callback ?

[sdeleuze]

My original code is:

window.onload = {
		EventSource("/message/stream").onmessage = {
			val message = JSON.parse<Message>(it.data as String)
			val li = document.createElement("li").apply {
				innerHTML = "Message: ${message.content} from user ${message.user}"
			}
			document.getElementById("messages")!!.appendChild(li)
		}
		Unit // Ugly workaround for <https://youtrack.jetbrains.com/issue/KT-22635>
	}

[sdeleuze]

I would like to extract the EventSource("/message/stream").onmessage to something that provides a Flow<String>

[sdeleuze]

I will then use operators to turn it to Message and do whatever is needed with the DOM

[sdeleuze]

I tried:

fun EventSource.asFlow() = flow {
	onmessage = {
		emit(JSON.parse<Message>(it.data as String))
		Unit
	}
}

But it does not work since onmessage is not suspending

[Vsevolod Tolstopyatov [JB]]

Currently, the only way is to use `callbackFlow`/`channelFlow` (one is alias to another, the only difference is your intention): https://kotlin.github.io/kotlinx.coroutines/kotlinx-coroutines-core/kotlinx.coroutines.flow/channel-flow.html
https://kotlin.github.io/kotlinx.coroutines/kotlinx-coroutines-core/kotlinx.coroutines.flow/callback-flow.html

But you have to manage backpressure somehow: drop messages when channel.offer returns false, use conflated or unlimited channel

[Vsevolod Tolstopyatov [JB]]

In the future we will provide StateFlow/DataFlow that are similar to Rx subjects/Reactor processors

[sdeleuze]

Make sense, thanks for your feedback.

[sdeleuze]

It is maybe too early but providing extensions like EventSource.asFlow() out of the box would increase significantly Kotlin added value for frontend developement.

[Vsevolod Tolstopyatov [JB]]

https://github.com/Kotlin/kotlinx.coroutines/issues/1633

[sdeleuze]

Thanks, I will make a complete feedback after my Devoxx deepdive

[Vsevolod Tolstopyatov [JB]]

it would be very helpful

[sdeleuze]

I am pretty amazed by 2 things:
- The awesomeness of Coroutines 1.3 on frontend
- The lack of up to date documentation and samples given all the changes on Gradle + multiplatform + Kotlin JS

[sdeleuze]

So the potential is huge

[sdeleuze]

But at some point IMO you will need to pause the features and just make documentation up to date, provide samples and make multiplatform Gradle config more approachable.

[sdeleuze]

But great stuff, congrats to the team

[sdeleuze]

Another similatr question for single value callback, I saw https://stackoverflow.com/questions/48552925/existing-3-function-callback-to-kotlin-coroutines/48562175#48562175 but when I try to use it for window.onload I get compile time errors:

suspend fun Window.awaitLoad() = suspendCoroutine<Unit> { cont ->
	onload = {
		cont.resume(Unit)
	}
}

[sdeleuze]

I get Methods are absent in coroutines classes since 1.3

[sdeleuze]

Oh I used the wrong one

[sdeleuze]

It works with import kotlin.coroutines.suspendCoroutine