I was looking for some lib have Kotlin DSL to build JSON like Koson for javascript.

Hi, is there a way to debug KotlinJs Code on NodeJs with Intellij?

Hey guys, this fails on JS-IR Kotlin 1.4-M2-mt:

@Test
fun testFailingIr2() {
    val v = 1L shl 62
    assertEquals("$v", v.toString())
}

Hi, is there a way to package multi-module dependencies to publish to npm registry? The only way I could do that in a Kotlin multiplatform project was navigating through

build/js

found in root folder and publishing each package individually by checking the generated package.json which have

workspaces

so I know how to navigate with my script through each package in workspaces and publish. But is there a better way to do it? I mean through gradle? Also when I checked the artifact generated for js per module, the package.json did not have dependencies with other modules in the same project which will be hard, that’s why I checked the

build/js

folder instead.

I'm trying to test code that uses

kotlin.browser.window.setInterval

I get the following error:

ReferenceError: window is not defined

I thought I was only targeting browser

js("browser") {
        browser {}
    }

and that those tests are executed by karma in chrome. Am I wrong? Is there more to only targeting browsers and getting the tests to run in the headless browser?

Hi, does anyone have an example on how to implement an AudioWorkletProcessor in kotlin? According to the documentation it should be possible to just override the external class AudioWorkletProcessor but I get the following error in chrome: AudioWorklet.kt:55 Uncaught TypeError: Failed to execute 'registerProcessor' on 'AudioWorkletGlobalScope': Property "process" doesn't exist This is how I defined the external interface:

external interface AudioWorkletProcessor {

    fun process(
        inputs: dynamic,
        outputs: dynamic,
        parameters: dynamic
    ): Boolean

}

This is the actual class:

class MyAudioProcessor : AudioWorkletProcessor {

    override fun process(
        inputs: dynamic,
        outputs: dynamic,
        parameters: dynamic
    ): Boolean {
        println("process")
        if (outputs.isNotEmpty()) {
            if (outputs[0].size == 2) {
                println("found one output with 2 channels")
            }
        }

        return true
    }

}

The registerProcessor function expects a class constructor, I use ::MyAudioProcessor. Maybe that should be something else? Btw, firefox gives this error message: TypeError: Return value of AudioWorkletProcessorConstructor does not implement interface AudioWorkletProcessor.

Hello everyone, is there a simpler way of reading an ArrayBuffer to a ByteArray than this?

Int8Array(data as ArrayBuffer).let {
    ByteArray(it.length){ i ->
        it[i]
    }
}

Use case: I am using CBOR and plain ByteArrays to communicate via websocket.

hi, can we use DCE from Maven kotlin plugin or by directly calling compiler?

Any suggestions how i can compare two lambdas? e.g. how I can get

x == y -> true

haviing

val x = {null}
val y = {null}

⚠️ 🎉 Kotlin 1.4-M3 has been released! (https://blog.jetbrains.com/kotlin/2020/07/kotlin-1-4-m3-is-out-standard-library-changes/) We’ll go in-depth about new features for Kotlin/JS in the next blog post, but in case you’re itching to migrate already, here are the breaking changes in M3: -

npm

dependencies in Gradle now require versions to be specified explicitly. If you want to just take whatever version, you can specify

*

– but that’s not recommended for obvious reasons. -

cssSettings

gets renamed to

cssSupport

, and isn’t enabled by default anymore. To turn on CSS support, set

cssSupport.enabled = true

in your

webpackTask

,

runTask

and

testTask

. -

kotlin.dom

and

kotlin.browser

are moving to

kotlinx.dom

and

kotlinx.browser

. Same APIs, different packages, so all that is needed is to adjust your

import

statements. We’ll lay out the rationale for these changes in the next blog post as well. Happy experimenting! Find the full changelog at https://github.com/JetBrains/kotlin/blob/1.4-M3/ChangeLog.md#js-tools

Hello everyone, are there anywhere guides for creating KotlinJS Wrappers for Typescript libraries? I'm trying to create a wrapper for React Wordcloud, but i dont get how to wrap the important library parts (https://www.npmjs.com/package/react-wordcloud) (Especially this

export type

thing, i dont get how to wrap this for KotlinJS)

I try download kotlin dev version with

npm()

function in my Gradle but throw error:

Execution failed for task ':kotlinNpmInstall'.
> Cannot find kotlin@1.4.0-M2 in yarn.lock

In yarn exists 1.4.0-M2 version (attach img.)

dependencies {
    implementation(npm("kotlin", "1.4.0-M2"))
}

In build of my Gradle when it try download

kotlin-react-dom:16.13.1-pre.109-kotlin-1.4-M3

throws error cant find

kotlinx-html-js:0.7.1-1.4-M3

. I solved it implement

kotlinx-html-js:0.7.1

