enum class FakeApp(val title: String, val icon: @Composable () -> Unit, val content: @Composable () -> Unit) {
    SYSTEM_INFO("System Info", ::SystemInfoIcon, ::SystemInfoApp),
    ABOUT_ME("About Me", ::AboutIcon, ::AboutApp),
    ;
}

results in

Reference to function 'SystemInfoIcon' can not be evaluated: The call site provides 1 more value argument(s) than the function expects
IrLinkageError: Reference to function 'SystemInfoIcon' can not be evaluated: The call site provides 1 more value argument(s) than the function expects

How do I fix this?

I’m new to the compose-web. Wanted to see if it would be a nice option to start creating applications in although the first component I want to create is already giving issues. The component is a text field with a drop down. Sadly I either have just the JVM working with the up and down arrows for selection with the enter key and WASMJS failing on the enter part and when I add onPreviewKeyEvent plus focusable on the dropdown itself it makes the up and down arrows on both not work correctly anymore (need to press it a few times before it works) Since I am not a great wizard in compose I would love to hear your input. Code in the thread

Is there any reason to use ViewModel on web target (WASM/JS)?

compose wasm is beta... right? https://www.jetbrains.com/compose-multiplatform/ still has the alpha tag

Hi everyone I am pretty new to compose-web, but already love it. The fact that I can use a common theme for my Apps and the webApp is simply great, and writing compose is much more interesting than html, css and Javascript. Now I have one question about navigation. I didn't had the time to try everithing out, just read the docs. If I understand this Info right:

Make sure that every string that corresponds to a route starts with the # character to keep the data within URL fragments. Otherwise, when users copy and paste the URL, the browser will try to access a wrong endpoint instead of passing the control to your app.

This is only needed as long as I am not using rewrite rules on the server side like I would with a php site to hide perhaps index.php? In other words, can I remove the # if I use the right rewrite rules on the webserver?

I'm using kotlin.js.Promise.await (kotlinx.coroutines.await extension function) in webMain target. While running app for Js or WasmJs it compiles fine. But when running unit tests during Gradle build process it fails to compile with unresolved reference message for kotlinx.coroutines.await What might be wrong?

When we run the compose web app with

wasmJsBrowserDevelopmentRun

, it start on port 8080. After that, if we make any change to the code, I noticed that app is not updated. So is there any way using which we can re run the app when we change the code? My current app takes around 4 seconds to re run using above command. It is getting very frustrated to wait each time I make a small change to UI. I tried using continuous mode of Gradle, but still it try to run

compileDevelopmentExecutableKotlinWasmJs

which takes significant amount of time to complete. Can anyone share any info on this?

As I noticed when testing a compose-web site on the iPhone, I get white background for the safe areas of the camera. Is there a way to make compose-web “edgeToEdge” and handle safe areas by myself, or otherwise is there a way to set the color of the safe area?

At some point in the past couple of releases, this modifier started giving me issues on web:

fun Modifier.nextFocusOnTab(requester: () -> FocusRequester?): Modifier {
    return onPreviewKeyEvent { event ->
        if (event.key == Key.Tab && event.type == KeyEventType.KeyDown) {
            requester()?.requestFocus()
            true
        } else {
            false
        }
    }
}

It switches the focus to the

requester

(for example, the next input receives the caret) but actually the focus is requested by the browser's address bar, so the tab button becomes unusable. A few versions back (not sure when) this worked fine, and tab would correctly focus on the next input, without browser forcing focus on the address bar.

When Jetbrains talks about Compose for Web. What does it mean, WebAssembly or JS or both?

Anyone using compose html in production?

Cheeky question. What does

<http://kotlinlang.org|kotlinlang.org>

use for frontend?

