From f653a6eb79d5bca37f5509510fa28559f2f992f0 Mon Sep 17 00:00:00 2001
From: Syngnat <yangguofeng919@gmail.com>
Date: Fri, 29 May 2026 14:44:39 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=85=20test(font):=20=E8=A1=A5=E9=BD=90?=
 =?UTF-8?q?=E5=AD=97=E4=BD=93=E9=85=8D=E7=BD=AE=E4=B8=8E=E6=96=B0=E7=89=88?=
 =?UTF-8?q?=E6=8E=92=E7=89=88=E5=9B=9E=E5=BD=92=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 增加字体配置能力相关断言，覆盖字体变量发布、字体列表加载与搜索匹配入口
- 新增 Monaco 排版测试，校验新版界面下代码编辑器和数据编辑器的字体与字号回归
- 保持快捷操作与外观设置的关键文案、结构和字体落点可回归验证
---
 frontend/src/App.tool-center.test.ts          |  5 +-
 .../MonacoEditor.typography.test.tsx          | 90 +++++++++++++++++++
 2 files changed, 93 insertions(+), 2 deletions(-)
 create mode 100644 frontend/src/components/MonacoEditor.typography.test.tsx

diff --git a/frontend/src/App.tool-center.test.ts b/frontend/src/App.tool-center.test.ts
index 4bfe799..d46f4e8 100644
--- a/frontend/src/App.tool-center.test.ts
+++ b/frontend/src/App.tool-center.test.ts
@@ -112,8 +112,9 @@ describe('tool center menu entries', () => {
     expect(appSource).toContain('ghostRef.current.style.left = `${startGuideLeft + (newWidth - startWidth)}px`;');
   });
 
-  it('mounts heavyweight modals only while they are open', () => {
-    expect(appSource).toContain('{isModalOpen && (');
+  it('keeps connection modal warm-mounted while leaving the other heavyweight modals conditional', () => {
+    expect(appSource).toContain('const [isConnectionModalMounted, setIsConnectionModalMounted] = useState(false);');
+    expect(appSource).toContain('{isConnectionModalMounted && (');
     expect(appSource).toContain('{isToolsModalOpen && (');
     expect(appSource).toContain('{isSettingsModalOpen && (');
     expect(appSource).toContain('{isThemeModalOpen && (');
diff --git a/frontend/src/components/MonacoEditor.typography.test.tsx b/frontend/src/components/MonacoEditor.typography.test.tsx
new file mode 100644
index 0000000..dc8a475
--- /dev/null
+++ b/frontend/src/components/MonacoEditor.typography.test.tsx
@@ -0,0 +1,90 @@
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+import MonacoEditor from './MonacoEditor';
+
+const storeState = vi.hoisted(() => ({
+  fontSize: 14,
+    appearance: {
+      enabled: true,
+      opacity: 1,
+      blur: 0,
+      uiVersion: 'v2' as 'legacy' | 'v2',
+      customUIFontFamily: null as string | null,
+      customMonoFontFamily: null as string | null,
+      showDataTableVerticalBorders: false,
+      dataTableDensity: 'comfortable' as const,
+      dataTableFontSize: null as number | null,
+    dataTableFontSizeFollowGlobal: true,
+    sidebarTreeFontSize: null as number | null,
+    sidebarTreeFontSizeFollowGlobal: true,
+  },
+}));
+
+vi.mock('../store', () => ({
+  useStore: (selector: (state: typeof storeState) => any) => selector(storeState),
+}));
+
+vi.mock('@monaco-editor/react', () => ({
+  loader: { config: vi.fn() },
+  default: ({ options }: { options?: Record<string, unknown> }) => (
+    <div data-monaco-options={JSON.stringify(options || {})} />
+  ),
+}));
+
+describe('MonacoEditor typography', () => {
+  beforeEach(() => {
+    storeState.fontSize = 14;
+    storeState.appearance = {
+      enabled: true,
+      opacity: 1,
+      blur: 0,
+      uiVersion: 'v2',
+      customUIFontFamily: null,
+      customMonoFontFamily: null,
+      showDataTableVerticalBorders: false,
+      dataTableDensity: 'comfortable',
+      dataTableFontSize: null,
+      dataTableFontSizeFollowGlobal: true,
+      sidebarTreeFontSize: null,
+      sidebarTreeFontSizeFollowGlobal: true,
+    };
+  });
+
+  it('injects v2 code-editor typography when font settings are not explicitly provided', () => {
+    const markup = renderToStaticMarkup(
+      <MonacoEditor options={{ minimap: { enabled: false } }} />,
+    );
+
+    expect(markup).toContain('JetBrains Mono');
+    expect(markup).toContain('ui-monospace');
+    expect(markup).toContain('&quot;fontSize&quot;:13');
+    expect(markup).toContain('&quot;lineHeight&quot;:21');
+  });
+
+  it('uses data-table font size for data-oriented editors in v2', () => {
+    storeState.fontSize = 16;
+    storeState.appearance.dataTableFontSizeFollowGlobal = false;
+    storeState.appearance.dataTableFontSize = 15;
+
+    const markup = renderToStaticMarkup(
+      <MonacoEditor gonaviTypography="data" options={{ lineNumbers: 'off' }} />,
+    );
+
+    expect(markup).toContain('&quot;fontSize&quot;:15');
+    expect(markup).toContain('&quot;lineHeight&quot;:24');
+  });
+
+  it('keeps legacy editors on their explicit font settings', () => {
+    storeState.appearance.uiVersion = 'legacy';
+
+    const markup = renderToStaticMarkup(
+      <MonacoEditor options={{ fontFamily: 'Consolas', fontSize: 18 }} />,
+    );
+
+    expect(markup).toContain('&quot;fontFamily&quot;:&quot;Consolas&quot;');
+    expect(markup).toContain('&quot;fontSize&quot;:18');
+    expect(markup).not.toContain('JetBrains Mono');
+  });
+});