in my Gradle. @Ivan Kubyshkin [JetBrains] , Is there a repository where it is hosted `kotlinx-html-js:0.7.1-1.4-M3`*?* Error:

Could not determine the dependencies of task ':webapp:packageJson'.
   > Could not find org.jetbrains.kotlinx:kotlinx-html-js:0.7.1-1.4-M3.
     Required by:
         project :webapp > org.jetbrains:kotlin-react-dom:16.13.1-pre.109-kotlin-1.4-M3
         project :webapp > org.jetbrains:kotlin-styled:1.0.0-pre.109-kotlin-1.4-M3

Gradle Repositories:

allprojects { // :parent module
    repositories {
        maven("<https://dl.bintray.com/kotlin/kotlin-eap>")
        jcenter()
        mavenCentral()
    }
}
repositories { // :webapp module
    maven("<https://kotlin.bintray.com/kotlin-js-wrappers/>")
}

I just created a kotlin multiplatform library for android, ios and Javascript which uses the Ktor client for all three. These are my dependencies for the javascript library

// MPP - JS & common dependencies

    sourceSets["commonMain"].dependencies {
        implementation(kotlin("stdlib-common", Versions.KOTLIN))
        implementation(Deps.Ktor.COMMON_CORE)
        implementation(Deps.Ktor.COMMON_JSON)
        implementation(Deps.Coroutines.COMMON)
        implementation(Deps.MP_SETTINGS)
        implementation(Deps.Ktor.COMMON_SERIALIZER)
        implementation(Deps.Serialization.COMMON)
        implementation(Deps.Stately.COMMON)
        implementation(Deps.Stately.CONCURRENCY)
    }    

    sourceSets["jsMain"].dependencies {
        implementation((kotlin("stdlib-js", Versions.KOTLIN)))
        implementation(Deps.Ktor.JS_CORE)
        implementation(Deps.Ktor.JS_JSON)
        implementation(Deps.Coroutines.JS)
        implementation(Deps.Ktor.JS_SERIALIZER)
        implementation(Deps.Serialization.JS)
    }


// Front-End react app dependencies
    implementation(kotlin("stdlib-js"))

    //React, React DOM + Wrappers (chapter 3)
    implementation("org.jetbrains:kotlin-react:16.13.0-pre.94-kotlin-1.3.70")
    implementation("org.jetbrains:kotlin-react-dom:16.13.0-pre.94-kotlin-1.3.70")
    implementation(npm("react", "16.13.1"))
    implementation(npm("react-dom", "16.13.1"))

    //Kotlin Styled (chapter 3)
    implementation("org.jetbrains:kotlin-styled:1.0.0-pre.94-kotlin-1.3.70")
    implementation(npm("styled-components"))
    implementation(npm("inline-style-prefixer"))

    //Video Player (chapter 7)
    implementation(npm("react-player"))

    //Share Buttons (chapter 7)
    implementation(npm("react-share"))

    // Shared Library: Nautilus
    implementation(project(":MarianaKit"))

    //Coroutines (chapter 8)
    implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core-common:1.3.7")

When I import the javascript library into the Jetbrains starter React app, the dev distribution size 27MiB and the production distribution size is 1.5 MiB. Is anyone else having such large distribution sizes? Is this normal? Or am I doing something on my end to cause this?

I need detect

Enter

key

onkeyup()

but dont work. Any suggestions why it is failing? Kotlin code:

attrs.onKeyUpFunction = {
          it.preventDefault()
          if (it.asDynamic().key === "Enter"  || it.asDynamic().keyCode === 13) onLoginButtonClicked()
}

Javascript Generated:

function loginWindow$lambda$lambda$lambda$lambda(closure$onLoginButtonClicked) {
    return function (it) {
      it.preventDefault();
      if (it.key === 'Enter' || it.keyCode === 13)
        closure$onLoginButtonClicked();
      return Unit;
    };
}

I have a pretty strange task. I am trying to do high performance communication between a web worker and the main js thread in a browser. Browsers use structured clone algorithm to pass javascripts objects between web workers and main threads, which is orders of magnitude faster than serialization. I am trying to make use of it without losing types. Here's code that is ran from the web worker:

private external var postMessage: dynamic

data class MessageToMain(
    val text: String
)

fun testInWorker() {
    val message = MessageToMain("Hello world!")
    postMessage(message)
}

And here's code that is ran in the main js thread:

worker.onmessage = {
    val data = it.data
    console.log(data)
    val typed = data as MessageToMain
    println(typed)
    Unit
}

console.log outputs

{text: "Hello world!"}

, but trying to cast it to MessageToMain unsurprisingly results in

ClassCastException

being thrown. Considering that the actual javascript object in

data

should satisfy the class definition of MessageToMain, I am wondering if there is a way to forcefully cast it.

has anyone seen this? https://github.com/quicktype/quicktype it can generate kotlin from json or from typescript. maybe an alternative to dukat?

