图片信息弹窗标题固定为图片信息,不再拼接图片名称 图片信息弹窗移除 Provider 展示行 Task 展示收口为任务标识末尾数字,避免暴露 Provider 字符串 补充图片信息脱敏展示回归测试 更新画板角色形象生成文档中的图片信息展示口径
104 lines
3.5 KiB
TypeScript
104 lines
3.5 KiB
TypeScript
/* @vitest-environment jsdom */
|
|
|
|
import { fireEvent, render, screen, within } from '@testing-library/react';
|
|
import { describe, expect, it, vi } from 'vitest';
|
|
|
|
import type { CanvasLayer } from './ImageCanvasEditorTypes';
|
|
import { ImageCanvasMetadataModalView } from './ImageCanvasMetadataModalView';
|
|
|
|
function createLayer(overrides: Partial<CanvasLayer> = {}): CanvasLayer {
|
|
return {
|
|
id: 'layer-1',
|
|
resourceId: 'resource-1',
|
|
title: '生成主图',
|
|
src: 'data:image/png;base64,layer',
|
|
x: 0,
|
|
y: 0,
|
|
width: 320,
|
|
height: 240,
|
|
originalWidth: 1024,
|
|
originalHeight: 768,
|
|
zIndex: 1,
|
|
sourceType: 'generated',
|
|
...overrides,
|
|
};
|
|
}
|
|
|
|
describe('ImageCanvasMetadataModalView', () => {
|
|
it('renders generated layer metadata with generation inputs and references', () => {
|
|
render(
|
|
<ImageCanvasMetadataModalView
|
|
layer={createLayer({
|
|
model: 'gpt-image-2',
|
|
provider: 'VectorEngine',
|
|
taskId: 'gpt-image-2-task-123',
|
|
objectKey: 'generated/object.png',
|
|
generationInputs: {
|
|
fields: [{ title: '生成提示词', value: '清爽游戏按钮' }],
|
|
references: [
|
|
{
|
|
title: '参考图',
|
|
label: '角色立绘',
|
|
src: 'data:image/png;base64,reference',
|
|
},
|
|
],
|
|
},
|
|
})}
|
|
onClose={vi.fn()}
|
|
/>,
|
|
);
|
|
|
|
const dialog = screen.getByRole('dialog', { name: '图片信息' });
|
|
|
|
expect(within(dialog).queryByText('生成主图')).toBeNull();
|
|
expect(within(dialog).getByText('生成图片')).toBeTruthy();
|
|
expect(within(dialog).getByText('生成提示词')).toBeTruthy();
|
|
expect(within(dialog).getByText('清爽游戏按钮')).toBeTruthy();
|
|
expect(within(dialog).getByText('参考图')).toBeTruthy();
|
|
expect(within(dialog).getByText('角色立绘')).toBeTruthy();
|
|
expect(within(dialog).getByText('gpt-image-2')).toBeTruthy();
|
|
expect(within(dialog).getByText('1024 x 768 px')).toBeTruthy();
|
|
expect(within(dialog).queryByText('Provider')).toBeNull();
|
|
expect(within(dialog).queryByText(/VectorEngine/u)).toBeNull();
|
|
expect(within(dialog).queryByText(/task-/u)).toBeNull();
|
|
expect(within(dialog).getByText('123')).toBeTruthy();
|
|
expect(within(dialog).getByText('generated/object.png')).toBeTruthy();
|
|
});
|
|
|
|
it('renders upload fallback values and closes through the modal shell', () => {
|
|
const onClose = vi.fn();
|
|
render(
|
|
<ImageCanvasMetadataModalView
|
|
layer={createLayer({
|
|
title: '上传素材',
|
|
sourceType: 'uploaded',
|
|
model: null,
|
|
provider: null,
|
|
taskId: null,
|
|
objectKey: null,
|
|
assetObjectId: 'asset-object-1',
|
|
generationInputs: null,
|
|
})}
|
|
onClose={onClose}
|
|
/>,
|
|
);
|
|
|
|
const dialog = screen.getByRole('dialog', { name: '图片信息' });
|
|
|
|
expect(within(dialog).queryByText('上传素材')).toBeNull();
|
|
expect(within(dialog).getByText('上传图片')).toBeTruthy();
|
|
expect(within(dialog).getAllByText('-').length).toBeGreaterThanOrEqual(3);
|
|
expect(within(dialog).getByText('asset-object-1')).toBeTruthy();
|
|
|
|
fireEvent.click(within(dialog).getByRole('button', { name: '关闭图片信息' }));
|
|
|
|
expect(onClose).toHaveBeenCalledTimes(1);
|
|
});
|
|
|
|
it('does not render a dialog when no layer is selected', () => {
|
|
render(<ImageCanvasMetadataModalView layer={null} onClose={vi.fn()} />);
|
|
|
|
expect(screen.queryByRole('dialog', { name: '图片信息' })).toBeNull();
|
|
});
|
|
});
|