拆分编辑器前端画布视图

抽出素材栏、生成器、舞台工具栏和画布世界视图

补充各拆分视图的聚焦测试

更新 TRACKING.md 记录第三十四阶段验证

src/components/image-editor/ImageCanvasEditGenerationModalView.test.tsx

@@ -0,0 +1,98 @@
+/* @vitest-environment jsdom */
+
+import { fireEvent, render, screen } from '@testing-library/react';
+import { useState } from 'react';
+import { describe, expect, it, vi } from 'vitest';
+
+import type { GenerateDialogState } from './ImageCanvasEditorTypes';
+import { ImageCanvasEditGenerationModalView } from './ImageCanvasEditGenerationModalView';
+
+function createDialog(
+  patch: Partial<GenerateDialogState> = {},
+): GenerateDialogState {
+  return {
+    mode: 'edit',
+    prompt: '旧修改提示',
+    status: 'idle',
+    sourceLayerId: 'layer-a',
+    ...patch,
+  };
+}
+
+function EditGenerationModalHarness({
+  initialDialog = createDialog(),
+  onSubmit = vi.fn(),
+}: {
+  initialDialog?: GenerateDialogState | null;
+  onSubmit?: (dialog: GenerateDialogState) => void;
+}) {
+  const [dialog, setDialog] = useState<GenerateDialogState | null>(
+    initialDialog,
+  );
+
+  return (
+    <div>
+      <ImageCanvasEditGenerationModalView
+        dialog={dialog}
+        setGenerateDialog={setDialog}
+        onSubmit={onSubmit}
+      />
+      <output aria-label="弹窗状态">{dialog ? 'open' : 'closed'}</output>
+      <output aria-label="当前提示词">{dialog?.prompt ?? '-'}</output>
+    </div>
+  );
+}
+
+describe('ImageCanvasEditGenerationModalView', () => {
+  it('updates prompt and submits edit generation', () => {
+    const submitEdit = vi.fn();
+    render(<EditGenerationModalHarness onSubmit={submitEdit} />);
+
+    fireEvent.change(screen.getByLabelText('生成提示词'), {
+      target: { value: '新的修改提示' },
+    });
+    fireEvent.click(screen.getByRole('button', { name: '修改' }));
+
+    expect(screen.getByLabelText('当前提示词').textContent).toBe(
+      '新的修改提示',
+    );
+    expect(submitEdit).toHaveBeenCalledWith(
+      expect.objectContaining({ prompt: '新的修改提示' }),
+    );
+  });
+
+  it('renders failure state and closes through the modal close button', () => {
+    render(
+      <EditGenerationModalHarness
+        initialDialog={createDialog({
+          status: 'failed',
+          errorMessage: '修改失败',
+        })}
+      />,
+    );
+
+    expect(screen.getByRole('alert').textContent).toContain('修改失败');
+
+    fireEvent.click(screen.getByRole('button', { name: '关闭修改图片' }));
+
+    expect(screen.getByLabelText('弹窗状态').textContent).toBe('closed');
+  });
+
+  it('stays hidden for non-edit dialogs and generating edit dialogs', () => {
+    const { rerender } = render(
+      <EditGenerationModalHarness
+        initialDialog={createDialog({ mode: 'generate' })}
+      />,
+    );
+
+    expect(screen.queryByRole('dialog', { name: '修改图片' })).toBeNull();
+
+    rerender(
+      <EditGenerationModalHarness
+        initialDialog={createDialog({ status: 'generating' })}
+      />,
+    );
+
+    expect(screen.queryByRole('dialog', { name: '修改图片' })).toBeNull();
+  });
+});