k88936
6ee33dc561
- 封面使用真实画布尺寸及最终 viewport.x/y/scale。 - 320×240 封面改为居中 cover 裁切，不再从左上角取景。 - 正确绘制画布背景色。 in canva:   in home:   因为原本的布局持久化可能有一些bug，改动不相关，所以我回退到最开始的一版： - 不额外监听画布尺寸变化，给最小尺寸兜底，(大了比小了好) - 封面不要求强一致性，生成/上传时机仍然按照原来随布局持久化 优化了封面生成： - 改用webp格式 - 尽量利用图片缓存 最终生成封面从700ms加速到150ms以内， 加上必须的上传和确认150ms 和 布局持久化的时间相差不多，不是特别离谱的手速都能保证两者一致 --------- Co-authored-by: kdletters <kdletters@qq.com> Reviewed-on: http://192.168.35.82/git/GenarrativeAI/Genarrative/pulls/111 Co-authored-by: 王德宇 <kvtodev@outlook.com> Co-committed-by: 王德宇 <kvtodev@outlook.com>
55 lines
1.6 KiB
TypeScript
55 lines
1.6 KiB
TypeScript
/* @vitest-environment jsdom */
|
|
|
|
import { afterEach, describe, expect, it, vi } from 'vitest';
|
|
|
|
import type { CanvasLayer } from './ImageCanvasEditorTypes';
|
|
import { createProjectCoverSnapshotBlob } from './ImageCanvasProjectCoverSnapshotRenderer';
|
|
|
|
function layer(overrides: Partial<CanvasLayer> = {}): CanvasLayer {
|
|
return {
|
|
id: 'layer-offscreen',
|
|
resourceId: 'resource-offscreen',
|
|
title: '离屏图层',
|
|
src: '/generated/offscreen.webp',
|
|
x: 10_000,
|
|
y: 10_000,
|
|
width: 320,
|
|
height: 240,
|
|
originalWidth: 320,
|
|
originalHeight: 240,
|
|
zIndex: 1,
|
|
sourceType: 'generated',
|
|
...overrides,
|
|
};
|
|
}
|
|
|
|
describe('ImageCanvasProjectCoverSnapshotRenderer', () => {
|
|
afterEach(() => {
|
|
vi.restoreAllMocks();
|
|
});
|
|
|
|
it('exports the canvas background when every drawable layer is outside the cover frame', async () => {
|
|
const fillRect = vi.fn();
|
|
const drawImage = vi.fn();
|
|
vi.spyOn(HTMLCanvasElement.prototype, 'getContext').mockReturnValue({
|
|
fillRect,
|
|
drawImage,
|
|
fillStyle: '',
|
|
} as unknown as CanvasRenderingContext2D);
|
|
vi.spyOn(HTMLCanvasElement.prototype, 'toBlob').mockImplementation(
|
|
(callback) => callback(new Blob(['cover'], { type: 'image/webp' })),
|
|
);
|
|
|
|
const blob = await createProjectCoverSnapshotBlob({
|
|
layers: [layer()],
|
|
viewport: { x: 0, y: 0, scale: 1 },
|
|
viewportSize: { width: 1280, height: 960 },
|
|
backgroundColor: '#f8fafc',
|
|
});
|
|
|
|
expect(blob?.type).toBe('image/webp');
|
|
expect(fillRect).toHaveBeenCalledWith(0, 0, 320, 240);
|
|
expect(drawImage).not.toHaveBeenCalled();
|
|
});
|
|
});
|