With compose-html, how do I observe scroll offset? (i'm accepting kobweb extensions as well 😀)

For some reason my wasm app started throwing

Module not found: Error: Can't resolve './skiko.mjs' in '/path/build/wasm/packages/project-name/kotlin'

but it worked fine a few days ago, any ideas what could be causing this? The only things that really come to mind are that I've added Coil3 and Skydoves ColorPicker

Is the file available for download anywhere perhaps?

Hello everyone I ran into a problem in my application - when the browser page is reloaded, the application is not rendered (an empty white page). In chrome inspector, you can see that the files index.html / app.the js and 2 .wasm files are loaded from the cache. What could be the reason for this behavior?

After switching from

CanvasBasedWindow

to

ComposeViewport

i found that after pressing Tab the canvas becomes focused and gains a distracting white outline (on chrome). Is there a way to apply CSS to the canvas? It's under shadow-root so normal stylesheets don't affect it.

hi there I am making a kotlin mobile app and I will have to let the users use it directly from a website how can I do that

Finally got the chance to report the font loading bug on web. Opened an issue at: https://youtrack.jetbrains.com/issue/CMP-9075/Square-placeholders-shown-before-loading-custom-fonts-on-Web

Now that Compose Web is in Beta, are there any plans to allow deleting characters while holding down the shift key? I think it would help it'd really help the user experience with any CMP Web app that involves typing. Another thing that's sorta on my wish list, is that native web apps allow you to start typing as soon as the tab is opened (such as any search engine or ai chatbot website). I haven't figured out a way to do this with CMP Web that doesn't involve getting the user to mouse click on the page first.

Hi, I found a bug in how multi-touch events are handled in compose-web. The issue was opened a few days ago: https://youtrack.jetbrains.com/issue/CMP-9030/wasm-canvas-incorrect-handling-of-multi-touch-input I have a fix for it as I identified the faulty part in the pointer event handling implementation specific to compose/web. What is the process for upstreaming such change ? In the Github contribution guide, it is explained that opening PRs on Github is not accepted for the compose/ui subproject. Thank you

do i remember wrong that there is a way to have wasm fallback to js? how is that done? can't find it in the docs

How do i change the distribution path of a wasm compose app? When i use the

distribution

block, the composeApp.js and many other files are not included in the output

wasmJs {
        browser {
            distribution {
                val rootDirPath = project.rootDir.path
                outputDirectory = File("$rootDirPath/dist/${project.name}") // <- 
            }
        }
        binaries.executable()
    }

I'm running

wasmJsBrowserDistribution

to package my compose web wasm app but the distribution contains 2 wasm files with weird names. is that normal? I expected to have just one .wasm file with the name is specify in the distribution block

~~Im facing this issue with embedding compose web inside of an iframe~~* even though i set the height of the iframe to be 400px, the contents of it end up being 404px and it causes the compose app to scroll. this is probably some styling issue, but i cant figure it out. any ideas? * Turns out this has nothing to do with the iframe. just running the app separately scrolls in place, even if the body is width + height 100%

Hi guys, As now we have

webMain

as web main source set. so i was trying to use the

WebElementView

composable there in webMain , but its not resolving(not found). Its available in jsMain and wasmJsMain only. Why its not available in webMain? most of the compose things which were available in wasmJs or js, should be available there in webMain, right? or am i missing something?

(Cross posting from #CDFP59223) Hi! I heard in a lightning talk from the Kotlin Conf 2025 that Compose Multiplatform on Web (with Wasm) is rendered on Canvas. How does that work? Are there any resources diving into rendering? I have a bunch of questions like • Does it write ui updates as bytes into a shared memory and the web browser reads from it as a stream and sends that to the canvas? • Does it calculate/render the compose tree and send that over the browser where it converts it as UI?

Hi team, When I upgraded to Compose Multiplatform

1.9.0

(from

1.8.2

), it seems that the testing has stopped working. Specifically, the

runComposeUiTest

calls are no longer running. Has anyone else encountered this issue?

What are the ways we can reduce caching of wasm binary? I have this challenge in that my client has to reload/refresh page to update the app. If they just reopen they still get the old app

I've been pulling in my composeApp as a module using the autogenerated "composeApp.mjs" so that I can grab it as a module and call kotlin from javascript. However that import intermittently fails (as in your compose wasm app does not start) with error like "can't find the function _malloc in compose and skiko." I think I've narrowed it down to my app (the internal compose parts) calling skiko before its really up. So I reworked the composeApp.mjs (with AI help) to wait for skiko to fully come up first:

import * as skiko from './skiko.mjs';
import * as joda from '@js-joda/core';
import { instantiate } from './composeApp.uninstantiated.mjs';

export async function initComposeApp()
{
    if (skiko.ready)
    {
        await skiko.ready;
    }
    else if (typeof skiko.instantiate === "function")
    {
        // fallback for older skiko
        await skiko.instantiate();
    }
    const { exports } = await instantiate({
        './skiko.mjs': skiko,
        '@js-joda/core': joda
    });
    return exports;
}

So far it appears to be working. I figured I'd post this here, because I think anyone else who is trying to use their composeApp as a module will hit the same problem.