Merge pull request #127 from chainguard-dev/dev

Fix CDN imports, Safari nav, DOM timing, and dev build pipeline

Author: kallewesterling

build-dev.mjs

@@ -0,0 +1,37 @@
+/**
+ * Dev build script — identical to the npm build:css:dev + build:js:dev scripts
+ * but injects the current git commit hash as a banner comment in both outputs
+ * so you can verify which bundle is loaded without checking filenames.
+ *
+ * Usage:  node build-dev.mjs
+ * CI:     set GITHUB_SHA in environment; the first 7 chars are used automatically.
+ */
+
+import { execSync } from "child_process";
+import { readFileSync, writeFileSync } from "fs";
+
+const commit = process.env.GITHUB_SHA
+  ? process.env.GITHUB_SHA.slice(0, 7)
+  : execSync("git rev-parse --short HEAD").toString().trim();
+
+const banner = `/* build: ${commit} */`;
+
+console.log(`Building dev bundle (commit: ${commit})…`);
+
+// Lint (same as build:dev)
+execSync("npm run lint", { stdio: "inherit" });
+
+// CSS
+execSync("npx postcss production/style.css -o dist/bundle.css --map", {
+  stdio: "inherit",
+});
+const css = readFileSync("dist/bundle.css", "utf8");
+writeFileSync("dist/bundle.css", `${banner}\n${css}`);
+
+// JS — esbuild handles the banner natively
+execSync(
+  `npx esbuild production/theme.mjs --bundle --sourcemap --banner:js=${JSON.stringify(banner)} --outfile=dist/bundle.js`,
+  { stdio: "inherit" },
+);
+
+console.log(`Done. Bundle tagged: ${commit}`);

eslint.config.mjs

@@ -9,9 +9,9 @@ export default defineConfig([
   { files: ["**/*.{js,mjs,cjs}"], languageOptions: { globals: globals.browser } },
   { files: ["**/*.{js,mjs,cjs}"], plugins: { js }, extends: ["js/recommended"] },
 
-  // Node.js config files need Node globals (module, require, process, …)
+  // Node.js config and generator scripts need Node globals (module, require, process, …)
   {
-    files: ["*.config.js", "*.config.mjs", "*.config.cjs"],
+    files: ["*.config.js", "*.config.mjs", "*.config.cjs", "generate_*.js", "build-*.mjs"],
     languageOptions: { globals: globals.node },
   },
 

generate_language_file.js

@@ -0,0 +1,58 @@
+#!/usr/bin/env node
+// Scans a folder of course HTML files and writes a sorted JSON array of all
+// Shiki language identifiers found in code blocks to production/data/languages.json.
+//
+// Usage: node generate_language_file.js <path-to-html-folder>
+//
+// Recognises both patterns Skilljar produces:
+//   <pre class="language-terraform"><code data-lang="terraform">
+//   <pre data-lang="terraform"><code>
+
+const { readFileSync, writeFileSync, readdirSync, statSync } = require("fs");
+const { join, extname, resolve } = require("path");
+
+const htmlFolder = process.argv[2];
+
+if (!htmlFolder) {
+  console.error("Usage: node generate_language_file.js <path-to-html-folder>");
+  process.exit(1);
+}
+
+function walkHtml(dir) {
+  const files = [];
+  for (const entry of readdirSync(dir)) {
+    const full = join(dir, entry);
+    if (statSync(full).isDirectory()) {
+      files.push(...walkHtml(full));
+    } else if (extname(entry) === ".html") {
+      files.push(full);
+    }
+  }
+  return files;
+}
+
+const patterns = [
+  /class="language-([^"\s]+)"/g,
+  /data-lang="([^"]+)"/g,
+];
+
+const languages = new Set();
+
+for (const file of walkHtml(resolve(htmlFolder))) {
+  const content = readFileSync(file, "utf-8");
+  for (const re of patterns) {
+    re.lastIndex = 0;
+    let match;
+    while ((match = re.exec(content)) !== null) {
+      languages.add(match[1]);
+    }
+  }
+}
+
+const sorted = [...languages].sort();
+const outputPath = join(__dirname, "production/data/languages.json");
+
+writeFileSync(outputPath, JSON.stringify(sorted, null, 2) + "\n");
+
+console.log(`Found ${sorted.length} language(s): ${sorted.join(", ") || "(none)"}`);
+console.log(`Written to ${outputPath}`);