Are there any resources covering interop with asyn...

# webassembly

[Darryl Miles]

Are there any resources covering interop with async/await/Promise/etc... and kotlinx-coroutine, focused on WasmJS target.
Is use of 1.8.0 a requirement, as it seems kotlinx-coroutine-core 1.7.x exists but kotlinx-coroutine-wasm-js first version is 1.8.0
Is there an example snippet on a github demonstrating inter-op, all kinds of scenarios where WASM and/or browser native JS manage async/await/Promise APIs as both consumer and producer.

Does the following Gradle config snippet look correct to get started? There is no api(kotlinx("coroutines-core-wasm-js:1.8.0")) so the GAV axis is long hand

kotlin {
  sourceSets {
    val wasmJsMain by getting {
      api("org.jetbrains.kotlinx:kotlinx-coroutines-core-wasm-js:1.8.0")
    }
  }
}

For example I see this project https://github.com/JuulLabs/indexeddb has existed sometime, for IndexedDB support, but it does not seem possible to consume it. This is back to the JAR having capability colouring.
The claim is my project has the colour "wasm" but the JAR has the colour "js", when I attempt to add the dependency.
The colouring attribute are termed "org.jetbrains.kotlin.platform.type"

If there such a thing as the following config snippet ? (if so, where is the example project of this?) :

kotlin {
  js {
    binaries.executable()
    browser()
  }
  sourceSets {
    val jsMain by getting {
    }
  }
}

When I enable this section the "js" part, my "src/commonMain/kotlin/Common.kt" file now has compile errors, as some basic imports are not longer available "org.w3c.fetch.*" and "kotlinx.browser.document". This .kt file is not actively used by the previous project, it exists to probe into understanding what is possible and what APIs exist there.
When I enable this "js" section I see additional items/directory produced, but it fails as the directory "build/js/..." doe s not exist and some Node task fails, jsBrowserProductionWebpack.
So back to where might an example project be demonstrating this ? Why does it fail if I enable it but I have no source files to process, surely it should detect this and emit a no-op valid output that has no functionality.
It is not clear how the "js" section interoperates with the "wasmJs" section, within the same gradle project.

[Darryl Miles]

The following link https://kotlinlang.org/docs/js-project-setup.html is able to answer the "is there such a thing as kotlin { js { browser() } } by demonstrating what a configuration look like such as this.

However despite all the other information in the JavaScript section, it does not answer any of the other matters. A basic question, what does a project file tree look like of a project using all the features ? the documentation talks of paths in terms of build/something/here... which is a pretty useless place to start your journey as it assume you can get the project to build and create these files.

Looking at the rest of the documentation, it talks about a lot of other stuff but there is:
• No project walk though, layout info, or purpose or each subdir in project (it does talk of IDEA create project dialogs, but it is understanding we seek, not how to press the create project button lol)
• No detailed info concerning the Gradle plugin, this should include:
◦ High level overview of the phases of the workflow
◦ Detailed per task description, explaining the purpose of the task, each tasks inputs and outputs
◦ If a task is largely a wrapper to automate the delegation to a 3rd party process, links to relevant details of that 3rd party thing

[Robert Jaros]

Somehow you are mixing js and wasmJs targets. Those are different things. Kotlin/Wasm is currently experimental, so you will not find much documentation (things are changing fast).

[Darryl Miles]

Thanks for the reply.
So configuring both in the same gradle.build should be an automatic error then ?

I am happy with my current understanding of wasmJs, in that I can write in kotlin language using a brower API suite, that can emit a WASM blob, that can be imported as a webjar and just works. While experimental this is working for me in a way that is understandable and effective, the IDE support for Kotlin is so much better than using the same IDE for JavaScript to achieve the same thing, if we then add TypeScript into the mix the project would become difficult to maintain for the same level of complexity.

Accepting that js is a different thing, and by the sounds of it more stable. Where is the equivalent project like `kotlin-wasm-example`` but for the js target ?
This leads into questions concerning, if I have to write a js target project (seperately) how does the inter-op between them work, so is there a github sample project `kotlin-js-and-wasm-interop-examples`` ? Which can also demonstrate inter-op with other webpack components as the same time as 2 sibling projects using kotlin.

[Darryl Miles]

The other question is there such a thing as a Kotlin WASM target but with (more) JVM like features in the browser ? Does that target have a name ? I have already worked with C++ emitting WASM and working in the browser (more than a few years ago now). So there still seems a large gap between Kotlin JVM and Kotlin WASM in what I have seen do far

[Robert Jaros]

Yes, There are issues when you want to use js and wasmJs in the same project. I'm working on such project and I have to struggle with a lot of different problems. Most of them I've reported to YT (e.g. https://youtrack.jetbrains.com/issue/KT-64214, https://youtrack.jetbrains.com/issue/KT-62398). You can check my code, if you want to find examples of wasm/js interop - https://github.com/rjaros/kilua/

[Darryl Miles]

Thanks for the links, and feedback to know that I should make 2 different gradle projects one for each target to keep away from issues.

The framework you are building headlines as having common parts to facilitate that interop, but a browse around shows a lot of stuff that doesn't seem so much like a "framework" more like providing type definitions to get access to existing APIs, or providing access to a limited selection of 3rd party components, inside of the new API paradigm it provides.

I think the interop I am looking for is much more basic and fundimental "interface definition language" style.
Maybe my best approach on IndexedDB is to stop looking to consume another project and simply rewrite it again for WASM and delete the js {} gradle section if the IR doesn't work to provide free interop in that way. The active part of the project is ~700 lines an is largely interface definitions and what maybe described as Kotlin extention functions. Its taken more time to research (and still nothing to show for it) than just rewrite lol