From 04c75cd725bab200b311d7dfbb44e9ab92552209 Mon Sep 17 00:00:00 2001
From: Ivan Fontosh <ifontosh@it-aces.com>
Date: Thu, 30 Jul 2026 09:10:47 +0800
Subject: [PATCH] fix(npcs): stop TipTap crash black screen in secondary
 windows

Guard TipTap getHTML under StrictMode, wrap secondary window roots in WindowErrorBoundary, and add stability regression tests.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 app/renderer/control/main.tsx                 |  9 ++-
 app/renderer/editor/SceneDescriptionModal.tsx | 55 ++++++++++---
 app/renderer/materials/main.tsx               |  9 ++-
 app/renderer/npcs/NpcDescriptionField.tsx     | 40 ++++++----
 app/renderer/npcs/NpcsEditorApp.tsx           | 29 +++----
 app/renderer/npcs/npcsEditorMain.tsx          |  9 ++-
 app/renderer/npcs/npcsMain.tsx                |  9 ++-
 app/renderer/npcs/tiptapEditorSafe.test.ts    | 38 +++++++++
 app/renderer/npcs/tiptapEditorSafe.ts         | 12 +++
 app/renderer/presentation/main.tsx            |  6 +-
 app/renderer/sceneDescription/main.tsx        |  9 ++-
 app/renderer/sceneEditor/main.tsx             |  9 ++-
 .../shared/ui/WindowErrorBoundary.tsx         | 80 +++++++++++++++++++
 .../ui/secondaryWindows.stability.test.ts     | 53 ++++++++++++
 package.json                                  |  2 +-
 15 files changed, 305 insertions(+), 64 deletions(-)
 create mode 100644 app/renderer/npcs/tiptapEditorSafe.test.ts
 create mode 100644 app/renderer/npcs/tiptapEditorSafe.ts
 create mode 100644 app/renderer/shared/ui/WindowErrorBoundary.tsx
 create mode 100644 app/renderer/shared/ui/secondaryWindows.stability.test.ts

diff --git a/app/renderer/control/main.tsx b/app/renderer/control/main.tsx
index 7cce1ab..e5bea6d 100644
--- a/app/renderer/control/main.tsx
+++ b/app/renderer/control/main.tsx
@@ -3,6 +3,7 @@ import { createRoot } from 'react-dom/client';
 
 import '../shared/ui/globals.css';
 import { EditorI18nProvider } from '../editor/i18n/EditorI18nContext';
+import { WindowErrorBoundary } from '../shared/ui/WindowErrorBoundary';
 
 import { ControlApp } from './ControlApp';
 
