menghao
03a4410272
主要工作是共享同一套“画布内核与通用 UI 源码”，网站和 Tauri 只分别实现宿主适配层。 --------- Co-authored-by: 段舒康 <kdletters@qq.com> Co-authored-by: kdletters <kdletters@qq.com> Reviewed-on: http://192.168.35.82/git/GenarrativeAI/Genarrative/pulls/136 Co-authored-by: menghao <mh18530625731@163.com> Co-committed-by: menghao <mh18530625731@163.com>
79 lines
2.5 KiB
TypeScript
79 lines
2.5 KiB
TypeScript
/* @vitest-environment jsdom */
|
|
|
|
import { fireEvent, render, screen } from '@testing-library/react';
|
|
import { Check } from 'lucide-react';
|
|
import { expect, test, vi } from 'vitest';
|
|
|
|
import {
|
|
EditorIconButton,
|
|
SidebarMediaItem,
|
|
} from './ImageCanvasEditorPrimitives';
|
|
|
|
test('editor icon button delegates accessible icon chrome to the shared canvas primitive', () => {
|
|
render(
|
|
<EditorIconButton
|
|
label="素材选择模式"
|
|
title="选择"
|
|
icon={Check}
|
|
className="image-canvas-editor__icon-button"
|
|
pressed
|
|
expanded
|
|
/>,
|
|
);
|
|
|
|
const button = screen.getByRole('button', { name: '素材选择模式' });
|
|
|
|
expect(button.className).toContain('genarrative-image-canvas__chrome-button');
|
|
expect(button.className).toContain('image-canvas-editor__icon-button');
|
|
expect(button.getAttribute('title')).toBe('选择');
|
|
expect(button.getAttribute('aria-pressed')).toBe('true');
|
|
expect(button.getAttribute('aria-expanded')).toBe('true');
|
|
});
|
|
|
|
test('editor icon button forwards shared icon button variants', () => {
|
|
render(
|
|
<EditorIconButton
|
|
label="关闭生成图片"
|
|
title="关闭"
|
|
icon={Check}
|
|
variant="surfaceFloating"
|
|
className="image-canvas-editor__generation-close"
|
|
/>,
|
|
);
|
|
|
|
const button = screen.getByRole('button', { name: '关闭生成图片' });
|
|
|
|
expect(button.className).toContain('bg-white/94');
|
|
expect(button.className).toContain('image-canvas-editor__generation-close');
|
|
});
|
|
|
|
test('sidebar media item delegates thumbnail chrome to the platform media frame', () => {
|
|
const onPrimaryClick = vi.fn();
|
|
render(
|
|
<SidebarMediaItem
|
|
title="拼图素材"
|
|
detail="1024 x 1024"
|
|
imageSrc="data:image/png;base64,one"
|
|
imageAlt="素材：拼图素材"
|
|
primaryLabel="添加拼图素材"
|
|
onPrimaryClick={onPrimaryClick}
|
|
rowClassName="image-canvas-editor__asset-row"
|
|
primaryClassName="image-canvas-editor__asset-button"
|
|
thumbnailClassName="image-canvas-editor__asset-thumb"
|
|
metaClassName="image-canvas-editor__asset-meta"
|
|
/>,
|
|
);
|
|
|
|
const button = screen.getByRole('button', { name: '添加拼图素材' });
|
|
const image = screen.getByRole('img', { name: '素材：拼图素材' });
|
|
const frame = image.closest('.platform-media-frame');
|
|
|
|
expect(frame?.className).toContain('platform-media-frame');
|
|
expect(frame?.className).toContain('image-canvas-editor__asset-thumb');
|
|
expect(screen.getByText('1024 x 1024')).toBeTruthy();
|
|
|
|
fireEvent.click(button);
|
|
|
|
expect(onPrimaryClick).toHaveBeenCalledTimes(1);
|
|
});
|