Interaction between Compose and Javascript

[JohannRosenberg]

I read in an article that Compose for Web does not support any Javascript interoperability. That of course would make Compose utterly useless. If this is true, can someone please explain how it's possible to make API calls to a backend when using Compose for Web, if no Javascript is supported.

[Schahen]

Hi @JohannBlake!

Compose for Web, being a Kotlin/JS project supports interoperability with JS exactly to that extent that Kotlin/JS does.
Literally anything from JS world can be called in Kotlin/JS code however how exactly it's done is out of scope of Compose for Web documentation.

However, my guess would be (based on the second part of your question) that you might be not interested in interoperability in general but on how to make async call to server via standard browser API.

This is just not the part of Compose for Web API which we intentionally trying to keep as small and basic as possible. For instance, in community we had some discussion on whether we should have routing out of the box but the thing is that routing can be implemented in different ways, depending on the goals one's trying to achieve and even on the personal taste. We just didn't wanted to force users to use any solution and waited till members of Compose community came up with solutions.

Pretty much the same story with async calls but, in a way - this story is actually a bit simpler - unlike routing it's subjectively less project-specific and complicated topic. We don't provided any tooling for this in Compose because a) how this should be implemented is an issue of user preferences and b) it's done pretty straightforward by means of "regular" Kotlin stdlib - you can check, for instance, following mini-tutorial - https://play.kotlinlang.org/hands-on/Building%20Web%20Applications%20with%20React%20and%20Kotlin%20JS/08_Using_an_External_REST_API.
Though this tutorial is about ReactJS integration it's pretty much illustrates the claim tha this level of application is usually not the one the reactive framework that takes care of:

suspend fun fetchVideo(id: Int): Video {
    val response = window
        .fetch("https://my-json-server.typicode.com/kotlin-hands-on/kotlinconf-json/videos/$id")
        .await()
        .text()
        .await()
    return Json.decodeFromString(response)
}

Oh, and by the way - can you leave a comment with link to the article - I'm very much interested in any articles about Compose.

[JohannRosenberg]

You wrote:

"you might be not interested in interoperability in general but on how to make async call to server via standard browser API."

Wrong. I already know how to do standard API calls. My post is entirely about interoperability between Compose and Javascript and how that is done. And your response being:

"how exactly it's done is out of scope of Compose for Web documentation"

I seriously suggest Jetbrains spend some time writing some documentation on exactly how that is done. Without it, Compose for Web is pretty useless and cannot be even considered a serious platform.