@@ -13,8 +14,10 @@ if (!rootEl) {
 
 createRoot(rootEl).render(
   <React.StrictMode>
-    <EditorI18nProvider>
-      <ControlApp />
-    </EditorI18nProvider>
+    <WindowErrorBoundary title="Пульт">
+      <EditorI18nProvider>
+        <ControlApp />
+      </EditorI18nProvider>
+    </WindowErrorBoundary>
   </React.StrictMode>,
 );
diff --git a/app/renderer/editor/SceneDescriptionModal.tsx b/app/renderer/editor/SceneDescriptionModal.tsx
index f3a7926..cb9ee4e 100644
--- a/app/renderer/editor/SceneDescriptionModal.tsx
+++ b/app/renderer/editor/SceneDescriptionModal.tsx
@@ -73,7 +73,7 @@ export function SceneDescriptionModal({ initialHtml, onClose, onSave }: SceneDes
   const editor = useEditor({
     extensions,
     content: initialHtml || '',
-    immediatelyRender: true,
+    immediatelyRender: false,
     shouldRerenderOnTransaction: true,
     editorProps: {
       attributes: {
@@ -94,21 +94,56 @@ export function SceneDescriptionModal({ initialHtml, onClose, onSave }: SceneDes
   const toolbarState = useEditorState({
     editor,
     selector: ({ editor: ed }) => ({
-      bold: ed.isActive('bold'),
-      italic: ed.isActive('italic'),
-      underline: ed.isActive('underline'),
-      bulletList: ed.isActive('bulletList'),
-      orderedList: ed.isActive('orderedList'),
-      h2: ed.isActive('heading', { level: 2 }),
-      h3: ed.isActive('heading', { level: 3 }),
-      blockquote: ed.isActive('blockquote'),
+      bold: Boolean(ed && !ed.isDestroyed && ed.isActive('bold')),
+      italic: Boolean(ed && !ed.isDestroyed && ed.isActive('italic')),
+      underline: Boolean(ed && !ed.isDestroyed && ed.isActive('underline')),
+      bulletList: Boolean(ed && !ed.isDestroyed && ed.isActive('bulletList')),
+      orderedList: Boolean(ed && !ed.isDestroyed && ed.isActive('orderedList')),
+      h2: Boolean(ed && !ed.isDestroyed && ed.isActive('heading', { level: 2 })),
+      h3: Boolean(ed && !ed.isDestroyed && ed.isActive('heading', { level: 3 })),
+      blockquote: Boolean(ed && !ed.isDestroyed && ed.isActive('blockquote')),
     }),
   });
 
   const handleSave = () => {
-    onSave(normalizeSceneDescriptionHtml(editor.getHTML()));
+    if (!editor || editor.isDestroyed) return;
+    let raw = '';
+    try {
+      raw = editor.getHTML();
+    } catch {
+      return;
+    }
+    onSave(normalizeSceneDescriptionHtml(raw));
   };
 
+  if (!editor || editor.isDestroyed) {
+    return createPortal(
+      <>
+        <button
+          type="button"
+          aria-label={t('common.close')}
+          onClick={onClose}
+          className={styles.modalBackdrop}
+        />
+        <div role="dialog" aria-modal="true" className={[styles.modalDialog, modalStyles.dialog].join(' ')}>
+          <div className={styles.modalHeader}>
+            <div className={styles.modalTitle}>{t('scene.descriptionModalTitle')}</div>
+            <button
+              type="button"
+              aria-label={t('common.close')}
+              onClick={onClose}
+              className={styles.modalClose}
+            >
+              ×
+            </button>
+          </div>
+          <div className={modalStyles.editorShell} />
+        </div>
+      </>,
+      document.body,
+    );
+  }
+
   return createPortal(
     <>
       <button
diff --git a/app/renderer/materials/main.tsx b/app/renderer/materials/main.tsx
index 3555638..7715136 100644
--- a/app/renderer/materials/main.tsx
+++ b/app/renderer/materials/main.tsx
@@ -3,6 +3,7 @@ import { createRoot } from 'react-dom/client';
 
 import '../shared/ui/globals.css';
 import { EditorI18nProvider } from '../editor/i18n/EditorI18nContext';
+import { WindowErrorBoundary } from '../shared/ui/WindowErrorBoundary';
 
 import { MaterialsApp } from './MaterialsApp';
 
@@ -13,8 +14,10 @@ if (!rootEl) {
 
 createRoot(rootEl).render(
   <React.StrictMode>
-    <EditorI18nProvider>
-      <MaterialsApp />
-    </EditorI18nProvider>
+    <WindowErrorBoundary title="Материалы">
+      <EditorI18nProvider>
+        <MaterialsApp />
+      </EditorI18nProvider>
+    </WindowErrorBoundary>
   </React.StrictMode>,
 );
diff --git a/app/renderer/npcs/NpcDescriptionField.tsx b/app/renderer/npcs/NpcDescriptionField.tsx
index d3d3b25..f1ead33 100644
--- a/app/renderer/npcs/NpcDescriptionField.tsx
+++ b/app/renderer/npcs/NpcDescriptionField.tsx
@@ -8,6 +8,7 @@ import modalStyles from '../editor/SceneDescriptionModal.module.css';
 import { useEditorI18n } from '../editor/i18n/EditorI18nContext';
 
 import styles from './NpcsEditorApp.module.css';
+import { readTipTapHtmlSafe } from './tiptapEditorSafe';
 
 type NpcDescriptionFieldProps = {
   html: string;
@@ -59,7 +60,8 @@ export function NpcDescriptionField({ html, onCommit }: NpcDescriptionFieldProps
   const editor = useEditor({
     extensions,
     content: html || '',
-    immediatelyRender: true,
+    // StrictMode + true даёт destroy/recreate с null schema → падение getHTML (чёрный экран окна НПС).
+    immediatelyRender: false,
     shouldRerenderOnTransaction: true,
     editorProps: {
       attributes: {
@@ -68,13 +70,17 @@ export function NpcDescriptionField({ html, onCommit }: NpcDescriptionFieldProps
       },
     },
     onBlur: ({ editor: ed }) => {
-      onCommit(normalizeSceneDescriptionHtml(ed.getHTML()));
+      const raw = readTipTapHtmlSafe(ed);
+      if (raw == null) return;
+      onCommit(normalizeSceneDescriptionHtml(raw));
     },
   });
 
   useEffect(() => {
-    if (!editor) return;
-    const current = normalizeSceneDescriptionHtml(editor.getHTML());
+    if (!editor || editor.isDestroyed) return;
+    const raw = readTipTapHtmlSafe(editor);
+    if (raw == null) return;
+    const current = normalizeSceneDescriptionHtml(raw);
     const next = normalizeSceneDescriptionHtml(html);
     if (current !== next) {
       editor.commands.setContent(html || '', { emitUpdate: false });
@@ -84,30 +90,30 @@ export function NpcDescriptionField({ html, onCommit }: NpcDescriptionFieldProps
   const toolbarState = useEditorState({
     editor,
     selector: ({ editor: ed }) => ({
-      bold: ed.isActive('bold'),
-      italic: ed.isActive('italic'),
-      bulletList: ed.isActive('bulletList'),
-      orderedList: ed.isActive('orderedList'),
-      h2: ed.isActive('heading', { level: 2 }),
-      h3: ed.isActive('heading', { level: 3 }),
+      bold: Boolean(ed && !ed.isDestroyed && ed.isActive('bold')),
+      italic: Boolean(ed && !ed.isDestroyed && ed.isActive('italic')),
+      bulletList: Boolean(ed && !ed.isDestroyed && ed.isActive('bulletList')),
+      orderedList: Boolean(ed && !ed.isDestroyed && ed.isActive('orderedList')),
+      h2: Boolean(ed && !ed.isDestroyed && ed.isActive('heading', { level: 2 })),
+      h3: Boolean(ed && !ed.isDestroyed && ed.isActive('heading', { level: 3 })),
     }),
   });
 
-  if (!editor) return null;
+  if (!editor || editor.isDestroyed) return null;
 
   return (
     <div className={styles.descShell}>
       <div className={modalStyles.toolbar}>
         <div className={modalStyles.toolbarGroup}>
           <ToolButton
-            active={toolbarState.bold}
+            active={toolbarState?.bold ?? false}
             title={t('scene.descriptionBold')}
             onClick={() => editor.chain().focus().toggleBold().run()}
           >
             B
           </ToolButton>
           <ToolButton
-            active={toolbarState.italic}
+            active={toolbarState?.italic ?? false}
             title={t('scene.descriptionItalic')}
             onClick={() => editor.chain().focus().toggleItalic().run()}
           >
@@ -117,14 +123,14 @@ export function NpcDescriptionField({ html, onCommit }: NpcDescriptionFieldProps
         <div className={modalStyles.toolbarSep} />
         <div className={modalStyles.toolbarGroup}>
           <ToolButton
-            active={toolbarState.h2}
+            active={toolbarState?.h2 ?? false}
             title={t('scene.descriptionHeading2')}
             onClick={() => editor.chain().focus().toggleHeading({ level: 2 }).run()}
           >
             H2
           </ToolButton>
           <ToolButton
-            active={toolbarState.h3}
+            active={toolbarState?.h3 ?? false}
             title={t('scene.descriptionHeading3')}
             onClick={() => editor.chain().focus().toggleHeading({ level: 3 }).run()}
           >
@@ -134,14 +140,14 @@ export function NpcDescriptionField({ html, onCommit }: NpcDescriptionFieldProps
         <div className={modalStyles.toolbarSep} />
         <div className={modalStyles.toolbarGroup}>
           <ToolButton
-            active={toolbarState.bulletList}
+            active={toolbarState?.bulletList ?? false}
             title={t('scene.descriptionBulletList')}
             onClick={() => editor.chain().focus().toggleBulletList().run()}
           >
             •
           </ToolButton>
           <ToolButton
-            active={toolbarState.orderedList}
+            active={toolbarState?.orderedList ?? false}
             title={t('scene.descriptionOrderedList')}
             onClick={() => editor.chain().focus().toggleOrderedList().run()}
           >
diff --git a/app/renderer/npcs/NpcsEditorApp.tsx b/app/renderer/npcs/NpcsEditorApp.tsx
index 664fef3..b3964f1 100644
--- a/app/renderer/npcs/NpcsEditorApp.tsx
+++ b/app/renderer/npcs/NpcsEditorApp.tsx
@@ -19,6 +19,7 @@ import { Button, Input, Select } from '../shared/ui/controls';
 import { useAssetUrl } from '../shared/useAssetImageUrl';
 
 import { NpcBindingFields } from './NpcBindingFields';
+import { NpcDescriptionField } from './NpcDescriptionField';
 import { NpcEditModal } from './NpcEditModal';
 import type { GraphGroupFilter } from './NpcGraph';
 import { NpcGroupModal } from './NpcGroupModal';
@@ -36,11 +37,6 @@ const NpcGraph = lazy(async () => {
   return { default: mod.NpcGraph };
 });
 
-const NpcDescriptionField = lazy(async () => {
-  const mod = await import('./NpcDescriptionField');
-  return { default: mod.NpcDescriptionField };
-});
-
 const DND_NPC_ID_MIME = 'application/x-dnd-npc-id';
 const DND_NPC_GROUP_ID_MIME = 'application/x-dnd-npc-group-id';
 
@@ -813,18 +809,17 @@ export function NpcsEditorApp() {
 
                 <div>
                   <div className={styles.fieldLabel}>{t('npcs.description')}</div>
-                  <Suspense fallback={<div className={styles.muted}>{t('npcs.savingWait')}</div>}>
-                    <NpcDescriptionField
-                      html={selected.description}
-                      onCommit={(html) => {
-                        if (html === selected.description) return;
-                        void api.invoke(ipcChannels.project.updateNpcFields, {
-                          npcId: selected.id,
-                          description: html,
-                        });
-                      }}
-                    />
-                  </Suspense>
+                  <NpcDescriptionField
+                    key={selected.id}
+                    html={selected.description}
+                    onCommit={(html) => {
+                      if (html === selected.description) return;
+                      void api.invoke(ipcChannels.project.updateNpcFields, {
+                        npcId: selected.id,
+                        description: html,
+                      });
+                    }}
+                  />
                 </div>
 
                 <div>
diff --git a/app/renderer/npcs/npcsEditorMain.tsx b/app/renderer/npcs/npcsEditorMain.tsx
index a660221..9e9b1a6 100644
--- a/app/renderer/npcs/npcsEditorMain.tsx
+++ b/app/renderer/npcs/npcsEditorMain.tsx
@@ -3,6 +3,7 @@ import { createRoot } from 'react-dom/client';
 
 import '../shared/ui/globals.css';
 import { EditorI18nProvider } from '../editor/i18n/EditorI18nContext';
+import { WindowErrorBoundary } from '../shared/ui/WindowErrorBoundary';
 
 import { NpcsEditorApp } from './NpcsEditorApp';
 
@@ -13,8 +14,10 @@ if (!rootEl) {
 
 createRoot(rootEl).render(
   <React.StrictMode>
-    <EditorI18nProvider>
-      <NpcsEditorApp />
-    </EditorI18nProvider>
+    <WindowErrorBoundary title="НПС">
+      <EditorI18nProvider>
+        <NpcsEditorApp />
+      </EditorI18nProvider>
+    </WindowErrorBoundary>
   </React.StrictMode>,
 );
diff --git a/app/renderer/npcs/npcsMain.tsx b/app/renderer/npcs/npcsMain.tsx
index ed95f4f..701496a 100644
--- a/app/renderer/npcs/npcsMain.tsx
+++ b/app/renderer/npcs/npcsMain.tsx
@@ -3,6 +3,7 @@ import { createRoot } from 'react-dom/client';
 
 import '../shared/ui/globals.css';
 import { EditorI18nProvider } from '../editor/i18n/EditorI18nContext';
+import { WindowErrorBoundary } from '../shared/ui/WindowErrorBoundary';
 
 import { NpcsApp } from './NpcsApp';
 
@@ -13,8 +14,10 @@ if (!rootEl) {
 
 createRoot(rootEl).render(
   <React.StrictMode>
-    <EditorI18nProvider>
-      <NpcsApp />
-    </EditorI18nProvider>
+    <WindowErrorBoundary title="НПС">
+      <EditorI18nProvider>
+        <NpcsApp />
+      </EditorI18nProvider>
+    </WindowErrorBoundary>
   </React.StrictMode>,
 );
diff --git a/app/renderer/npcs/tiptapEditorSafe.test.ts b/app/renderer/npcs/tiptapEditorSafe.test.ts
new file mode 100644
index 0000000..cf66f9e
--- /dev/null
+++ b/app/renderer/npcs/tiptapEditorSafe.test.ts
@@ -0,0 +1,38 @@
+import assert from 'node:assert/strict';
+import test from 'node:test';
+
+import { readTipTapHtmlSafe } from './tiptapEditorSafe';
+
+void test('readTipTapHtmlSafe: null / destroyed → null', () => {
+  assert.equal(readTipTapHtmlSafe(null), null);
+  assert.equal(readTipTapHtmlSafe(undefined), null);
+  assert.equal(
+    readTipTapHtmlSafe({
+      isDestroyed: true,
+      getHTML: () => '<p>x</p>',
+    }),
+    null,
+  );
+});
+
+void test('readTipTapHtmlSafe: getHTML throw → null', () => {
+  assert.equal(
+    readTipTapHtmlSafe({
+      isDestroyed: false,
+      getHTML: () => {
+        throw new TypeError("Cannot read properties of null (reading 'cached')");
+      },
+    }),
+    null,
+  );
+});
+
+void test('readTipTapHtmlSafe: ok → html', () => {
+  assert.equal(
+    readTipTapHtmlSafe({
+      isDestroyed: false,
+      getHTML: () => '<p>ok</p>',
+    }),
+    '<p>ok</p>',
+  );
+});
diff --git a/app/renderer/npcs/tiptapEditorSafe.ts b/app/renderer/npcs/tiptapEditorSafe.ts
new file mode 100644
index 0000000..c4cbebc
--- /dev/null
+++ b/app/renderer/npcs/tiptapEditorSafe.ts
@@ -0,0 +1,12 @@
+/** Безопасное чтение HTML из TipTap/ProseMirror (StrictMode / destroy mid-flight). */
+export function readTipTapHtmlSafe(editor: {
+  isDestroyed?: boolean;
+  getHTML: () => string;
+} | null | undefined): string | null {
+  if (!editor || editor.isDestroyed) return null;
+  try {
+    return editor.getHTML();
+  } catch {
+    return null;
+  }
+}
diff --git a/app/renderer/presentation/main.tsx b/app/renderer/presentation/main.tsx
index 792c422..f95cbaa 100644
--- a/app/renderer/presentation/main.tsx
+++ b/app/renderer/presentation/main.tsx
@@ -2,6 +2,8 @@ import React from 'react';
 import { createRoot } from 'react-dom/client';
 
 import '../shared/ui/globals.css';
+import { WindowErrorBoundary } from '../shared/ui/WindowErrorBoundary';
+
 import { PresentationApp } from './PresentationApp';
 
 const rootEl = document.getElementById('root');
@@ -11,6 +13,8 @@ if (!rootEl) {
 
 createRoot(rootEl).render(
   <React.StrictMode>
-    <PresentationApp />
+    <WindowErrorBoundary title="Презентация">
+      <PresentationApp />
+    </WindowErrorBoundary>
   </React.StrictMode>,
 );
diff --git a/app/renderer/sceneDescription/main.tsx b/app/renderer/sceneDescription/main.tsx
index ae4d9fa..78c88f1 100644
--- a/app/renderer/sceneDescription/main.tsx
+++ b/app/renderer/sceneDescription/main.tsx
@@ -3,6 +3,7 @@ import { createRoot } from 'react-dom/client';
 
 import '../shared/ui/globals.css';
 import { EditorI18nProvider } from '../editor/i18n/EditorI18nContext';
+import { WindowErrorBoundary } from '../shared/ui/WindowErrorBoundary';
 
 import { SceneDescriptionApp } from './SceneDescriptionApp';
 
@@ -13,8 +14,10 @@ if (!rootEl) {
 
 createRoot(rootEl).render(
   <React.StrictMode>
-    <EditorI18nProvider>
-      <SceneDescriptionApp />
-    </EditorI18nProvider>
+    <WindowErrorBoundary title="Описание сцены">
+      <EditorI18nProvider>
+        <SceneDescriptionApp />
+      </EditorI18nProvider>
+    </WindowErrorBoundary>
   </React.StrictMode>,
 );
diff --git a/app/renderer/sceneEditor/main.tsx b/app/renderer/sceneEditor/main.tsx
index ebac610..7fe3f9c 100644
--- a/app/renderer/sceneEditor/main.tsx
+++ b/app/renderer/sceneEditor/main.tsx
@@ -3,6 +3,7 @@ import { createRoot } from 'react-dom/client';
 
 import '../shared/ui/globals.css';
 import { EditorI18nProvider } from '../editor/i18n/EditorI18nContext';
+import { WindowErrorBoundary } from '../shared/ui/WindowErrorBoundary';
 
 import { SceneEditorApp } from './SceneEditorApp';
 
@@ -13,8 +14,10 @@ if (!rootEl) {
 
 createRoot(rootEl).render(
   <React.StrictMode>
-    <EditorI18nProvider>
-      <SceneEditorApp />
-    </EditorI18nProvider>
+    <WindowErrorBoundary title="Редактор сцены">
+      <EditorI18nProvider>
+        <SceneEditorApp />
+      </EditorI18nProvider>
+    </WindowErrorBoundary>
   </React.StrictMode>,
 );
diff --git a/app/renderer/shared/ui/WindowErrorBoundary.tsx b/app/renderer/shared/ui/WindowErrorBoundary.tsx
new file mode 100644
index 0000000..fe590d5
--- /dev/null
+++ b/app/renderer/shared/ui/WindowErrorBoundary.tsx
@@ -0,0 +1,80 @@
+import React from 'react';
+
+type WindowErrorBoundaryProps = {
+  title?: string;
+  children: React.ReactNode;
+};
+
+type WindowErrorBoundaryState = {
+  error: Error | null;
+};
+
+/**
+ * Ловит падения React в дочерних окнах (НПС, материалы, редактор сцены…),
+ * чтобы вместо чёрного экрана показать сообщение и кнопку перезагрузки.
+ */
+export class WindowErrorBoundary extends React.Component<
+  WindowErrorBoundaryProps,
+  WindowErrorBoundaryState
+> {
+  state: WindowErrorBoundaryState = { error: null };
+
+  static getDerivedStateFromError(error: Error): WindowErrorBoundaryState {
+    return { error };
+  }
+
+  override componentDidCatch(error: Error, info: React.ErrorInfo): void {
+    console.error('[WindowErrorBoundary]', error, info.componentStack);
+  }
+
+  private handleReload = (): void => {
+    this.setState({ error: null });
+    window.location.reload();
+  };
+
+  override render(): React.ReactNode {
+    if (!this.state.error) return this.props.children;
+
+    const title = this.props.title ?? 'Ошибка окна';
+    const message = this.state.error.message || String(this.state.error);
+
+    return (
+      <div
+        role="alert"
+        style={{
+          height: '100vh',
+          boxSizing: 'border-box',
+          display: 'flex',
+          flexDirection: 'column',
+          alignItems: 'center',
+          justifyContent: 'center',
+          gap: 12,
+          padding: 24,
+          background: '#09090b',
+          color: '#e4e4e7',
+          fontFamily: 'system-ui, sans-serif',
+          textAlign: 'center',
+        }}
+      >
+        <div style={{ fontWeight: 800, fontSize: 16 }}>{title}</div>
+        <div style={{ opacity: 0.85, fontSize: 13, maxWidth: 480, lineHeight: 1.45 }}>{message}</div>
+        <button
+          type="button"
+          onClick={this.handleReload}
+          style={{
+            marginTop: 8,
+            height: 34,
+            padding: '0 14px',
+            borderRadius: 8,
+            border: '1px solid rgba(255,255,255,0.16)',
+            background: '#27272a',
+            color: '#fafafa',
+            cursor: 'pointer',
+          }}
+        >
+          Перезагрузить
+        </button>
+      </div>
+    );
+  }
+}
diff --git a/app/renderer/shared/ui/secondaryWindows.stability.test.ts b/app/renderer/shared/ui/secondaryWindows.stability.test.ts
new file mode 100644
index 0000000..d254f92
--- /dev/null
+++ b/app/renderer/shared/ui/secondaryWindows.stability.test.ts
@@ -0,0 +1,53 @@
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import path from 'node:path';
+import test from 'node:test';
+import { fileURLToPath } from 'node:url';
+
+const here = path.dirname(fileURLToPath(import.meta.url));
+const rendererRoot = path.resolve(here, '../..');
+
+const SECONDARY_WINDOW_MAINS = [
+  'npcs/npcsEditorMain.tsx',
+  'npcs/npcsMain.tsx',
+  'materials/main.tsx',
+  'sceneEditor/main.tsx',
+  'sceneDescription/main.tsx',
+  'control/main.tsx',
+  'presentation/main.tsx',
+] as const;
+
+void test('secondary window mains: WindowErrorBoundary wraps app root', () => {
+  for (const rel of SECONDARY_WINDOW_MAINS) {
+    const src = fs.readFileSync(path.join(rendererRoot, rel), 'utf8');
+    assert.ok(
+      src.includes('WindowErrorBoundary'),
+      `${rel}: must wrap with WindowErrorBoundary to avoid black screen on React crash`,
+    );
+    assert.match(
+      src,
+      /<WindowErrorBoundary[\s\S]*?>[\s\S]*<\/WindowErrorBoundary>/,
+      `${rel}: WindowErrorBoundary must wrap children`,
+    );
+  }
+});
+
+void test('NpcDescriptionField: TipTap StrictMode-safe (no black screen on NPC open)', () => {
+  const src = fs.readFileSync(path.join(rendererRoot, 'npcs/NpcDescriptionField.tsx'), 'utf8');
+  assert.match(src, /immediatelyRender:\s*false/);
+  assert.ok(src.includes('readTipTapHtmlSafe'));
+  assert.ok(src.includes('isDestroyed'));
+  assert.doesNotMatch(src, /immediatelyRender:\s*true/);
+});
+
+void test('NpcsEditorApp: no undefined controlStyles (inspector crash)', () => {
+  const src = fs.readFileSync(path.join(rendererRoot, 'npcs/NpcsEditorApp.tsx'), 'utf8');
+  assert.doesNotMatch(src, /controlStyles/);
+});
+
+void test('WindowErrorBoundary component exists and catches errors', () => {
+  const src = fs.readFileSync(path.join(here, 'WindowErrorBoundary.tsx'), 'utf8');
+  assert.ok(src.includes('getDerivedStateFromError'));
+  assert.ok(src.includes('componentDidCatch'));
+  assert.ok(src.includes('role="alert"'));
+});
diff --git a/package.json b/package.json
index 967bbd6..4ce3565 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,7 @@
     "build:obfuscate": "node scripts/build.mjs --production --obfuscate",
     "lint": "eslint . --max-warnings 0",
     "typecheck": "tsc -p tsconfig.eslint.json --noEmit",
-    "test": "tsx --test app/renderer/shared/ui/controls.tooltip.test.ts app/renderer/editor/state/projectState.race.test.ts app/renderer/editor/fileDrop.test.ts app/shared/graph/sceneListOrder.test.ts app/renderer/editor/graph/sceneCardById.test.ts app/renderer/editor/i18n/editorMessages.locale.test.ts app/renderer/editor/help/helpLinkify.test.ts app/renderer/editor/sceneDescriptionHtml.test.ts app/shared/graph/storylineExportImport.test.ts app/shared/foundry/foundryGraph.test.ts app/shared/ipc/contracts.mediaRemoval.test.ts app/shared/effectEraserHitTest.test.ts app/shared/fieldEffectEraser.test.ts app/renderer/control/controlApp.effectsPanel.test.ts app/renderer/control/controlApp.audioPerf.networkRegression.test.ts app/renderer/control/controlApp.brushPerf.networkRegression.test.ts app/renderer/shared/useAssetImageUrl.cache.test.ts app/main/sessionIpc.phase6.networkRegression.test.ts app/renderer/shared/sceneOverlay/sceneOverlayHost.test.ts app/renderer/shared/effects/PxiEffectsOverlay.pointer.test.ts app/renderer/shared/traps/trapActivation.test.ts app/main/windows/createWindows.editorClose.test.ts app/main/safeConsole.test.ts app/main/windows/bootWindow.test.ts app/main/effects/effectsStore.test.ts app/main/effects/sceneDarknessStore.test.ts app/main/sceneTraps/sceneTrapsStore.test.ts app/main/project/assetPrune.test.ts app/main/project/optimizeImageImport.test.ts app/main/project/scenePreviewThumbnail.test.ts app/main/project/fsRetry.test.ts app/main/project/zipRead.test.ts app/main/project/replaceFileAtomic.test.ts app/main/project/zipStore.legacyContract.test.ts app/shared/package.build.test.ts app/shared/license/canonicalJson.test.ts app/shared/license/productKey.test.ts app/shared/license/licenseService.networkRegression.test.ts app/shared/video/videoPlaybackPerf.networkRegression.test.ts app/shared/video/videoPlaybackLoop.networkRegression.test.ts app/main/license/verifyLicenseToken.test.ts app/main/license/machineFingerprint.test.ts && node --test scripts/build-env.test.mjs scripts/obfuscate-main.test.mjs scripts/release-mac-prep.test.mjs",
+    "test": "tsx --test app/renderer/shared/ui/controls.tooltip.test.ts app/renderer/shared/ui/secondaryWindows.stability.test.ts app/renderer/npcs/tiptapEditorSafe.test.ts app/renderer/editor/state/projectState.race.test.ts app/renderer/editor/fileDrop.test.ts app/shared/graph/sceneListOrder.test.ts app/renderer/editor/graph/sceneCardById.test.ts app/renderer/editor/i18n/editorMessages.locale.test.ts app/renderer/editor/help/helpLinkify.test.ts app/renderer/editor/sceneDescriptionHtml.test.ts app/shared/graph/storylineExportImport.test.ts app/shared/foundry/foundryGraph.test.ts app/shared/ipc/contracts.mediaRemoval.test.ts app/shared/effectEraserHitTest.test.ts app/shared/fieldEffectEraser.test.ts app/renderer/control/controlApp.effectsPanel.test.ts app/renderer/control/controlApp.audioPerf.networkRegression.test.ts app/renderer/control/controlApp.brushPerf.networkRegression.test.ts app/renderer/shared/useAssetImageUrl.cache.test.ts app/main/sessionIpc.phase6.networkRegression.test.ts app/renderer/shared/sceneOverlay/sceneOverlayHost.test.ts app/renderer/shared/effects/PxiEffectsOverlay.pointer.test.ts app/renderer/shared/traps/trapActivation.test.ts app/main/windows/createWindows.editorClose.test.ts app/main/safeConsole.test.ts app/main/windows/bootWindow.test.ts app/main/effects/effectsStore.test.ts app/main/effects/sceneDarknessStore.test.ts app/main/sceneTraps/sceneTrapsStore.test.ts app/main/project/assetPrune.test.ts app/main/project/optimizeImageImport.test.ts app/main/project/scenePreviewThumbnail.test.ts app/main/project/fsRetry.test.ts app/main/project/zipRead.test.ts app/main/project/replaceFileAtomic.test.ts app/main/project/zipStore.legacyContract.test.ts app/shared/package.build.test.ts app/shared/license/canonicalJson.test.ts app/shared/license/productKey.test.ts app/shared/license/licenseService.networkRegression.test.ts app/shared/video/videoPlaybackPerf.networkRegression.test.ts app/shared/video/videoPlaybackLoop.networkRegression.test.ts app/main/license/verifyLicenseToken.test.ts app/main/license/machineFingerprint.test.ts && node --test scripts/build-env.test.mjs scripts/obfuscate-main.test.mjs scripts/release-mac-prep.test.mjs",
     "format": "prettier . --check",
     "format:write": "prettier . --write",
     "postinstall": "patch-package",