kotlinlang #compose-web

Slackbot

05/26/2025, 4:06 AM

This message was deleted.

Carter

05/26/2025, 9:49 AM

Are compose UI tests supposed to work with wasm targets? Is anything special needed to get them running? As soon as I introduce

runComposeUiTest

to a test case, I get an exception with `NotImplementedError: Implemented as intrinsic`for Kotlin 2.1.21 and Compose 1.8.1 with the WASM target, while the desktop target is fine.

Copy code

@Test
    fun composeTest() = runComposeUiTest { 
        // throws NotImplementedError: Implemented as intrinsic for WASM target
    }

Barry Fawthrop

05/29/2025, 3:34 PM

Hi All. for ComposeMultiplatform (iOS, Android and Web wasmjs). There is a moko-permissions library but it doesn't support Web/wasmJs. is there a better library to handle Permisions (Location, Camera, Photos)? Also Can you define the browser window size for the Web target? (or some browers simulate being an iPhone or Android Phone and thus resize to phone proportions. Thanks In advance

adjorno

05/31/2025, 9:45 AM

Hello, I am new to Compose Web development and web development in general. I am trying to proxy dev.to blog to my domain and render it in a custom way by Web Compose. How can I get the setup so locally I can work with the url

Copy code

localhost:8080 -> to open index.html with the list of articles
localhost:8080/1234 -> to open the 1234 article

and in prod

Copy code

mydomain.com/blog -> to open index.html with the list of articles
mydomain.com/blog/1234 -> to open the 1234 article

I am expecting that it should be somehow achievable without Kotlin to know about production

/blog

segment. I tried this one in

index.html

but it did not help in prod.

Copy code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Blog</title>
    <base href="/blog/">
</head>
<body>
<div id="root"></div>
<script src="./blog.js"></script>
</body>
</html>

I am getting

blog.js:1 Failed to load resource: the server responded with a status of 404 ()

Could anybody help?

Thierry Kh

06/01/2025, 10:34 AM

Hello. I have noticed on Wasm that i get errors while retrieving string resources from the compose resources when the browser is set to a language without a region. So i would need to have a fallback that forces the locale to one with a region, like en-US. Is this possible in-app for wasm somehow ? Or does it have to be handled before the app script is called via a js script ? For instance, if i set Chrome's first preferred language to "english" instead of "english (United States)", my app will crash. If i set to the later one, the app works fine. Same for French or any other language. This is not an issue on Js on which the app works even if a region isn't chosen. PS: as the issue doesn't exist in js, I run the js app when no region is found but this is not a real solution.

Alex Styl

06/02/2025, 3:12 PM

does the ComposeViewport composable change its size?

prudhvi reddy

06/03/2025, 2:55 AM

👋 Hey folks Is there any website out there Where i can paste a composable and it shows the preview of that in web? While theming and all can't be understood by the external site I feel it should be possible for the foundation level components like Row, Box, layout

Preetam

06/03/2025, 4:00 AM

Hello, has anyone succeeded writing a simple unit test for wasmJs platform from compose multiplatform(commonMain)?

professionalvibecoder

06/03/2025, 9:05 AM

hello, is there anything known about elevation becoming available for web/wasm?

Brahh

06/08/2025, 1:13 PM

ok ok i get it, compose is truelly a cross platform gui framework. but what about web?? does it just draws inside <canvas></canvas>? is there a way to compile to actual html tags or w3c web components? and how to integrate tailwind and shadCN? and i know you can compile it to js somehow but I created the project repo through kotlin multiplatform wizard https://kmp.jetbrains.com/ how to add js now (don't want to use wasm) https://kotlinlang.org/docs/js-overview.html

🧌 1

Yassine Abou

06/09/2025, 3:07 AM

I’m new to Kotlin/JS Interoperability and got stuck with this error:

"Calls to 'js(code)' must be a single expression inside a top-level function body or a property initializer"

My code tries to load a WebWorker with

js()

inside a Koin module, but it’s not allowed. Here’s the problem:

Copy code

actual val platformModule = module {
    single {
        val driver = WebWorkerDriver(
            Worker(
                js("""new URL("@cashapp/sqldelight-sqljs-worker/sqljs.worker.js", import.meta.url)""") // ❌ Error here
            )
        )
        LlmsDatabaseWrapper(driver, LlmsDatabase(driver))
    }
}

how could I fix this issue?

✅ 1

Yassine Abou

06/10/2025, 1:28 PM

I'm encountering an error while setting up SQLDelight for WebAssembly in a Kotlin Multiplatform project targeting WebAssembly. When initializing the database worker, I get the following console error: composeApp.uninstantiated.mjs:189 WebWorkerException:

Copy code

{
   "message":"Uncaught SyntaxError: Unexpected token '<'",
   "type":"error"
 } isTrusted,true
 kotlinx.coroutines.error_$external_fun @ composeApp.uninstantiated.mjs:189

Is this primarily a SQLDelight configuration issue or a coroutines uncaught exception? Relevant Code Snippets: Database Configuration:

Copy code

private val workerScriptUrl: String = 
     js("""new URL("@cashapp/sqldelight-sqljs-worker/sqljs.worker.js", import.meta.url)""")
 
 actual val platformModule = module {
     single {
         val driver = WebWorkerDriver(Worker(workerScriptUrl)).apply {
             enableForeignKeys()
         }
         LlmsDatabaseWrapper(driver, LlmsDatabase(driver))
     }
 }

Webpack Configuration (sqljs.js)

Copy code

config.resolve = {
     fallback: {
         fs: false,
         path: false,
         crypto: false,
     }
 };
 
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 config.plugins.push(
     new CopyWebpackPlugin({
         patterns: [
             '../../node_modules/sql.js/dist/sql-wasm.wasm'
         ]
     })
 );

