fix(win): load window icon from ICO on disk + buffer PNG (1.0.6)

nativeImage from paths inside app.asar often yields empty images on Windows.
Ship icon.ico via extraResources and read with createFromBuffer; setIcon on boot + app windows.

Co-authored-by: Cursor <cursoragent@cursor.com>

.gitea/workflows/release.yml

@@ -67,9 +67,18 @@ jobs:
 
       - run: npm ci
 
-      # Иначе EBADPLATFORM: пакет только для win32, текущий раннер — linux.
+      # Не используем `npm install`: на Linux npm падает с EBADPLATFORM для win32-пакета.
       - name: sharp (@img/sharp-win32-x64) для Windows-артефакта при сборке на Linux
-        run: npm install --no-save --os=win32 --cpu=x64 @img/sharp-win32-x64@0.34.5
+        shell: bash
+        run: |
+          set -euo pipefail
+          tmp="$(mktemp -d)"
+          npm pack @img/sharp-win32-x64@0.34.5 --pack-destination "$tmp"
+          mkdir -p node_modules/@img/sharp-win32-x64
+          tar -xzf "$tmp/img-sharp-win32-x64-0.34.5.tgz" -C "$tmp"
+          cp -a "$tmp/package/." node_modules/@img/sharp-win32-x64/
+          test -f node_modules/@img/sharp-win32-x64/lib/sharp-win32-x64.node
+          rm -rf "$tmp"
 
       - run: npm run build
 

app/main/windows/bootWindow.ts

@@ -4,6 +4,8 @@ import { app, BrowserWindow } from 'electron';
 
 import { getAppSemanticVersion } from '../versionInfo';
 