i have two modules, moduleA and moduleB, moduleA depends on moduleB the resulting output's package.json now has

moduleB: 1.0.0

under dependencies instead of a relative / absolute path like the other Kotlin std lib dependencies is there a way to automatically include the generated JS from moduleB into moduleA or at least have that package installed somewhere? In the maven world, you would run

mvn install

, does the node ecosystem have something similar ?

Having this JavaScript code, how do I need to write this in KotlinJS?

const ProductHomeExample = () => (
  <ProductHome siteTitle="test" />
);
export default () => (
    <SomeComponent
      renderProductHome={ProductHomeExample}
    />
);

I am trying like this:

val ProductHomeExample = {
            ProductHome {
                attrs.siteTitle = "Test"
            }
        }
SomeComponent {
  attrs.renderProductHome = ProductHomeExample
}

but this leads to error: Uncaught Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component Edit: From looking at the type signature in the js file, I can see renderProductHome is of type React.ComponentType<{}>. So the question simplifies, how to create such a React.ComponentType<{}> instance?

is it documented somewhere how a kotlin class looks like in js? for example if i have a `data class K(val a:String, val b:String)`and i instantiate it as

K("first", "second")

, then cast it to dynamic and pass it to a javascript method, does it look like this: `{a: "first", b:"second"}`(possibly with more fields) ?

What is the equivalent in Kotlin JS to JavaScript ... As in example here:

<Button
          {...triggerProps}
          isSelected={isOpen}
          onClick={() => setIsOpen(!isOpen)}
          iconBefore={<MediaServicesAddCommentIcon label="Add" />}
        />

How can I achieve this "injection" of triggerProps into my component in KotlinJS?

Is it possible to have nodejs builds ouput a single file?

Hello! I want to use the KSVG library (https://github.com/nwillc/ksvg) in a Kotlin/JS project. The maintainer attempted to make the library work with K/JS, but it doesn’t. Specifically, declaring the dependency works fine, but the library is never available in IntelliJ after the dependency is downloaded. What is wrong currently that is preventing the library from being consumed in K/JS?

I’m trying to call a coroutines method from typescript, so i converted it to return a promise. now the generated typescript file contains a reference to

kotlin.js.Promise

(using the IR compiler) do i just have to add coroutines-core as npm dependency to frontend project?

Is there an idiom for

collection.map { it.unsafeCast<SomeExternalInterface> }

which is undestood by the compiler and transpiled efficiently? It is something that comes up from time to time when interacting with js libs and last time I checked the resulting code was a for loop instead of a no-op

I seem to have the same issue as @Nicholas Bilyk and I can't find a solution. Do you have any ideas what's wrong? https://kotlinlang.slack.com/archives/C0B8L3U69/p1590117705268000

/home/.../IdeaProjects/.../build/js/node_modules/kotlinx-html-js/kotlinx-html-js.js:11
}(this, function (_, Kotlin) {
 ^
ReferenceError: HTMLLegendElement is not defined
    at /home/.../IdeaProjects/.../build/js/node_modules/kotlinx-html-js/kotlinx-html-js.js:65:29
    at /home/.../IdeaProjects/.../build/js/node_modules/kotlinx-html-js/kotlinx-html-js.js:5:5
    at Object.<anonymous> (/home/.../IdeaProjects/.../build/js/node_modules/kotlinx-html-js/kotlinx-html-js.js:11:2)
    at Module._compile (internal/modules/cjs/loader.js:1158:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)
    at Module.load (internal/modules/cjs/loader.js:1002:32)
    at Function.Module._load (internal/modules/cjs/loader.js:901:14)
    at Module.require (internal/modules/cjs/loader.js:1044:19)
    at require (internal/modules/cjs/helpers.js:77:18)
    at Object.<anonymous> (/home/.../IdeaProjects/.../build/js/node_modules/kotlin-wrappers-kotlin-react-dom-jsLegacy/kotlin-wrappers-kotlin-react-dom-jsLegacy.js:2472:106)

FAILURE: Build failed with an exception.

Hello; I recently upgraded to M3 from M1, for a multiplatform project where I am trying to write a Kotlin library that I will be able to consume on multiple platforms. I am seeing a lot of new restrictions applied to the js export. Some are understandable (e.g. no jsname on a secondary constructor), but others are not as clear:

Declaration of such kind (enum class) cant be exported to JS

Why are enum classes no longer supported (e.g.

enum class Color { Red, Green, Blue }

)? Previously, a class was generated, and only the typescript would be lacking (maps to ‘any’). Now, it does not compile…

Is there a way to access the root scope of the running compiled js file?

Hey, I've created a new project using the "Full Stack Web Application" template in the new Kotlin project wizard, but when I run

gradlew run

no browser window opens. What am I supposed to do to show the app on a browser? (1.4-M3)