Files
Genarrative/apps/ai-game-creator-shell/tests/useProjectResourceCanvasLayout.test.ts
suzmii 532c6d51fd
Project CI / Repository checks (push) Successful in 4m5s
Project CI / Frontend tests (push) Successful in 4m48s
Project CI / Backend tests (push) Successful in 6m6s
Project CI / Native shell tests (push) Successful in 15m24s
完善 Game Agent 资源画布与图片精修生成事务 (#181)
## 背景

本合并请求整合 Game Agent 资源管理的栏目分页自由画布,以及图片持续精修、候选生成和本地恢复事务。

当前远端比较基线:

- base:`master` @ `b00a3f80576949567bf3320f0c6c92b4ed0a649d`
- head:`codex/game-agent-resource-section-pages` @ `5795d2f9b8797c342dcf2920ccefec2a3ff3f472`
- 相对 base:28 commits、33 files(`+3746 / -1333`)

## 主要改动

### 资源管理分页自由画布

- 固定展示“设计文档 → 美术资源 → 音乐音效 → 游戏代码 → 项目版本”五个栏目;空栏目仍可从悬浮 Dock 打开空画布。
- `按依赖` 与 `按类型` 共用栏目分页画布;每个“排序模式 + 栏目”组合独立保存 viewport。
- 普通滚轮使用有界意图队列切换栏目;Ctrl/Meta + 滚轮以指针为锚点缩放;空白拖拽可沿 x/y 无限平移,不以资源 extent 作为导航边界。
- 资源卡支持拖拽布局与一次 CAS 持久化;切页、排序切换和卸载会统一取消拖拽及 pointer capture。
- 资源详情为非模态独立卡片:打开、切换或关闭详情不卸载背景画布、资源卡或依赖连线,也不重置 viewport、搜索或排序状态。
- 顶部已移除“生成视频 / 生成音效 / 生成背景音乐 / 新增 UI 设计”的手动入口;保留播放、未完成编辑恢复、排序和画布复位,以及资源详情中的既有编辑动作。

### 图片持续精修与生成事务

- 图片资源可进入唯一活动精修草稿,支持原生批量导入、图片下方快速编辑卡、候选图层、任务侧栏和“设为最终图”。
- 生成成功只合并候选图层和 generation 权威事实,不以全量 hydrate 覆盖生成期间的本地编辑。
- 候选媒体、图层和公开 generation 记录写入并回读成功后,才推进私有 `candidate-ready`。
- 候选确认接入 Surface 保存 FIFO 与重新打开 hydrate;revision-sensitive 操作等待确认屏障。
- 失败归档和正式图提交采用可恢复中间态,避免中断后出现幽灵任务、重复 revision 或不一致的正式资产。

### 合同与文档

- `acknowledgeCandidateLayers`、`importLocalImages`、`archiveFailedGeneration` 为必选 Host Port;不支持的宿主返回结构化 `unsupported-capability`。
- 同步更新 TypeScript / Rust 合同、Tauri command 可达性、PRD、技术方案与项目共享记忆。
- 明确资源栏目无限画布合同:普通平移不夹取;资源 extent、图片测量、布局变更和 resize 不得重置用户 viewport;仅首次可测量布局与显式复位按真实卡片包围盒适配内容。

## 验证

CI run [#1290](https://git.genarrative.world/git/GenarrativeAI/Genarrative/actions/runs/1290) 针对当前 head 已完成且四项均成功:

- [x] Repository checks
- [x] Frontend tests(235 test files、3166 tests passed;App Surface 410 tests)
- [x] Backend tests
- [x] Native shell tests

另有本地定向检查:

- [x] `npm run agc:typecheck`
- [x] 资源画布、App Surface、Asset Canvas 与资源实时集成定向回归
- [x] Rust 候选确认、候选中断恢复、失败归档与恢复定向测试
- [x] `cargo fmt --check`
- [x] `npm run check:encoding`
- [x] `git diff --check`

## 评审 provenance

- review #247、#248、#252 都针对旧 head,当前在 Gitea 中均标记为 stale;不将其写作“已处理 #247”或当前 head 的评审结论。
- review #253 针对旧 `5456a1d…` head,提出 PRD 退役入口、共享 pitfalls 的 extent 旧合同和 PR 正文事实更新三项 P2;对应文档已在 `5795d2f…` head 修复并推送。
- 早期由 PR #176 引入的候选持久化、归档、Host Port 与快速编辑卡问题,当前已在 base/head 中具备对应修复,不作为本轮重复阻断项。
- 当前 head 仍需新的、针对最新提交的审批;历史 stale review 不能替代当前 head approval。

## 影响范围

- 修改 AI 游戏创作 App 的资源管理、图片精修、Tauri 本地持久化与恢复语义,以及共享合同和权威文档。
- 会调整本地资源布局、精修 draft 和私有 generation ledger 的状态机。
- 不修改 SpacetimeDB schema,不新增或变更 `/api/external/v1` 路由。

---------

Co-authored-by: kdletters <kdletters@qq.com>
Reviewed-on: http://192.168.35.82/git/GenarrativeAI/Genarrative/pulls/181
Co-authored-by: suzmii <suzmii@qq.com>
Co-committed-by: suzmii <suzmii@qq.com>
2026-08-24 20:42:58 +08:00

1083 lines
35 KiB
TypeScript

// @vitest-environment jsdom
import { act, cleanup, renderHook, waitFor } from '@testing-library/react';
import { afterEach, describe, expect, it, vi } from 'vitest';
import type {
ProjectResourceCanvasLayout,
ProjectResourceCanvasLayoutMode,
ProjectResourceCanvasPosition,
} from '../../../packages/shared/src/contracts/gameCreationApp';
import { GAME_CREATION_RESOURCE_LAYOUT_MAX_SAFE_REVISION } from '../../../packages/shared/src/contracts/gameCreationApp';
import {
RESOURCE_CANVAS_CARD_WIDTH,
RESOURCE_CANVAS_DEPENDENCY_COLUMN_GAP,
type ResourceCanvasItem,
} from '../src/view/project-development/resourceCanvasLayoutModel';
import {
createResourceSignature,
createResourceTopologySignature,
useProjectResourceCanvasLayout,
} from '../src/view/project-development/useProjectResourceCanvasLayout';
const projectId = 'layout-hook-project';
const projectPath = '/tmp/layout-hook-project';
const dependencySlotWidth =
RESOURCE_CANVAS_CARD_WIDTH + RESOURCE_CANVAS_DEPENDENCY_COLUMN_GAP;
function resource(id: string): ResourceCanvasItem {
return {
id,
category: 'document',
subtype: 'agent-result',
label: id,
mediaType: 'text/markdown',
dependencyDepth: 0,
};
}
function persistedLayout(
mode: ProjectResourceCanvasLayoutMode,
revision: number,
positions: ProjectResourceCanvasPosition[],
): ProjectResourceCanvasLayout {
return {
schemaVersion: 'game-creator-resource-layout.v1',
projectId,
mode,
revision,
positions,
updatedAt: revision * 100,
};
}
function position(
resourceId: string,
x: number,
y: number,
): ProjectResourceCanvasPosition {
return {
resourceId,
section: 'document',
x,
y,
manuallyPlaced: true,
};
}
function automaticPosition(
resourceId: string,
x: number,
y: number,
): ProjectResourceCanvasPosition {
return {
...position(resourceId, x, y),
manuallyPlaced: false,
};
}
afterEach(() => {
cleanup();
window.__TAURI__ = undefined;
vi.restoreAllMocks();
});
describe('useProjectResourceCanvasLayout', () => {
it('includes subtype changes in the resource coordination signature', () => {
const original = resource('resource-a');
expect(createResourceSignature([original])).not.toBe(
createResourceSignature([{ ...original, subtype: 'task-artifact' }]),
);
});
it('uses a stable identity-only topology signature', () => {
const topology = {
referenceEdges: [
{ sourceResourceId: 'asset-b', targetResourceId: 'asset-c' },
{ sourceResourceId: 'asset-a', targetResourceId: 'asset-b' },
],
taskFlows: [
{
sourceResourceIds: ['asset-a', 'asset-b'],
targetResourceIds: ['asset-c'],
},
],
};
expect(createResourceTopologySignature(topology)).toBe(
createResourceTopologySignature({
referenceEdges: [...topology.referenceEdges].reverse(),
taskFlows: [
{
sourceResourceIds: ['asset-b', 'asset-a', 'asset-a'],
targetResourceIds: ['asset-c'],
},
],
}),
);
});
it('keeps large topology signatures bounded without using resource labels', () => {
const signature = createResourceTopologySignature({
referenceEdges: Array.from({ length: 4095 }, (_, index) => ({
sourceResourceId: `resource-${index}`,
targetResourceId: `resource-${index + 1}`,
})),
taskFlows: [],
});
expect(signature).toMatch(/^[0-9a-f]{8}:[0-9a-f]{8}:[0-9a-f]{8}$/u);
expect(signature).toHaveLength(26);
});
it('waits for dependency graph initialization before reading or writing layout', async () => {
const updates: ProjectResourceCanvasPosition[][] = [];
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 0, []);
}
if (command === 'update_local_project_resource_canvas_layout') {
const positions = structuredClone(
args?.positions as ProjectResourceCanvasPosition[],
);
updates.push(positions);
return {
status: 'updated',
layout: persistedLayout('dependency', 1, positions),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const shallowResource = resource('resource-a');
const deepResource = { ...shallowResource, dependencyDepth: 2 };
const { result, rerender } = renderHook(
({ initializationReady, resources }) =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources,
initializationReady,
rederiveAutomaticPositions: true,
}),
{
initialProps: {
initializationReady: false,
resources: [shallowResource],
},
},
);
expect(invoke).not.toHaveBeenCalled();
expect(result.current.layout.positions).toEqual([]);
rerender({ initializationReady: true, resources: [deepResource] });
await waitFor(() => expect(updates).toHaveLength(1));
expect(result.current.layout.positions[0]).toMatchObject({
resourceId: 'resource-a',
x: dependencySlotWidth * 2,
manuallyPlaced: false,
});
expect(invoke.mock.calls[0]?.[0]).toBe(
'read_local_project_resource_canvas_layout',
);
});
it('can render an unpersisted fallback after graph failure without becoming settled', () => {
const invoke = vi.fn();
window.__TAURI__ = { core: { invoke } };
const { result } = renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [resource('resource-a')],
initializationReady: false,
renderFallbackWhileBlocked: true,
}),
);
expect(result.current.layout.positions).toEqual([
expect.objectContaining({
resourceId: 'resource-a',
section: 'document',
manuallyPlaced: false,
}),
]);
expect(result.current.ready).toBe(false);
expect(result.current.settled).toBe(false);
expect(invoke).not.toHaveBeenCalled();
});
it('persists distinct automatic columns for dependency depths 0, 1, and 2', async () => {
const updates: ProjectResourceCanvasPosition[][] = [];
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 0, []);
}
if (command === 'update_local_project_resource_canvas_layout') {
const positions = structuredClone(
args?.positions as ProjectResourceCanvasPosition[],
);
updates.push(positions);
return {
status: 'updated',
layout: persistedLayout('dependency', 1, positions),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [
resource('resource-depth-0'),
{ ...resource('resource-depth-1'), dependencyDepth: 1 },
{ ...resource('resource-depth-2'), dependencyDepth: 2 },
],
rederiveAutomaticPositions: true,
}),
);
await waitFor(() => expect(updates).toHaveLength(1));
expect(updates[0]).toEqual(
expect.arrayContaining([
expect.objectContaining({
resourceId: 'resource-depth-0',
x: 0,
y: 0,
manuallyPlaced: false,
}),
expect.objectContaining({
resourceId: 'resource-depth-1',
x: dependencySlotWidth,
y: 0,
manuallyPlaced: false,
}),
expect.objectContaining({
resourceId: 'resource-depth-2',
x: dependencySlotWidth * 2,
y: 0,
manuallyPlaced: false,
}),
]),
);
});
it('rederives automatic dependency positions while preserving manual positions', async () => {
const resourceA = { ...resource('resource-a'), dependencyDepth: 2 };
const resourceB = resource('resource-b');
const updates: ProjectResourceCanvasPosition[][] = [];
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 4, [
automaticPosition('resource-a', 0, 0),
position('resource-b', 600, 40),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
const positions = structuredClone(
args?.positions as ProjectResourceCanvasPosition[],
);
updates.push(positions);
return {
status: 'updated',
layout: persistedLayout('dependency', 5, positions),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const { result } = renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [resourceA, resourceB],
rederiveAutomaticPositions: true,
}),
);
await waitFor(() => expect(updates).toHaveLength(1));
expect(result.current.layout.positions).toEqual(
expect.arrayContaining([
expect.objectContaining({
resourceId: 'resource-a',
x: dependencySlotWidth * 2,
manuallyPlaced: false,
}),
expect.objectContaining({
resourceId: 'resource-b',
x: 600,
y: 40,
manuallyPlaced: true,
}),
]),
);
});
it('rederives automatic positions when topology changes without a depth change', async () => {
const resources = [
resource('resource-a'),
{ ...resource('resource-b'), dependencyDepth: 1 },
{ ...resource('resource-c'), dependencyDepth: 1 },
];
const updates: ProjectResourceCanvasPosition[][] = [];
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 4, [
automaticPosition('resource-a', 0, 0),
automaticPosition('resource-b', 196, 128),
automaticPosition('resource-c', 196, 0),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
const positions = structuredClone(
args?.positions as ProjectResourceCanvasPosition[],
);
updates.push(positions);
return {
status: 'updated' as const,
layout: persistedLayout(
'dependency',
updates.length + 4,
positions,
),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const { rerender } = renderHook(
({ topology }) =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources,
topology,
rederiveAutomaticPositions: true,
}),
{
initialProps: {
topology: {
referenceEdges: [
{
sourceResourceId: 'resource-a',
targetResourceId: 'resource-b',
},
],
taskFlows: [],
},
},
},
);
await waitFor(() => expect(updates).toHaveLength(1));
rerender({
topology: {
referenceEdges: [
{ sourceResourceId: 'resource-a', targetResourceId: 'resource-c' },
],
taskFlows: [],
},
});
await waitFor(() => expect(updates).toHaveLength(2));
expect(
updates[1]?.find(({ resourceId }) => resourceId === 'resource-c'),
).toMatchObject({ x: dependencySlotWidth, y: 0, manuallyPlaced: false });
});
it('rejects an unsafe revision from the initial IPC read without writing', async () => {
const resourceA = resource('resource-a');
const invoke = vi.fn(async (command: string) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout(
'dependency',
GAME_CREATION_RESOURCE_LAYOUT_MAX_SAFE_REVISION + 1,
[position('resource-a', 10, 20)],
);
}
throw new Error(`unexpected invoke ${command}`);
});
window.__TAURI__ = { core: { invoke } };
const { result } = renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [resourceA],
}),
);
await waitFor(() =>
expect(result.current.notice).toBe('布局读取失败,已使用当前会话布局'),
);
expect(
invoke.mock.calls.filter(
([command]) =>
command === 'update_local_project_resource_canvas_layout',
),
).toHaveLength(0);
});
it('rejects an unsafe revision from an update response and restores the trusted layout', async () => {
const resourceA = resource('resource-a');
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 1, [
position('resource-a', 10, 20),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
return {
status: 'updated',
layout: persistedLayout(
'dependency',
GAME_CREATION_RESOURCE_LAYOUT_MAX_SAFE_REVISION + 1,
structuredClone(
args?.positions as ProjectResourceCanvasPosition[],
),
),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const { result } = renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [resourceA],
}),
);
await waitFor(() => expect(result.current.layout.positions[0]?.x).toBe(10));
act(() => result.current.commitPosition('resource-a', 'document', 100, 30));
await waitFor(() =>
expect(result.current.notice).toBe('布局保存失败,已恢复上次布局'),
);
expect(result.current.layout.positions[0]).toMatchObject({ x: 10, y: 20 });
expect(result.current.saving).toBe(false);
});
it('keeps the initial layout read and coordinates the latest resources in the same scope', async () => {
const resourceA = resource('resource-a');
const resourceB = resource('resource-b');
const resolveReads: Array<(layout: ProjectResourceCanvasLayout) => void> =
[];
const updates: Array<{
expectedProjectId: string;
expectedRevision: number;
positions: ProjectResourceCanvasPosition[];
}> = [];
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return await new Promise<ProjectResourceCanvasLayout>((resolve) => {
resolveReads.push(resolve);
});
}
if (command === 'update_local_project_resource_canvas_layout') {
const input = args as {
expectedProjectId: string;
expectedRevision: number;
positions: ProjectResourceCanvasPosition[];
};
updates.push(structuredClone(input));
return {
status: 'updated',
layout: persistedLayout(
'dependency',
input.expectedRevision + 1,
structuredClone(input.positions),
),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const { result, rerender } = renderHook(
({ resources }: { resources: ResourceCanvasItem[] }) =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources,
}),
{ initialProps: { resources: [resourceA] } },
);
await waitFor(() => expect(resolveReads).toHaveLength(1));
rerender({ resources: [resourceA, resourceB] });
await act(async () => {
resolveReads[0]?.(
persistedLayout('dependency', 1, [position('resource-a', 10, 20)]),
);
await Promise.resolve();
});
await waitFor(() => expect(updates).toHaveLength(1));
expect(
result.current.layout.positions.map(({ resourceId }) => resourceId),
).toEqual(expect.arrayContaining(['resource-a', 'resource-b']));
expect(updates[0]?.expectedRevision).toBe(1);
expect(updates[0]?.expectedProjectId).toBe(projectId);
expect(
updates[0]?.positions.some(
({ resourceId }) => resourceId === 'resource-b',
),
).toBe(true);
expect(
invoke.mock.calls.filter(
([command]) => command === 'read_local_project_resource_canvas_layout',
),
).toHaveLength(1);
});
it('keeps an in-flight manual CAS ahead of resource coordination in the same scope', async () => {
const resourceA = resource('resource-a');
const resourceB = resource('resource-b');
const updates: Array<{
expectedRevision: number;
positions: ProjectResourceCanvasPosition[];
}> = [];
let resolveFirstUpdate:
| ((result: {
status: 'updated' | 'conflict';
layout: ProjectResourceCanvasLayout;
}) => void)
| null = null;
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 1, [
position('resource-a', 10, 20),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
const input = args as {
expectedRevision: number;
positions: ProjectResourceCanvasPosition[];
};
updates.push(structuredClone(input));
if (updates.length === 1) {
return await new Promise((resolve) => {
resolveFirstUpdate = resolve;
});
}
return {
status: 'updated',
layout: persistedLayout(
'dependency',
input.expectedRevision + 1,
structuredClone(input.positions),
),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const { result, rerender } = renderHook(
({ resources }: { resources: ResourceCanvasItem[] }) =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources,
}),
{ initialProps: { resources: [resourceA] } },
);
await waitFor(() => expect(result.current.layout.positions[0]?.x).toBe(10));
act(() => result.current.commitPosition('resource-a', 'document', 100, 30));
await waitFor(() => expect(updates).toHaveLength(1));
rerender({ resources: [resourceA, resourceB] });
await waitFor(() =>
expect(
result.current.layout.positions.some(
({ resourceId }) => resourceId === 'resource-b',
),
).toBe(true),
);
expect(updates).toHaveLength(1);
await act(async () => {
resolveFirstUpdate?.({
status: 'updated',
layout: persistedLayout(
'dependency',
2,
structuredClone(updates[0]!.positions),
),
});
await Promise.resolve();
});
await waitFor(() => expect(updates).toHaveLength(2));
expect(updates.map(({ expectedRevision }) => expectedRevision)).toEqual([
1, 2,
]);
expect(
updates[1]?.positions.some(
({ resourceId }) => resourceId === 'resource-b',
),
).toBe(true);
expect(result.current.layout.positions).toEqual(
expect.arrayContaining([
expect.objectContaining({ resourceId: 'resource-a', x: 100, y: 30 }),
expect.objectContaining({ resourceId: 'resource-b' }),
]),
);
});
it('coalesces repeated queued manual placements for the same resource behind an in-flight CAS', async () => {
const resourceA = resource('resource-a');
const updates: Array<{
expectedRevision: number;
positions: ProjectResourceCanvasPosition[];
}> = [];
let resolveFirstUpdate:
| ((result: {
status: 'updated';
layout: ProjectResourceCanvasLayout;
}) => void)
| null = null;
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 1, [
position('resource-a', 10, 20),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
const input = args as {
expectedRevision: number;
positions: ProjectResourceCanvasPosition[];
};
updates.push(structuredClone(input));
if (updates.length === 1) {
return await new Promise((resolve) => {
resolveFirstUpdate = resolve;
});
}
return {
status: 'updated',
layout: persistedLayout(
'dependency',
input.expectedRevision + 1,
structuredClone(input.positions),
),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const { result } = renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [resourceA],
}),
);
await waitFor(() => expect(result.current.layout.positions[0]?.x).toBe(10));
act(() => result.current.commitPosition('resource-a', 'document', 100, 30));
await waitFor(() => expect(updates).toHaveLength(1));
act(() => {
for (let x = 200; x < 300; x += 1) {
result.current.commitPosition('resource-a', 'document', x, 40);
}
});
expect(updates).toHaveLength(1);
expect(result.current.layout.positions[0]?.x).toBe(299);
await act(async () => {
resolveFirstUpdate?.({
status: 'updated',
layout: persistedLayout(
'dependency',
2,
structuredClone(updates[0]!.positions),
),
});
await Promise.resolve();
});
await waitFor(() => expect(updates).toHaveLength(2));
expect(updates.map(({ expectedRevision }) => expectedRevision)).toEqual([
1, 2,
]);
expect(updates[1]?.positions[0]?.x).toBe(299);
await waitFor(() => expect(result.current.saving).toBe(false));
});
it('drops manual intents queued behind a CAS conflict', async () => {
const resourceA = resource('resource-a');
let updateCalls = 0;
let resolveUpdate:
| ((result: {
status: 'conflict';
layout: ProjectResourceCanvasLayout;
}) => void)
| null = null;
const invoke = vi.fn(async (command: string) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 1, [
position('resource-a', 10, 20),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
updateCalls += 1;
return await new Promise((resolve) => {
resolveUpdate = resolve;
});
}
throw new Error(`unexpected invoke ${command}`);
});
window.__TAURI__ = { core: { invoke } };
const { result } = renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [resourceA],
}),
);
await waitFor(() => expect(result.current.layout.positions[0]?.x).toBe(10));
act(() => {
result.current.commitPosition('resource-a', 'document', 100, 30);
result.current.commitPosition('resource-a', 'document', 220, 40);
});
await waitFor(() => expect(updateCalls).toBe(1));
await act(async () => {
resolveUpdate?.({
status: 'conflict',
layout: persistedLayout('dependency', 2, [
position('resource-a', 400, 80),
]),
});
await Promise.resolve();
});
await waitFor(() => {
expect(result.current.layout.positions[0]).toMatchObject({
x: 400,
y: 80,
});
expect(result.current.saving).toBe(false);
});
expect(result.current.notice).toBe('布局已在其他窗口更新');
expect(updateCalls).toBe(1);
});
it('keeps the manual conflict notice when resource reconciliation drops a queued manual intent and retries', async () => {
const resourceA = resource('resource-a');
const resourceB = resource('resource-b');
const updates: Array<{
expectedRevision: number;
positions: ProjectResourceCanvasPosition[];
}> = [];
let resolveResourceSync:
| ((result: {
status: 'conflict';
layout: ProjectResourceCanvasLayout;
}) => void)
| null = null;
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 1, [
position('resource-a', 10, 20),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
const input = args as {
expectedRevision: number;
positions: ProjectResourceCanvasPosition[];
};
updates.push(structuredClone(input));
if (updates.length === 1) {
return await new Promise((resolve) => {
resolveResourceSync = resolve;
});
}
return {
status: 'updated',
layout: persistedLayout(
'dependency',
input.expectedRevision + 1,
structuredClone(input.positions),
),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const setTimeoutSpy = vi.spyOn(window, 'setTimeout');
const { result } = renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [resourceA, resourceB],
}),
);
await waitFor(() => expect(updates).toHaveLength(1));
act(() => result.current.commitPosition('resource-a', 'document', 100, 30));
expect(result.current.layout.positions).toEqual(
expect.arrayContaining([
expect.objectContaining({ resourceId: 'resource-a', x: 100, y: 30 }),
]),
);
expect(updates).toHaveLength(1);
await act(async () => {
resolveResourceSync?.({
status: 'conflict',
layout: persistedLayout('dependency', 2, [
position('resource-a', 400, 80),
]),
});
await Promise.resolve();
});
await waitFor(() => expect(updates).toHaveLength(2));
await waitFor(() => expect(result.current.saving).toBe(false));
expect(updates.map(({ expectedRevision }) => expectedRevision)).toEqual([
1, 2,
]);
expect(updates[1]?.positions).toEqual(
expect.arrayContaining([
expect.objectContaining({ resourceId: 'resource-a', x: 400, y: 80 }),
expect.objectContaining({ resourceId: 'resource-b' }),
]),
);
expect(updates[1]?.positions).not.toEqual(
expect.arrayContaining([
expect.objectContaining({ resourceId: 'resource-a', x: 100, y: 30 }),
]),
);
expect(result.current.layout.positions).toEqual(
expect.arrayContaining([
expect.objectContaining({ resourceId: 'resource-a', x: 400, y: 80 }),
]),
);
expect(result.current.notice).toBe('布局已在其他窗口更新');
expect(setTimeoutSpy.mock.calls.some(([, delay]) => delay === 2400)).toBe(
false,
);
act(() => result.current.commitPosition('resource-a', 'document', 500, 90));
await waitFor(() => expect(updates).toHaveLength(3));
await waitFor(() => expect(result.current.notice).toBe('布局已保存'));
expect(setTimeoutSpy.mock.calls.some(([, delay]) => delay === 2400)).toBe(
true,
);
expect(updates[2]?.expectedRevision).toBe(3);
expect(updates[2]?.positions).toEqual(
expect.arrayContaining([
expect.objectContaining({ resourceId: 'resource-a', x: 500, y: 90 }),
]),
);
});
it('ignores a late read from the previous mode', async () => {
const resourceA = resource('resource-a');
const readResolvers = new Map<
ProjectResourceCanvasLayoutMode,
(layout: ProjectResourceCanvasLayout) => void
>();
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command !== 'read_local_project_resource_canvas_layout') {
throw new Error(`unexpected invoke ${command}`);
}
const mode = args?.mode as ProjectResourceCanvasLayoutMode;
return await new Promise<ProjectResourceCanvasLayout>((resolve) => {
readResolvers.set(mode, resolve);
});
},
);
window.__TAURI__ = { core: { invoke } };
const { result, rerender } = renderHook(
({ mode }: { mode: ProjectResourceCanvasLayoutMode }) =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode,
resources: [resourceA],
}),
{ initialProps: { mode: 'dependency' as const } },
);
await waitFor(() => expect(readResolvers.has('dependency')).toBe(true));
rerender({ mode: 'type' });
await waitFor(() => expect(readResolvers.has('type')).toBe(true));
await act(async () => {
readResolvers.get('type')?.(
persistedLayout('type', 5, [position('resource-a', 200, 50)]),
);
await Promise.resolve();
});
await waitFor(() => expect(result.current.layout.mode).toBe('type'));
await act(async () => {
readResolvers.get('dependency')?.(
persistedLayout('dependency', 4, [position('resource-a', 10, 20)]),
);
await Promise.resolve();
});
expect(result.current.layout.mode).toBe('type');
expect(result.current.layout.positions[0]).toMatchObject({ x: 200, y: 50 });
});
it('does not let a stuck old-scope write block the new scope queue', async () => {
const resourceA = resource('resource-a');
const updates: Array<{
mode: ProjectResourceCanvasLayoutMode;
expectedRevision: number;
}> = [];
let resolveDependencyUpdate:
| ((result: {
status: 'updated';
layout: ProjectResourceCanvasLayout;
}) => void)
| null = null;
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
const mode = args?.mode as ProjectResourceCanvasLayoutMode;
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout(mode, mode === 'dependency' ? 1 : 5, [
position('resource-a', mode === 'dependency' ? 10 : 200, 20),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
const expectedRevision = args?.expectedRevision as number;
updates.push({ mode, expectedRevision });
if (mode === 'dependency') {
return await new Promise((resolve) => {
resolveDependencyUpdate = resolve;
});
}
return {
status: 'updated',
layout: persistedLayout(mode, expectedRevision + 1, [
position('resource-a', 300, 40),
]),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const { result, rerender } = renderHook(
({ mode }: { mode: ProjectResourceCanvasLayoutMode }) =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode,
resources: [resourceA],
}),
{ initialProps: { mode: 'dependency' as const } },
);
await waitFor(() => expect(result.current.layout.positions[0]?.x).toBe(10));
act(() => result.current.commitPosition('resource-a', 'document', 100, 30));
await waitFor(() => expect(updates).toHaveLength(1));
rerender({ mode: 'type' });
await waitFor(() => expect(result.current.layout.mode).toBe('type'));
act(() => result.current.commitPosition('resource-a', 'document', 300, 40));
await waitFor(() => expect(updates).toHaveLength(2));
expect(updates[1]).toEqual({ mode: 'type', expectedRevision: 5 });
await waitFor(() => expect(result.current.saving).toBe(false));
expect(result.current.layout.mode).toBe('type');
expect(result.current.layout.positions[0]?.x).toBe(300);
await act(async () => {
resolveDependencyUpdate?.({
status: 'updated',
layout: persistedLayout('dependency', 2, [
position('resource-a', 100, 30),
]),
});
await Promise.resolve();
});
expect(updates).toHaveLength(2);
expect(result.current.layout.mode).toBe('type');
expect(result.current.layout.positions[0]?.x).toBe(300);
});
it('bounds automatic resource reconciliation retries under repeated CAS conflicts', async () => {
const resourceA = resource('resource-a');
const resourceB = resource('resource-b');
const expectedRevisions: number[] = [];
const invoke = vi.fn(
async (command: string, args?: Record<string, unknown>) => {
if (command === 'read_local_project_resource_canvas_layout') {
return persistedLayout('dependency', 1, [
position('resource-a', 10, 20),
]);
}
if (command === 'update_local_project_resource_canvas_layout') {
const expectedRevision = args?.expectedRevision as number;
expectedRevisions.push(expectedRevision);
return {
status: 'conflict',
layout: persistedLayout('dependency', expectedRevision + 1, [
position('resource-a', 10, 20),
]),
};
}
throw new Error(`unexpected invoke ${command}`);
},
);
window.__TAURI__ = { core: { invoke } };
const { result } = renderHook(() =>
useProjectResourceCanvasLayout({
projectPath,
projectId,
mode: 'dependency',
resources: [resourceA, resourceB],
}),
);
await waitFor(() => expect(expectedRevisions).toHaveLength(3));
await waitFor(() => expect(result.current.saving).toBe(false));
expect(expectedRevisions).toEqual([1, 2, 3]);
expect(result.current.notice).toBe('布局已在其他窗口更新');
expect(
result.current.layout.positions.some(
({ resourceId }) => resourceId === 'resource-b',
),
).toBe(true);
});
});