https://kotlinlang.org logo
Join Slack
Powered by
# webassembly
  • e
    In Kotlin 2.2.0 I'm seeing 
    kotlin-js-store/wasm/package-lock.json
    and 
    kotlin-js-store/package-lock.json
    but that change wasn't mentioned in the What's New. Just checking, but is that correct that there won't be a 
    js
    directory, only a 
    wasm
    directory?
    o
    c
    • 3
    • 2
  • s
    Is it possible to pass parameters to composeApp.js when loading it in the canvas? If so, how do you do that?
  • s
    I want to display different parts of the wasm bundle on different pages. It seems the most straighforward way is to pass parameters to the entry point in js and then parse the params in kotlin
  • j
    is there any way to remove 
    #
     from compose navigation? 
    base_url/#route_name
    to 
    base_url/route_name
    k
    • 2
    • 14
  • m
    How would I create a module definition jszip? it has a 
    namespace JSZip
    with 
    new(): this;
    and 
    (): JSZip
    but I can't figure out how to call it. I tried 
    external fun JSZip
    as well as 
    external class JSZip
    and both give errors.
    v
    t
    • 3
    • 7
  • a
  • c
    Super bummed, got the whole project ready for wasm support, finally fixed up all expect/actuals and errors. now seeing a IR error šŸ˜ž
    Copy code
    e: java.lang.IllegalStateException: Parent of element (VALUE_PARAMETER kind:Regular name:$composer index:0 type:androidx.compose.runtime.Composer? [assignable]) is not initialized.
Please assign it explicitly or use utility such as IrElement.patchDeclarationParents().
        at org.jetbrains.kotlin.ir.declarations.IrDeclarationBase.getParent(IrDeclarationBase.kt:22)
    I'll create a ticket, but can't share this project, dunno if anyone can help where the issue might be based on the error?
    o
    • 2
    • 8
  • p
    I am trying to call some audio rendering code in Kotlin from a WebAudio AudioWorkletProcessor in JavaScript. I tried this: https://kotlinlang.org/docs/wasm-js-interop.html#functions-with-the-jsexport-annotation
    Copy code
    //import exports from "./module.mjs"
import exports from "./composeApp.js"
console.log("Kotlin random code is " + exports.renderKotlinAudio());
    But I always get: SyntaxError: Unexpected identifier 'exports' I am using Kotlin/Compose multi-platform code. My Kotlin WASM code has:
    Copy code
    @OptIn(ExperimentalJsExport::class)
@JsExport
fun renderKotlinAudio(): Float {
    return Random.nextFloat()
}
    I spent a lot of time with Gemini giving me increasingly complex solutions that did not work. Has anyone actually done this successfully?
    t
    • 2
    • 1
  • c
    Chasm now supports producer modules in 
    0.1.1
    of its Gradle plugin. This is really exploratory work but ultimately the idea behind producer modules is to have an experience wherefore you write a module of code in Kotlin like you would any other, it has a well defined pure Kotlin interface which other modules can depend upon, but this module has the potential to be interpreted with all the benefits that come with that Iā€™ve updated the documentation, and added a producer module to the example project for you to see it in action. Do let me know what you think, any feedback is more than welcome āœŒļø
  • u
    Someone help me! I am trying to add WasmJS support to Tart, a Flux architecture library. I simply added 
    kotlin.wasmJs.browser()
    and 
    kotlin.wasmJs.nodejs()
    to the module. However, when I run the 
    ./gradlew wasmJsBrowserTest
    task for testing, I get the error: command 
    /home/runner/.gradle/nodejs/node-v22.0.0-linux-x64/bin/node' exited with errors (exit code: 1)
    (this occurs both in CI and locally). The ./gradlew jsBrowserTest task succeeds, so this is puzzling. ā€¢ CI Error Log: ā—¦ wasmJsBrowserTest: https://github.com/yumemi-inc/Tart/actions/runs/15945080589/job/44978107464?pr=129#step:6:221 ā—¦ jsBrowserTest: https://github.com/yumemi-inc/Tart/actions/runs/15384920112/job/43281638863?pr=125 ā€¢ Source code: https://github.com/TBSten/Tart/tree/feature/wasm ā—¦ You can verify this locally in 
    git clone <https://github.com/TBSten/Tart> && git fetch origin feature/wasm && git checkout feature/wasm
    . As shown in the CI Error Log > jsBrowserTest, no explicit browser setup is performed in the CI environment, but the 
    jsBrowserTest
    task has been successful in the past. I expected wasmJs to work similarly, but it does not, which is puzzling.
  • a
    Hello! While exploring the "What's New in Kotlin 2.2.0" section related to Kotlin/Wasm, I came across this example: kotlin
    Copy code
    @JsExport
expect class WindowManager {
    fun close()
}

// jsMain

