Accessing JavaScript variable outside of jsMain

I’m building an application with a UI fully implemented in KotlinJS. I’m currently using Vert.x to send messages back and forth through Kotlin and JavaScript. This works great but a limitation I’m trying to work through is the fact that both the JVM code and the JS code hold the current state of the UI.

Whenever I update the UI, I send a message through Vert.x to make sure the state is updated everywhere. I’m trying to get around duplicated state by moving all the code about the state of the UI solely into the jsMain module. The issue that I can’t seem to think around is the fact that now the JVM code needs to query JavaScript in order to know the state of the UI and I’m failing to see how I can pass a reference stemming from the JavaScript code to the Kotlin code outside of the jsMain module.

Consider this example:


class PageImpl : IPage {
    override var currentTitle = "The Title"

    overrride fun getNameFieldText(): String {
        TODO("Run JS code to get text")

var page: IPage = PageImpl()
TODO("Render UI based on: $page")


interface IPage {
    var currentTitle: String
    fun getNameFieldText(): String


val page: IPage = TODO("How to access JS variable from here?")

println("Current title: ${page.currentTitle}")
println("Current name: ${page.getNameFieldText()}")

I’m aware of how to call Kotlin from JavaScript and how to call JavaScript from Kotlin, but only inside of the jsMain module. Once I leave that module the dynamic keyword no longer seems to have any use. Being so, how can I get my jvmMain code to access the state which is stored inside jsMain? The only alternative I can currently think of is sending the current state through Vert.x. I’m hoping there is a more convient way. Maybe something to do with proxies or something. The jvmMain module doesn’t need to be able to access the full functionality of PageImpl. Everything it cares about is defined in IPage and that is something both the jvmMain and jsMain modules understand.