Track browser package versions in package json

.gitignore

@@ -4,4 +4,5 @@ build
 out
 *.md_
 .vscode
-bin
+bin
+src/main/resources/package.json

build.gradle.kts

@@ -54,6 +54,11 @@ kotlin {
 }
 
 tasks {
+    copy {
+        from("package.json")
+        into("src/main/resources")
+    }
+
     test {
         useJUnitPlatform()
     }

package.json

@@ -0,0 +1,11 @@
+{
+    "name": "structurizr-site-generatr",
+    "dependencies": {
+        "bulma": "0.9.4",
+        "katex": "0.16.9",
+        "lunr": "2.3.9",
+        "lunr-languages": "1.14.0",
+        "mermaid": "10.5.0",
+        "webfontloader": "1.6.28"
+    }
+}

src/main/kotlin/nl/avisi/structurizr/site/generatr/site/views/CDN.kt

@@ -0,0 +1,59 @@
+package nl.avisi.structurizr.site.generatr.site.views
+
+import kotlinx.serialization.Serializable
+import kotlinx.serialization.json.Json
+import kotlinx.serialization.json.jsonObject
+import kotlinx.serialization.json.jsonPrimitive
+import java.lang.IllegalStateException
+
+class CDN {
+    companion object {
+        private const val CDN_BASE = "https://cdn.jsdelivr.net/npm/"
+        private val json = Json { ignoreUnknownKeys = true }
+
+        private val packageJson = object {}.javaClass.getResource("/package.json")?.readText()
+            ?: throw IllegalStateException("package.json not found")
+
+        private val dependencies = json.parseToJsonElement(packageJson).jsonObject["dependencies"]
+            ?.jsonObject
+            ?.map { Dependency(it.key, it.value.jsonPrimitive.content) }
+            ?: throw IllegalStateException("dependencies element not found in package.json")
+
+        fun bulmaCss() = dependencies.single { it.name == "bulma" }.let {
+            "${it.baseUrl()}/css/bulma.min.css"
+        }
+
+        fun katexJs() = dependencies.single { it.name == "katex" }.let {
+            "${it.baseUrl()}/dist/katex.min.js"
+        }
+
+        fun katexCss() = dependencies.single { it.name == "katex" }.let {
+            "${it.baseUrl()}/dist/katex.min.css"
+        }
+
+        fun lunrJs() = dependencies.single { it.name == "lunr" }.let {
+            "${it.baseUrl()}/lunr.min.js"
+        }
+
+        fun lunrLanguagesStemmerJs() = dependencies.single { it.name == "lunr-languages" }.let {
+            "${it.baseUrl()}@${it.version}/min/lunr.stemmer.support.min.js"
+        }
+
+        fun lunrLanguagesJs(language: String) = dependencies.single { it.name == "lunr-languages" }.let {
+            "${it.baseUrl()}/min/lunr.$language.min.js"
+        }
+
+        fun mermaidJs() = dependencies.single { it.name == "mermaid" }.let {
+            "${it.baseUrl()}/dist/mermaid.esm.min.mjs"
+        }
+
+        fun webfontloaderJs() = dependencies.single { it.name == "webfontloader" }.let {
+            "${it.baseUrl()}/webfontloader.js"
+        }
+    }
+
+    @Serializable
+    data class Dependency(val name: String, val version: String) {
+        fun baseUrl() = "$CDN_BASE$name@$version"
+    }
+}

src/main/kotlin/nl/avisi/structurizr/site/generatr/site/views/MarkdownExtension.kt

@@ -20,18 +20,18 @@ fun BODY.markdownAdmonitionScript(viewModel: PageViewModel) {
 
 fun HEAD.katexStylesheet() {
     // loading KaTeX as global on a webpage: https://katex.org/docs/browser.html#loading-as-global
-    unsafe { 
+    unsafe {
         raw("""
-            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-mXD7x5S50Ko38scHSnD4egvoExgMPbrseZorkbE49evAfv9nNcbrXJ8LLNsDgh9d" crossorigin="anonymous">
-        """) 
+            <link rel="stylesheet" href="${CDN.katexCss()}" crossorigin="anonymous">
+        """)
     }
 }
 
 fun HEAD.katexScript() {
     // loading KaTeX as global on a webpage: https://katex.org/docs/browser.html#loading-as-global
-    unsafe { 
+    unsafe {
         raw("""
-            <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-j/ZricySXBnNMJy9meJCtyXTKMhIJ42heyr7oAdxTDBy/CYA9hzpMo+YTNV5C+1X" crossorigin="anonymous"></script>
+            <script defer src="${CDN.katexJs()}" crossorigin="anonymous"></script>
         """)
     }
 }
@@ -50,7 +50,7 @@ fun HEAD.katexFonts() {
                 },
             };
             </script>
-            <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/webfontloader.js" integrity="sha256-4O4pS1SH31ZqrSO2A/2QJTVjTPqVe+jnYgOWUVr7EEc=" crossorigin="anonymous"></script>
+            <script defer src="${CDN.webfontloaderJs()}" crossorigin="anonymous"></script>
         """)
     }
 }
@@ -64,7 +64,7 @@ fun BODY.mermaidScript(viewModel: PageViewModel) {
     // Simple full example, how to include Mermaid: https://mermaid.js.org/config/usage.html#simple-full-example
     script(type = "module") {
         unsafe {
-            raw("import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';")
+            raw("import mermaid from '${CDN.mermaidJs()}';")
         }
     }
-}
+}

src/main/kotlin/nl/avisi/structurizr/site/generatr/site/views/Page.kt

@@ -17,7 +17,7 @@ private fun HTML.headFragment(viewModel: PageViewModel) {
         meta(charset = "utf-8")
         meta(name = "viewport", content = "width=device-width, initial-scale=1")
         title { +viewModel.pageTitle }
-        link(rel = "stylesheet", href = "https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css")
+        link(rel = "stylesheet", href = CDN.bulmaCss())
         link(rel = "stylesheet", href = "../" + "/style.css".asUrlToFile(viewModel.url))
         link(rel = "stylesheet", href = "./" + "/style-branding.css".asUrlToFile(viewModel.url))
 

src/main/kotlin/nl/avisi/structurizr/site/generatr/site/views/SearchPage.kt

@@ -18,16 +18,16 @@ fun HTML.searchPage(viewModel: SearchViewModel) {
             h2 { +viewModel.pageSubTitle }
             script(
                 type = ScriptType.textJavaScript,
-                src = "https://cdn.jsdelivr.net/npm/[email protected]/lunr.min.js"
+                src = CDN.lunrJs()
             ) { }
             script(
                 type = ScriptType.textJavaScript,
-                src = "https://cdn.jsdelivr.net/npm/[email protected]/min/lunr.stemmer.support.min.js"
+                src = CDN.lunrLanguagesStemmerJs()
             ) { }
             if (language.isNotBlank())
                 script(
                     type = ScriptType.textJavaScript,
-                    src = "https://cdn.jsdelivr.net/npm/[email protected]/min/lunr.$language.min.js"
+                    src = CDN.lunrLanguagesJs(language)
                 ) { }
 
             script(type = ScriptType.textJavaScript) {

src/test/kotlin/nl/avisi/structurizr/site/generatr/site/views/CDNTest.kt

@@ -0,0 +1,31 @@
+package nl.avisi.structurizr.site.generatr.site.views
+
+import assertk.all
+import assertk.assertThat
+import assertk.assertions.doesNotContain
+import assertk.assertions.endsWith
+import assertk.assertions.startsWith
+import org.junit.jupiter.api.DynamicTest
+import org.junit.jupiter.api.TestFactory
+
+class CDNTest {
+    @TestFactory
+    fun `cdn locations`() = listOf(
+        CDN.bulmaCss() to "/css/bulma.min.css",
+        CDN.katexJs() to "/dist/katex.min.js",
+        CDN.katexCss() to "/dist/katex.min.css",
+        CDN.lunrJs() to "/lunr.min.js",
+        CDN.lunrLanguagesStemmerJs() to "/min/lunr.stemmer.support.min.js",
+        CDN.lunrLanguagesJs("en") to "/min/lunr.en.min.js",
+        CDN.mermaidJs() to "/dist/mermaid.esm.min.mjs",
+        CDN.webfontloaderJs() to "/webfontloader.js"
+    ).map { (url, suffix) ->
+        DynamicTest.dynamicTest(url) {
+            assertThat(url).all {
+                startsWith("https://")
+                endsWith(suffix)
+                doesNotContain("~", "^", ">", "<", "=", ":=")
+            }
+        }
+    }
+}