Why does my browser auto refreshes twice to show c...

# javascript

[Prabin Timsina]

Why does my browser auto refreshes twice to show changes made in code? First refresh does not show the changes, only second one does.

There are some warnings in console (see attached imaged) most likely related to webpack.

I am running jsBrowserDevelopmentRun --continuous. (I also have ktor server running alongside)

build.gradle

plugins {
    id 'org.jetbrains.kotlin.multiplatform' version '1.7.21'
    id 'application'
    id 'org.jetbrains.kotlin.plugin.serialization' version '1.7.21'
}

def ktorVersion = "2.1.3"

group = 'me.developer'
version = '1.0-SNAPSHOT'

repositories {
    jcenter()
    mavenCentral()
    maven { url '<https://maven.pkg.jetbrains.space/public/p/kotlinx-html/maven>' }
}

kotlin {
    jvm {
        compilations.all {
            kotlinOptions.jvmTarget = '1.8'
        }
        withJava()
        testRuns["test"].executionTask.configure {
            useJUnitPlatform()
        }
    }
    js() {
        binaries.executable()
        browser {
            commonWebpackConfig {
                cssSupport.enabled = true
                devServer?.port = 8080
            }
        }
    }
   // dependencies {...}
}

application {
    mainClassName = 'me.developer.application.ServerKt'
    applicationDefaultJvmArgs = ["-Dio.ktor.development=true"]
}

tasks.named('jvmProcessResources') {
    def jsBrowserDistribution = tasks.named('jsBrowserDistribution')
    from(jsBrowserDistribution)
}

tasks.named('run') {
    dependsOn(tasks.named('jvmJar'))
    classpath(tasks.named('jvmJar'))
}

[Leon]

Hmm...
I am interested in this point as well.. In mine, it's same as this

[Robert Jaros]

It's a problem with generation of source maps. You can disable source maps to workaround it. See: https://youtrack.jetbrains.com/issue/KT-44838/Kotlin-JS-source-map-loader-slow-performance-since-1.4.0

[Prabin Timsina]

Thanks. That worked!

js() {
        binaries.executable()
        browser {
            commonWebpackConfig {
                sourceMaps = false // <-----------------
                cssSupport.enabled = true
                devServer?.port = 8080
            }
        }
    }

[Moritz Hofmeister]

This solution is still bothersome because source maps don’t work with this workaround 🤔

[Robert Jaros]

Please vote for the issue 👆

[Erik]

Thanks for this Q&A. According to the youtrack issue, a fix is targeted at Kotlin 1.9.20-beta. 😉