@JsExport
actual class WindowManager {
    fun close() {
        window.close()
    }
}
    Up until now, I could only use the @JsExport annotation on functions. When I tried applying it to a class, I got the error: "This annotation is not applicable to target 'class'. Applicable targets: function." Is this a documentation error, or is @JsExport now intended to work with classes as well?
    a
    • 2
    • 2
  • v
    Hi there , is that possible to somehow compile kotlin code into wasm32-unknown-unknow target , make it like lib with no entry point ?
  • r
    When running Kotlin/WasmJS app in Firefox 140 I see this warning in the browser console: 
    The WebAssembly exception handling 'try' instruction is deprecated and should no longer be used. Please recompile to use the 'try_table' instruction instead.
    . Is this a known issue?
    šŸ‘€ 2
    e
    • 2
    • 3
  • c
    Iā€™ve noticed the compiler always generates an _initialize function, irrespective as to whether the program needs it. Is there any work to conditionally include this function if its needed? It looks like the function does a bunch of different things but could it also be set as a start function if its idempotent? I guess this is a question for @bashor @Artem Kobzar
    m
    b
    • 3
    • 4
  • c
    I have multiple projects now, anything beyond a basic templete generated by the KMP plugin either doens't compile or we get runtime errors:
    Copy code
    [object WebAssembly.Exception]
    at handleError (webpack-internal:///../../node_modules/webpack-dev-server/client/overlay.js:251:58)
    at eval (webpack-internal:///../../node_modules/webpack-dev-server/client/overlay.js:274:7)
    (When other targets work fine)
    • 1
    • 2
  • d
    āš ļø Does Kotlin (WASM/JS) have a value class equality problem? For an App with a financial component, I'm creating a 
    Decimal
    abstraction over: ā€¢ JVM/Android (
    BigDecimal
    ) āœ… ā€¢ iOS (
    NSDecimalNumber
    ) āœ… ā€¢ ...and finally WasmJs (npm's 
    decimal.js
    ) āš ļø In such situations, for the sake of resource efficiency, we would like to use a 
    value class
    to unify these. This is almost working fine - perfectly with JVM/iOS - but theres a problem with equality when it comes to the wasmJs target. Unless I'm mistaken, it works like this: 
    value class
    equality defers to the 
    equals(other: Any?)
    of the wrapped value. ...which for JVM and iOS, is already mapped (as a matter of built-in KMP Interop.) to the canonical function of each platform; being JVM equals and iOS isEqual. With wasmJs (and JS in general I guess?) there is no canonical equality function, which entails that common code 
    equals
    can currently only ever compare object identity for WASM/JS value classes ā“ Current 'KMP + value class' design leaves us with no opportunity to defer to a suitable equivalence function (like the 
    equals
    function provided by decimal.js). This breaks use cases for naturally equatable objects. This means the 
    value class
    efficiency dream is off the table ā‰ļø Since we can't currently intercept 
    equals
    by either: ā€¢ Overriding 
    equals
    in a 
    value class
    (compiler error) šŸ™… ā€¢ Nor at the level of declaring an 
    external class
    for JS mapping (an affordance here could be nice) šŸ™… (
    JsAny
    vs 
    Any
    issue) Are there any workarounds? While this may not be a bug in KMP JS/WASM target; it appears to be a significant '_feature usability issue_' for such cases.
    j
    • 2
    • 8
  • t
    Hi. I have been focusing on the Android target of my project these past weeks, and updated some dependencies (Kotlin 2.2.0, Compose 1.9.0-alpha03, lifecycle-runtime-compose 2.9.1, Koin 4.1.0, Adaptive 1.2.0-alpha03). Now that i try to run the Wasm target, i get this error :
    Copy code
    [object WebAssembly.Exception]
    at handleError (<webpack://composeApp/../../node_modules/webpack-dev-server/client/overlay.js?:251:58|webpack://composeApp/../../node_modules/webpack-dev-server/client/overlay.js?:251:58>)
    at eval (<webpack://composeApp/../../node_modules/webpack-dev-server/client/overlay.js?:274:7|webpack://composeApp/../../node_modules/webpack-dev-server/client/overlay.js?:274:7>)
    I have no idea about what causes this so far. The Android, JVM and JS apps work. I also use Voyager 1.1.0-beta03 and Multiplatform Settings 1.3.0. It used to run fine on Kotlin 2.1.20, Compose 1.8.1, lifecycle-runtime-compose 2.9.0-alpha05 and Koin 4.0.2-RC3.
    c
    m
    o
    • 4
    • 10
  • j
    Upgraded project here to Kotlin 2.2.20-Beta1 and getting following when running Compose for Web app.....all other targets seem ok
    Copy code
    WebAssembly.instantiate(): Import #5281 "./skiko.mjs" "org_jetbrains_skia_Shader__1nMakeWithLocalMatrix": function import requires a callable
LinkError: WebAssembly.instantiate(): Import #5281 "./skiko.mjs" "org_jetbrains_skia_Shader__1nMakeWithLocalMatrix": function import requires a callable
  • w
    Does anyone know how to configure 
    -Xwasm-use-new-exception-proposal
    only for 
    wasmJsDevelopmentRun
    and not 
    wasmJsBrowserDistribution
    ? I've been adding the flag manually when running the former, but curious if it can be automated, because sometimes I forget and waste a build. šŸ˜
    • 1
    • 1
  • c
    Is there an "official" way to have production/development env/distribution? seems like there is no way to pick development/production compilation/distribution targets? This seems not like the best/but only way... https://gist.github.com/CameronProbert/85b7d60fa9572d93566f5c5ee62441e0
    t
    • 2
    • 41
  • t
    When porting JS code to WebAssembly, what strategy should I follow for functions not exposed by kotlinx.browser? For example, this works for JS but I can't figure out how to do this in WASM.
    Copy code
    private suspend fun Blob.asByteArray(): ByteArray {
        //<https://developer.mozilla.org/en-US/docs/Web/API/Blob/arrayBuffer>
        val buffer = asDynamic().arrayBuffer() as Promise<ArrayBuffer>
        return Int8Array(buffer.await()).unsafeCast<ByteArray>()
    }
    r
    t
    • 3
    • 9
  • k
    Hi guys, I was configuring my compose multiplatform app for WasmJS to run it on web, I'm able to make it run but as soon as it launches I get an error screen with the following error, and I'm not able to figure out the issue with this message, can anyone help me in resolving or get more detailed logs to resolve this issue
    Copy code
    WebAssembly.instantiateStreaming(): Compiling function #80262:"in.porter.owner.ownerapp.shared.core.journeys.r..." failed: struct.set[1] expected type (ref null 13693), found struct.get of type (ref null 431) @+13386268
CompileError: WebAssembly.instantiateStreaming(): Compiling function #80262:"in.porter.owner.ownerapp.shared.core.journeys.r..." failed: struct.set[1] expected type (ref null 13693), found struct.get of type (ref null 431) @+13386268
  • s
    Hi, does anyone know how to access 
    composeResources
    when composeApp.js is loaded on a non root path? I keep on getting 
    MissingResourceException: Missing resource with path: ./composeResources/my.package.name/drawable/compose-multiplatform.xml
    o
    • 2
    • 2
  • a
    Hi all, is it possible that with Kotlin JVM (setup with maven) to include wasm libraries from other projects, using it for back-end project? Can't find resources about it, only find things about compose
    šŸš« 1
    šŸ‘Œ 1
    m
    • 2
    • 1
  • m
    How do you test 
    browser
    vs 
    node
    given that https://youtrack.jetbrains.com/issue/KT-60802 is still an issue? Do you test only a single environment? Do a separate project specifically for testing the other environment? Something else?
    o
    o
    e
    • 4
    • 12
  • a
    Hi, is it possible to get exceptions stacktrace when an error happens inside Kotlin 2.2.0-compiled Wasm (executed in NodeJS, old version of Exception Handling proposal)? The stacktrace seems be absent and debugging exceptions without a message like NPEs that happen somewhere is inconvenient to say the least. Not clear from the EH proposal if this is supported by the proposal itself but please advise if there are any debugging means that make it easier to localize the place where an exception is thrown other than using a bunch of `println`'s
    i
    b
    • 3
    • 15
  • m
    I am just trying to understand how to use the APIs provided by the kotlin-wrappers project. As an example I have picked the kotlin-jszip module. I tried to convert the initial example given in https://stuk.github.io/jszip/ to Kotlin but somehow I got stuck. It took me already quite some time to find out about this ā€œunsafeJsoā€ function. I finally failed to convert the async stuff. Can anybody help me with that. Code so far inside the thread.
    k
    t
    • 3
    • 51
  • e
    Why are pre-release versions of Kotlin being used in released libraries (kotlinx-browser in this case):
    Copy code
    w: The version of the Kotlin/Wasm standard library (2.2.20-Beta2-release-177) differs from the version of the compiler (2.2.0). Please, note that while Kotlin/Wasm is in active development phase only matching versions are supported.
Please, make sure that the standard library has the same version as the compiler. Adjust your project's settings if necessary.
e: warnings found and -Werror specified
    j
    t
    • 3
    • 15
  • c
    Is it expected that if a composeResource file fails to load on wasmJs/js, it will completely stop composition and kill the ui? Dunno if there is a safer way to handle resource loading? Minus pre caching everything which seems a little heavy handed?
    f
    s
    • 3
    • 2
  • p
    Hi! I'm trying to read a ZIP from within Wasm/JS. I thought about using https://github.com/nodeca/pako through JS interop, however I'm getting the following problem when calling the library, the full stack trace is in the thread. The code is here. It's almost identical to what's done in Ashampoo's kim (code). @Stefan Oltmann maybe you have an idea what's wrong?
    šŸ‘€ 1
    t
    j
    +2
    • 5
    • 18