for more context. check out this repository link: https://github.com/yassineAbou/LLMS

Alex Styl

06/11/2025, 1:59 PM

Does compose web support variable fonts? I am trying to use Inter, works great on desktop but shows squares on web

Alex Styl

06/11/2025, 2:12 PM

Weird. Tried to load static fonts and they are still squares

Thierry Kh

06/11/2025, 10:26 PM

Am I the only one for whom some string resources won't show in texts on the first composition on Wasm and Js? Everything works just fine on Android, iOS and desktop. The workaround I found is to call once all the string resources that won't show before they are used.

Roberto Fernandez Montero

06/13/2025, 11:20 AM

I'm trying to solve an issue running compose web (Both JS and wasm)

Copy code

13:13:24: Executing 'jsBrowserDevelopmentRun'

Ends in an error:

Copy code

e: org.jetbrains.kotlin.util.FileAnalysisException: While analysing /Users/user/branches/Binshelve/composeApp/build/generated/compose/resourceGenerator/kotlin/commonResClass/binshelve/composeapp/generated/resources/Res.kt:17:1: org.jetbrains.kotlin.utils.exceptions.KotlinIllegalArgumentExceptionWithAttachments: Exception in declaration checkers

Execution failed for task ':composeApp:compileKotlinJs'.
> A failure occurred while executing org.jetbrains.kotlin.compilerRunner.GradleCompilerRunnerWithWorkers$GradleKotlinCompilerWorkAction
   > Internal compiler error. See log for more details

Yassine Abou

06/16/2025, 1:36 AM

Hi everyone! I'm running into a WebWorker exception while setting up SQL Delight for WebAssembly. I’ve spent a lot of time trying to debug this, but I’m stuck. To get help, I’ve opened an issue on GitHub. If anyone has ideas or wants to contribute, please check it out here: https://github.com/yassineAbou/LLMS

Catherine

06/17/2025, 1:26 PM

I just saw wasm was still alpha? Somehow I though it was stable, but guess that's my memory's playing tricks on me? How usable is it ( would be more for small personal project)

Mario Andhika

06/18/2025, 8:03 AM

Anyone use dev.gitlive’s Firebase for wasmJs target?

✅ 1

Eric

06/19/2025, 10:47 AM

Anyone know of a way to proxy gradle's webserver so I can do XMLHttpRequest from the app? The kotlin/gradle/java/etc equivalent of this Node.js code:

const config = {

async rewrites() {

return [

source: '/api/:path*',

destination: '<http://localhost:4000/:path*>' // Proxy to Backend

};

darkmoon_uk

06/19/2025, 3:12 PM

Is there any present or future pathway to supporting automated browser testing frameworks like Selenium on a (Compose) Canvas Rendered WASM page. While these are usually designed to work with the HTML DOM, they typically use only a narrow subset of DOM interactions like click, focus, check text content, find text. I would think some kind of bridging API would be possible? Or should we limit ambitions to Compose Testing APIs only in this area; discounting 3rd party test platforms? Thoughts or experiences?

👀 1

Vivek Modi

06/19/2025, 10:13 PM

Hello everyone, I'm currently working on a project using KMP (Kotlin Multiplatform) + Compose Multiplatform (CMP). The application involves sending notifications to users and handling in-app purchases. I've already implemented these features for both Android and iOS. Now, my product team wants the same functionality available on the web. I convinced them to go with KMP + CMP instead of Flutter for a consistent codebase.

Eric

06/20/2025, 9:43 AM

Anyone had any luck with kotlinx.serialization in compose-web? Doesnt seem to work for me. I'm guessing because compose-web is still alpha.

Sergio Moral

06/20/2025, 3:12 PM

Hi guys! I have done a portfolio website using compose but I have a question about how it will be rendered in a mobile browser. I have implemented a UI that it’s cool for desktop but it breaks in a mobile. Do you create different uis for android,iOS and the web or how do you manage it? Thanks in advance!

Vlad Cipariu

06/30/2025, 8:11 AM

hello! I'm new to KMP and I'm trying to clarify a few things, hope this isn't too annoying for Kotlin/JS -- we can only use Compose HTML also this doesn't support any of the Jetpack libs such as ViewModel, Navigation etc for Kotlin/WASM - we can use Compose UI ? Thank you for you time

Khangpv202

07/01/2025, 6:53 AM

Hi everyone, I'm working with Compose for Web (Wasm) and encountering a font issue. It seems I'm unable to display symbol icons correctly. For example, when I try to show something like "`Tip\uD83D\uDCA1: If you see an ..`.", the lightbulb symbol (💡) doesn't appear as expected. U can check the 2 images bellow. the left is on phone, the right is on web. Has anyone else experienced this, or does anyone know how to get the symbols to render properly? Thanks.

Devkinandan Pandey

07/11/2025, 5:39 AM

Hi everyone, I'm working with compose for android, ios and web(Wasm) so i want to integrate barcode scanner in my project is there any library available for that ?.

Matthew David

07/11/2025, 8:34 PM

Is there an integration path where I can load a Composable using compose-web in a WebView which is in compose-android? (I guess some version of the android target depending on a separate web target)

Pavel Shnyakin

07/13/2025, 9:01 PM

Hi! Does anyone know how to prevent content from resizing when the keyboard opens? 🧵 ⬇️

Sumit Jha

07/14/2025, 4:02 PM

In my project after running wasmJsBrowserDistribution it creates two .wasm binaries one is of 8Mb & other is of 5Mb inside productionExecutable, is that expected and production server will host 13Mb of webpage?

👌 3