mikepenz · mikepenz · Jan 25, 2024 · Jan 25, 2024
diff --git a/app-wasm/README.md b/app-wasm/README.md
@@ -3,7 +3,7 @@
 ### Generate Dependency Information
 
 ```bash
-./gradlew app-wasm:exportLibraryDefinitions -PaboutLibraries.exportPath=src/wasmJsMain/resources/
+./gradlew app-wasm:exportLibraryDefinitions -PaboutLibraries.exportPath=src/commonMain/composeResources/files/
 ```
 
 ### Run Wasm app

diff --git a/app-wasm/build.gradle.kts b/app-wasm/build.gradle.kts
@@ -1,4 +1,4 @@
-import org.jetbrains.kotlin.gradle.targets.js.webpack.KotlinWebpackConfig
+import org.jetbrains.kotlin.gradle.targets.js.dsl.ExperimentalWasmDsl
 
 plugins {
     kotlin("multiplatform")
@@ -16,38 +16,31 @@ plugins {
 // }
 
 kotlin {
+    @OptIn(ExperimentalWasmDsl::class)
     wasmJs {
         moduleName = "aboutlibraries"
         browser {
             commonWebpackConfig {
-                devServer = (devServer ?: KotlinWebpackConfig.DevServer()).copy(
-                    open = mapOf(
-                        "app" to mapOf(
-                            "name" to "google chrome canary",
-                            "arguments" to listOf("--js-flags=--experimental-wasm-gc ")
-                        )
-                    ),
-                    static = (devServer?.static ?: mutableListOf()).apply {
-                        add(project.rootDir.path)
-                        add(project.rootDir.path + "/common/")
-                        add(project.rootDir.path + "/nonAndroidMain/")
-                        add(project.rootDir.path + "/web/")
-                    },
-                )
+                outputFileName = "composeApp.js"
             }
         }
         binaries.executable()
     }
 
     sourceSets {
+        commonMain {
+            dependencies {
+                @OptIn(org.jetbrains.compose.ExperimentalComposeLibrary::class)
+                implementation(compose.components.resources)
+            }
+        }
+
         val wasmJsMain by getting {
             dependencies {
                 implementation(compose.runtime)
                 implementation(compose.ui)
                 implementation(compose.foundation)
                 implementation(compose.material)
-                @OptIn(org.jetbrains.compose.ExperimentalComposeLibrary::class)
-                implementation(compose.components.resources)
 
                 implementation(project(":aboutlibraries-core"))
                 implementation(project(":aboutlibraries-compose-m2"))

diff --git a/.../wasmJsMain/resources/aboutlibraries.json → ...omposeResources/files/aboutlibraries.json b/.../wasmJsMain/resources/aboutlibraries.json → ...omposeResources/files/aboutlibraries.json
diff --git a/app-wasm/src/wasmJsMain/kotlin/Main.kt b/app-wasm/src/wasmJsMain/kotlin/Main.kt
@@ -10,13 +10,15 @@ import com.mikepenz.aboutlibraries.Libs
 import com.mikepenz.aboutlibraries.ui.compose.LibrariesContainer
 import com.mikepenz.aboutlibraries.ui.compose.util.StableLibs
 import com.mikepenz.aboutlibraries.ui.compose.util.stable
+import com.mikepenz.`app-wasm`.generated.resources.Res
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.withContext
 import org.jetbrains.compose.resources.ExperimentalResourceApi
-import org.jetbrains.compose.resources.resource
+import org.jetbrains.compose.resources.InternalResourceApi
 
-@OptIn(ExperimentalComposeUiApi::class, ExperimentalResourceApi::class)
+@OptIn(ExperimentalComposeUiApi::class, ExperimentalResourceApi::class, InternalResourceApi::class)
 fun main() {
+    println("I am here 1")
     CanvasBasedWindow("AboutLibraries", canvasElementId = "aboutLibsCanvas") {
         SampleTheme {
             Scaffold(
@@ -25,7 +27,7 @@ fun main() {
                 val libraries = produceState<StableLibs?>(null) {
                     value = withContext(Dispatchers.Default) {
                         Libs.Builder()
-                            .withJson(resource("aboutlibraries.json").readBytes().decodeToString())
+                            .withJson(Res.readBytes("files/aboutlibraries.json").decodeToString())
                             .build().stable
                     }
                 }

diff --git a/app-wasm/src/wasmJsMain/resources/index.html b/app-wasm/src/wasmJsMain/resources/index.html
@@ -2,20 +2,10 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <!-- http://localhost:80 -->
-    <meta http-equiv="origin-trial" content="AjytAe1FWUIWH/RzqsOWlXYw7kGwt11ejbvR/ArmAU4QbXIPg69wzpniDhPByiOZ9pdNqsdMsXsoxggVtfGhwwMAAABOeyJvcmlnaW4iOiJodHRwOi8vbG9jYWxob3N0OjgwIiwiZmVhdHVyZSI6IldlYkFzc2VtYmx5R0MiLCJleHBpcnkiOjE2OTg5Njk1OTl9">
-    <!-- http://localhost:8080 -->
-    <meta http-equiv="origin-trial" content="AtSRFRWKTCcQHDFUUQL1VaVz9mjmsK1xm5k0S8etkmvMLa5TsiNeQsle/eDgdZVkm1PM1WmrSMx52kI8yAP2UgEAAABQeyJvcmlnaW4iOiJodHRwOi8vbG9jYWxob3N0OjgwODAiLCJmZWF0dXJlIjoiV2ViQXNzZW1ibHlHQyIsImV4cGlyeSI6MTY5ODk2OTU5OX0=">
-    <!-- http://localhost:8081 -->
-    <meta http-equiv="origin-trial" content="AspyK9xe4tO2aIvJWnr5HTRT9GqpGJID2qZjj+0OvhKHp9JrUP+92PF+Rt11Tyi7cKSEB7OFFGdeVs7Ns5TMhAUAAABQeyJvcmlnaW4iOiJodHRwOi8vbG9jYWxob3N0OjgwODEiLCJmZWF0dXJlIjoiV2ViQXNzZW1ibHlHQyIsImV4cGlyeSI6MTY5ODk2OTU5OX0=">
-    <!-- http://localhost:8082 -->
-    <meta http-equiv="origin-trial" content="AoPGqwBGEQW3twSDYvXt1JHz5zg7Z4o+Orwr8NxdVoXJ68zjwOi2C8/0w4xFYW6UUH8w97eIjykGOa/+jIBfTQMAAABQeyJvcmlnaW4iOiJodHRwOi8vbG9jYWxob3N0OjgwODIiLCJmZWF0dXJlIjoiV2ViQXNzZW1ibHlHQyIsImV4cGlyeSI6MTY5ODk2OTU5OX0=">
-    <!-- http://localhost:8083 -->
-    <meta http-equiv="origin-trial" content="AvV2HYiHMw7lpIVcmGMSVmm6xC0Gzu4W5xBnZExmfHtE5zyNKFszcyNGm5IfCFQ6swnMotbn16lS1ozkJ0QzEAEAAABQeyJvcmlnaW4iOiJodHRwOi8vbG9jYWxob3N0OjgwODMiLCJmZWF0dXJlIjoiV2ViQXNzZW1ibHlHQyIsImV4cGlyeSI6MTY5ODk2OTU5OX0=">
 
-    <title>JetSnack with Kotlin/Wasm</title>
+    <title>AboutLibraries (Kotlin/Wasm)</title>
     <script type="application/javascript" src="skiko.js"></script>
-    <script type="module" src="load.mjs"></script>
+    <script type="application/javascript" src="composeApp.js"></script>
     <style>
         html, body {
             width: 100%;
@@ -30,7 +20,11 @@
             position: absolute;
             top: 100px;
             left: 100px;
+            max-width: 830px;
             z-index: 100;
+            background-color: white;
+            font-size: initial;
+            display: none;
         }
         #warning li {
             padding-bottom: 15px;
@@ -49,7 +43,9 @@
             position: fixed;
             bottom: 0;
             width: 100%;
+            z-index: 1000;
             background-color: white;
+            font-size: initial;
         }
 
         #close {
@@ -62,5 +58,38 @@
 </head>
 <body>
 <canvas id="aboutLibsCanvas"></canvas>
+
+<div id="warning">
+    ⚠️ Please make sure that your runtime environment supports the latest version of Wasm GC and Exception-Handling proposals.
+    For more information, see <a href="https://kotl.in/wasm-help">https://kotl.in/wasm-help</a>.
+    <br/>
+    <br/>
+    <ul>
+        <li>For <b>Chrome</b> and <b>Chromium-based</b> browsers (Edge, Brave etc.), it <b>should just work</b> since version 119.</li>
+        <li>For <b>Firefox</b> 120 it <b>should just work</b>.</li>
+        <li>For <b>Firefox</b> 119:
+            <ol>
+                <li>Open <span class="code">about:config</span> in the browser.</li>
+                <li>Enable <strong>javascript.options.wasm_gc</strong>.</li>
+                <li>Refresh this page.</li>
+            </ol>
+        </li>
+    </ul>
+</div>
 </body>
+
+<script type="application/javascript" >
+    const unhandledError = (event, error) => {
+        if (error instanceof WebAssembly.CompileError) {
+            document.getElementById("warning").style.display="initial";
+
+            // Hide a Scary Webpack Overlay which is less informative in this case.
+            const webpackOverlay = document.getElementById("webpack-dev-server-client-overlay");
+            if (webpackOverlay != null) webpackOverlay.style.display="none";
+        }
+    }
+    addEventListener("error", (event) => unhandledError(event, event.error));
+    addEventListener("unhandledrejection", (event) => unhandledError(event, event.reason));
+</script>
+
 </html>
diff --git a/app-wasm/src/wasmJsMain/resources/load.mjs b/app-wasm/src/wasmJsMain/resources/load.mjs
@@ -2,9 +2,4 @@ import { instantiate } from './aboutlibraries.uninstantiated.mjs';
 
 await wasmSetup;
 
-let te = null;
-try {
-    await instantiate({ skia: Module['asm'] });
-} catch (e) {
-  te = e;
-}
+instantiate({ skia: Module['asm'] });
diff --git a/app-wasm/webpack.config.d/boilerplate.js b/app-wasm/webpack.config.d/boilerplate.js
@@ -0,0 +1,7 @@
+config.entry = {
+    main: [require('path').resolve(__dirname, "kotlin/load.mjs")]
+};
+
+config.resolve ?? (config.resolve = {});
+config.resolve.alias ?? (config.resolve.alias = {});
+config.resolve.alias.skia = false;
diff --git a/kotlin-js-store/yarn.lock b/kotlin-js-store/yarn.lock
@@ -52,6 +52,11 @@
     "@jridgewell/resolve-uri" "^3.1.0"
     "@jridgewell/sourcemap-codec" "^1.4.14"
 
+"@js-joda/[email protected]":
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/@js-joda/core/-/core-3.2.0.tgz#3e61e21b7b2b8a6be746df1335cf91d70db2a273"
+  integrity sha512-PMqgJ0sw5B7FKb2d5bWYIoxjri+QlW/Pys7+Rw82jSH0QN3rB05jZ/VrrsUdh1w4+i2kw9JOejXGq/KhDOX7Kg==
+
 "@leichtgewicht/ip-codec@^2.0.1":
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz#b2ac626d6cb9c8718ab459166d4bb405b8ffa78b"