+import { loadBrandingWindowIcon } from './brandingIcon';
+
 let bootSplashRef: BrowserWindow | null = null;
 
 export function getBootSplashWindow(): BrowserWindow | null {
@@ -37,6 +39,7 @@ function bootWebPreferences(): Electron.WebPreferences {
  * Показывать после `waitForBootWindowReady`.
  */
 export function createBootWindow(): BrowserWindow {
+  const icon = loadBrandingWindowIcon();
   const win = new BrowserWindow({
     width: 440,
     height: 420,
@@ -50,8 +53,16 @@ export function createBootWindow(): BrowserWindow {
     transparent: false,
     backgroundColor: '#09090B',
     roundedCorners: true,
+    ...(icon ? { icon } : {}),
     webPreferences: bootWebPreferences(),
   });
+  if (icon) {
+    try {
+      win.setIcon(icon);
+    } catch {
+      /* ignore */
+    }
+  }
 
   bootSplashRef = win;
   win.once('closed', () => {

app/main/windows/brandingIcon.ts

@@ -0,0 +1,114 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
+import { app, nativeImage } from 'electron';
+
+let resolved = false;
+let cached: Electron.NativeImage | undefined;
+
+/** ICO рядом с exe (вне asar): надёжно для `nativeImage` / панели задач на Windows. */
+function getPackagedBrandingIcoPath(): string | undefined {
+  if (!app.isPackaged) return undefined;
+  const p = path.join(process.resourcesPath, 'branding', 'icon.ico');
+  try {
+    if (fs.existsSync(p)) return p;
+  } catch {
+    /* ignore */
+  }
+  return undefined;
+}
+
+function brandingPngPaths(): string[] {
+  const root = app.getAppPath();
+  const relPack = path.join('dist', 'renderer', 'app-pack-icon.png');
+  const relWindow = path.join('dist', 'renderer', 'app-window-icon.png');
+  const paths: string[] = [];
+  if (app.isPackaged) {
+    const unpacked = path.join(process.resourcesPath, 'app.asar.unpacked');
+    paths.push(path.join(unpacked, relPack), path.join(unpacked, relWindow));
+  }
+  paths.push(
+    path.join(root, relPack),
+    path.join(root, relWindow),
+    path.join(root, 'build', 'icon.png'),
+    path.join(root, 'app', 'renderer', 'public', 'app-window-icon.png'),
+  );
+  return paths;
+}
+
+function tryLoadImageFile(filePath: string): Electron.NativeImage | undefined {
+  try {
+    const buf = fs.readFileSync(filePath);
+    const fromBuf = nativeImage.createFromBuffer(buf);
+    if (!fromBuf.isEmpty()) return fromBuf;
+  } catch {
+    /* ignore */
+  }
+  try {
+    const fromPath = nativeImage.createFromPath(filePath);
+    if (!fromPath.isEmpty()) return fromPath;
+  } catch {
+    /* ignore */
+  }
+  return undefined;
+}
+
+function tryLoadSvgFile(filePath: string): Electron.NativeImage | undefined {
+  try {
+    const fromPath = nativeImage.createFromPath(filePath);
+    if (!fromPath.isEmpty()) return fromPath;
+  } catch {
+    /* ignore */
+  }
+  return undefined;
+}
+
+function tryDarwinSvgPaths(): Electron.NativeImage | undefined {
+  if (process.platform !== 'darwin') return undefined;
+  const root = app.getAppPath();
+  for (const p of [
+    path.join(root, 'dist', 'renderer', 'app-logo.svg'),
+    path.join(root, 'app', 'renderer', 'public', 'app-logo.svg'),
+  ]) {
+    if (!fs.existsSync(p)) continue;
+    const img = tryLoadSvgFile(p);
+    if (img) return img;
+  }
+  return undefined;
+}
+
+/**
+ * Иконка окна / дока. Сначала ICO из `extraResources` (реальный путь на диске), затем PNG
+ * через буфер — `createFromPath` к файлам внутри `app.asar` на Windows часто даёт пустой `NativeImage`.
+ */
+export function loadBrandingWindowIcon(): Electron.NativeImage | undefined {
+  if (resolved) return cached;
+  resolved = true;
+
+  const ico = getPackagedBrandingIcoPath();
+  if (ico) {
+    const img = tryLoadImageFile(ico);
+    if (img) {
+      cached = img;
+      return cached;
+    }
+  }
+
+  for (const p of brandingPngPaths()) {
+    if (!fs.existsSync(p)) continue;
+    const img = tryLoadImageFile(p);
+    if (img) {
+      cached = img;
+      return cached;
+    }
+  }
+
+  const svgIcon = tryDarwinSvgPaths();
+  if (svgIcon) {
+    cached = svgIcon;
+    return cached;
+  }
+
+  cached = undefined;
+  return undefined;
+}

app/main/windows/createWindows.editorClose.test.ts

@@ -22,10 +22,11 @@ void test('createWindows: закрытие редактора завершает
 
 void test('createWindows: иконка окна (pack PNG, затем window PNG; SVG только вне win32)', () => {
   const src = readCreateWindows();
-  assert.ok(src.includes('resolveWindowIconPath'));
+  assert.ok(src.includes('loadBrandingWindowIcon'));
-  assert.ok(src.includes('app-pack-icon.png'));
+  const branding = fs.readFileSync(path.join(here, 'brandingIcon.ts'), 'utf8');
-  assert.ok(src.includes('app-window-icon.png'));
+  assert.ok(branding.includes('app-pack-icon.png'));
-  assert.ok(src.includes('app-logo.svg'));
+  assert.ok(branding.includes('app-window-icon.png'));
+  assert.ok(branding.includes('tryDarwinSvgPaths'));
 });
 
 void test('createWindows: пульт поверх экрана просмотра (дочернее окно)', () => {

app/main/windows/createWindows.ts

@@ -1,11 +1,11 @@
-import fs from 'node:fs';
 import path from 'node:path';
 
-import { app, BrowserWindow, nativeImage, screen } from 'electron';
+import { app, BrowserWindow, screen } from 'electron';
 
 import { ipcChannels } from '../../shared/ipc/contracts';
 
 import { getBootSplashWindow } from './bootWindow';
+import { loadBrandingWindowIcon } from './brandingIcon';
 
 type WindowKind = 'editor' | 'presentation' | 'control';
 
@@ -69,82 +69,15 @@ function getPreloadPath(): string {
   return path.join(app.getAppPath(), 'dist', 'preload', 'index.cjs');
 }
 
-/**
+/** macOS: в Dock — тот же растр, что и у окон (ICO/PNG из brandingIcon). */
- * PNG для иконки окна / дока: тот же растр, что electron-builder берёт из `build/icon.png`
- * (копия в dist после сборки), затем окно 256px, затем dev-пути. SVG не используем для
- * nativeImage на Windows — иначе пустая картинка и дефолтная иконка Electron вместо exe.
- */
-function resolveBrandingPngPaths(): string[] {
-  const root = app.getAppPath();
-  return [
-    path.join(root, 'dist', 'renderer', 'app-pack-icon.png'),
-    path.join(root, 'dist', 'renderer', 'app-window-icon.png'),
-    path.join(root, 'build', 'icon.png'),
-    path.join(root, 'app', 'renderer', 'public', 'app-window-icon.png'),
-  ];
-}
-
-function resolveWindowIconPath(): string | undefined {
-  for (const p of resolveBrandingPngPaths()) {
-    try {
-      if (fs.existsSync(p)) return p;
-    } catch {
-      /* ignore */
-    }
-  }
-  const root = app.getAppPath();
-  const svgFallback = [
-    path.join(root, 'dist', 'renderer', 'app-logo.svg'),
-    path.join(root, 'app', 'renderer', 'public', 'app-logo.svg'),
-  ];
-  for (const p of svgFallback) {
-    try {
-      if (fs.existsSync(p)) return p;
-    } catch {
-      /* ignore */
-    }
-  }
-  return undefined;
-}
-
-function resolveWindowIcon(): Electron.NativeImage | undefined {
-  const tryPath = (filePath: string): Electron.NativeImage | undefined => {
-    try {
-      const img = nativeImage.createFromPath(filePath);
-      if (!img.isEmpty()) return img;
-    } catch {
-      /* ignore */
-    }
-    return undefined;
-  };
-
-  if (process.platform === 'win32' || process.platform === 'linux') {
-    for (const p of resolveBrandingPngPaths()) {
-      if (!fs.existsSync(p)) continue;
-      const img = tryPath(p);
-      if (img) return img;
-    }
-    return undefined;
-  }
-
-  const p = resolveWindowIconPath();
-  if (!p) return undefined;
-  return tryPath(p);
-}
-
-/** macOS: в Dock показываем тот же PNG, что и у упакованного приложения на Windows (иконка exe). */
 export function applyDockIconIfNeeded(): void {
   if (process.platform !== 'darwin' || !app.dock) return;
-  for (const p of resolveBrandingPngPaths()) {
+  const icon = loadBrandingWindowIcon();
-    if (!fs.existsSync(p)) continue;
+  if (!icon || icon.isEmpty()) return;
   try {
-      const img = nativeImage.createFromPath(p);
+    app.dock.setIcon(icon);
-      if (img.isEmpty()) continue;
-      app.dock.setIcon(img);
-      return;
   } catch {
-      /* try next */
+    /* ignore */
-    }
   }
 }
 
@@ -180,7 +113,7 @@ function ensureWindowBecomesVisible(win: BrowserWindow): void {
 
 function createWindow(kind: WindowKind, opts?: CreateWindowOpts): BrowserWindow {
   const deferEditor = kind === 'editor' && opts?.deferVisibility === true;
-  const icon = resolveWindowIcon();
+  const icon = loadBrandingWindowIcon();
   const win = new BrowserWindow({
     width: kind === 'editor' ? 1280 : kind === 'control' ? 1200 : 1280,
     height: 800,
@@ -199,6 +132,13 @@ function createWindow(kind: WindowKind, opts?: CreateWindowOpts): BrowserWindow
       webSecurity: Boolean(process.env.VITE_DEV_SERVER_URL),
     },
   });
+  if (icon) {
+    try {
+      win.setIcon(icon);
+    } catch {
+      /* ignore */
+    }
+  }
 
   win.webContents.on('preload-error', (_event, preloadPath, error) => {
     console.error(`[preload-error] ${preloadPath}:`, error);

app/shared/package.build.test.ts

@@ -12,6 +12,7 @@ void test('package.json: конфиг electron-builder (mac/win)', () => {
       appId: string;
       asar: boolean;
       asarUnpack: string[];
+      extraResources: { from: string; to: string }[];
       mac: { target: unknown };
       files: string[];
     };
@@ -21,6 +22,17 @@ void test('package.json: конфиг electron-builder (mac/win)', () => {
   assert.equal(pkg.build.asar, true, 'релизный артефакт: app.asar без «голого» дерева dist в .app/.exe');
   assert.ok(Array.isArray(pkg.build.asarUnpack));
   assert.ok(pkg.build.asarUnpack.some((p) => p.includes('preload')));
+  assert.ok(Array.isArray(pkg.build.extraResources));
+  assert.ok(
+    pkg.build.extraResources.some(
+      (e: unknown) =>
+        typeof e === 'object' &&
+        e !== null &&
+        'to' in e &&
+        typeof (e as { to: unknown }).to === 'string' &&
+        (e as { to: string }).to.includes('branding'),
+    ),
+  );
   assert.ok(Array.isArray(pkg.build.mac.target));
   assert.ok(pkg.build.files.includes('dist/**/*'));
 });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "DndGamePlayer",
-  "version": "1.0.3",
+  "version": "1.0.6",
   "description": "DNDGamePlayer — редактор и проигрыватель игр",
   "main": "dist/main/index.cjs",
   "scripts": {
@@ -60,6 +60,7 @@
     "javascript-obfuscator": "^4.2.2",
     "patch-package": "^8.0.1",
     "prettier": "^3.8.3",
+    "to-ico": "^1.1.2",
     "tsx": "^4.21.0",
     "typescript": "^6.0.2",
     "typescript-eslint": "^8.58.2",
@@ -75,6 +76,12 @@
       "output": "release",
       "buildResources": "build"
     },
+    "extraResources": [
+      {
+        "from": "build/icon.ico",
+        "to": "branding/icon.ico"
+      }
+    ],
     "files": [
       "dist/**/*",
       "package.json"
@@ -82,6 +89,8 @@
     "asar": true,
     "asarUnpack": [
       "dist/preload/**",
+      "dist/renderer/app-pack-icon.png",
+      "dist/renderer/app-window-icon.png",
       "node_modules/sharp/**",
       "node_modules/@img/**",
       "node_modules/ffmpeg-static/**"
@@ -121,7 +130,7 @@
           ]
         }
       ],
-      "icon": "build/icon.png"
+      "icon": "build/icon.ico"
     },
     "nsis": {
       "oneClick": false,

scripts/gen-window-icon.mjs

@@ -1,5 +1,6 @@
 /**
  * Растеризует app-logo.svg в app-window-icon.png для nativeImage (Windows).
+ * Пишет build/icon.png (macOS / fallback) и build/icon.ico — для exe/NSIS и «Программы и компоненты».
  * Запуск: node scripts/gen-window-icon.mjs
  */
 import fs from 'node:fs';
@@ -7,6 +8,7 @@ import path from 'node:path';
 import { fileURLToPath } from 'node:url';
 
 import { Resvg } from '@resvg/resvg-js';
+import toIco from 'to-ico';
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 const root = path.join(__dirname, '..');
@@ -29,4 +31,18 @@ const resvg512 = new Resvg(svg, {
 });
 const packOut = resvg512.render();
 fs.writeFileSync(packIconPath, packOut.asPng());
-console.log('wrote', packIconPath, packOut.width, 'x', packOut.height, '(electron-builder)');
+console.log('wrote', packIconPath, packOut.width, 'x', packOut.height, '(electron-builder mac / fallback)');
+
+function renderPngForWidth(width) {
+  const r = new Resvg(svg, {
+    fitTo: { mode: 'width', value: width },
+  });
+  return Buffer.from(r.render().asPng());
+}
+
+const icoSizes = [16, 24, 32, 48, 64, 128, 256];
+const icoPngs = icoSizes.map((w) => renderPngForWidth(w));
+const icoBuf = await toIco(icoPngs);
+const icoPath = path.join(buildDir, 'icon.ico');
+fs.writeFileSync(icoPath, icoBuf);
+console.log('wrote', icoPath, '(electron-builder win)');