dsh-arknights-theme 1.0.1 → 1.0.3

package/lib/index.js

@@ -41,6 +41,11 @@ const MIME = new Map([
   ['.webp', 'image/webp'],
   ['.svg', 'image/svg+xml'],
   ['.json', 'application/json; charset=utf-8'],
+  /* Without this entry the stylesheet went out as `application/octet-stream`, and a browser silently
+   * discards a `<link rel="stylesheet">` whose MIME is not `text/css` — so the whole skin was inert
+   * while the file itself was fine and returned 200. Locally the client half masked it by injecting
+   * the same CSS from the bundle; a from-scratch install has no such fallback. Reported in issue #1. */
+  ['.css', 'text/css; charset=utf-8'],
   ['.jpg', 'image/jpeg'],
   ['.jpeg', 'image/jpeg'],
   ['.png', 'image/png'],
@@ -80,20 +85,37 @@ export function apply(ctx) {
    *   * the attribute is set by a blocking inline script, so every rule in the
    *     stylesheet — all of which are scoped to it — is live from the first frame,
    *     and the stylesheet stays inert in a DSH that is not running this skin.
+   *
+   * **The mechanism changed in 1.0.3 because `tapIndex` is not enough any more.** DSH now has a
+   * structured injection table (`webserver/index-inject`): rows are JSON data, and they feed two
+   * renderers — the served index, and the boot payload a static/desktop deployment ships to a
+   * page-side interpreter. `tapIndex` only exists in the first: it is a string transform applied to
+   * a served index body, so on a build that serves a static index it never runs. That is exactly the
+   * report in issue #1 — the asset route registered, the skin attribute read back `null`, and the
+   * page fell through to the stylesheet-less fallback colour. Emitting rows instead makes the same
+   * injection land in both deployments; the client half also sets the attribute as a last resort, so
+   * a third mechanism appearing later cannot silently take the skin down again.
    */
   ctx.effect(() => {
-    const disposeTap = ctx.webServer.tapIndex((html) => {
-      if (html.includes('data-amiya-skin=')) return html
-      const head =
-        '<link rel="stylesheet" href="' +
-        ROUTE +
-        '/assets/skin.css" data-amiya-skin="1">' +
-        '<script data-amiya-skin="1">document.documentElement.setAttribute("data-amiya-skin","1")</script>'
-      return html.includes('</head>')
-        ? html.replace('</head>', head + '</head>')
-        : head + html
-    })
-    return disposeTap
+    const listener = (table) => {
+      table.push(
+        {
+          kind: 'html',
+          placement: 'head',
+          html:
+            '<link rel="stylesheet" href="' +
+            ROUTE +
+            '/assets/skin.css" data-amiya-skin="1">',
+        },
+        {
+          kind: 'script',
+          placement: 'head',
+          text: 'document.documentElement.setAttribute("data-amiya-skin","1")',
+        },
+      )
+    }
+    ctx.on('webserver/index-inject', listener)
+    return () => ctx.off('webserver/index-inject', listener)
   }, 'amiya-wallpaper: index injection')
 
   ctx.effect(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-arknights-theme",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "为《明日方舟》玩家在 DSH Web 上构建沉浸感：12 张整屏壁纸（按画面自适应的边缘虚化）、按每张图解算的玻璃与文字色、罗德岛图标体系，以及签字式的授权与选择交互。 / Building immersion for Arknights players on the DSH Web GUI: twelve full-screen wallpapers with per-image edge blur, glass and ink solved from each picture, Rhodes Island iconography, and sign-off style approval and choice interactions.",
   "type": "module",
   "main": "lib/index.js",