10dcc2b403
修复画布上传素材持久化回填和项目重进资源元数据恢复 修复图片、音频、视频图层的私有资源换签与视频裸路径回退 修复宣发素材切换模型后卡片尺寸变成1024x1024的问题 修复音视频预览、媒体导出格式、音频默认提示词和前端去背边界 修复角色动作生成在编辑器路径缺少ffprobe时的已知时长兜底 补充图片画布、资源换签、宣发尺寸、媒体导出和chromaKey回归测试 更新图片画布编辑器技术文档
382 lines
11 KiB
TypeScript
382 lines
11 KiB
TypeScript
// @vitest-environment jsdom
|
|
|
|
import { fireEvent, render, screen, waitFor } from '@testing-library/react';
|
|
import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest';
|
|
|
|
import { ResolvedAssetImage } from '../components/ResolvedAssetImage';
|
|
import { useResolvedAssetReadUrl } from './useResolvedAssetReadUrl';
|
|
import {
|
|
clearStoredAccessToken,
|
|
setStoredAccessToken,
|
|
} from '../services/apiClient';
|
|
import { clearSignedAssetReadUrlCache } from '../services/assetReadUrlService';
|
|
|
|
describe('useResolvedAssetReadUrl', () => {
|
|
beforeEach(() => {
|
|
clearSignedAssetReadUrlCache();
|
|
clearStoredAccessToken({ emit: false });
|
|
setStoredAccessToken('test-access-token', { emit: false });
|
|
vi.restoreAllMocks();
|
|
});
|
|
|
|
afterEach(() => {
|
|
clearStoredAccessToken({ emit: false });
|
|
});
|
|
|
|
test('generated 私有资源签名完成前不会把裸路径写入 img', async () => {
|
|
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
|
|
new Response(
|
|
JSON.stringify({
|
|
ok: true,
|
|
data: {
|
|
read: {
|
|
objectKey:
|
|
'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
|
|
signedUrl: 'https://signed.example.com/puzzle.png',
|
|
expiresAt: '2099-01-01T00:10:00Z',
|
|
},
|
|
},
|
|
error: null,
|
|
meta: {
|
|
apiVersion: '2026-06-16',
|
|
routeVersion: '2026-06-16',
|
|
latencyMs: 1,
|
|
timestamp: '2099-01-01T00:00:00Z',
|
|
},
|
|
}),
|
|
{
|
|
status: 200,
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
},
|
|
),
|
|
);
|
|
|
|
render(
|
|
<ResolvedAssetImage
|
|
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
|
|
alt="候选图"
|
|
/>,
|
|
);
|
|
|
|
expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
|
|
|
|
const image = await screen.findByRole('img', { name: '候选图' });
|
|
expect(image.getAttribute('src')).toBe(
|
|
'https://signed.example.com/puzzle.png',
|
|
);
|
|
expect(globalThis.fetch).toHaveBeenCalledTimes(1);
|
|
expect(String(vi.mocked(globalThis.fetch).mock.calls[0]?.[0])).toContain(
|
|
'legacyPublicPath=%2Fgenerated-puzzle-assets%2Fpuzzle-session-1%2Fcandidate-1%2Fasset-1%2Fimage.png',
|
|
);
|
|
});
|
|
|
|
test('显式 objectKey 会通过 objectKey 换签而不是当作普通路径', async () => {
|
|
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
|
|
new Response(
|
|
JSON.stringify({
|
|
ok: true,
|
|
data: {
|
|
read: {
|
|
objectKey: 'oss/editor/private-image.png',
|
|
signedUrl: 'https://signed.example.com/private-image.png',
|
|
expiresAt: '2099-01-01T00:10:00Z',
|
|
},
|
|
},
|
|
error: null,
|
|
meta: {
|
|
apiVersion: '2026-06-16',
|
|
routeVersion: '2026-06-16',
|
|
latencyMs: 1,
|
|
timestamp: '2099-01-01T00:00:00Z',
|
|
},
|
|
}),
|
|
{
|
|
status: 200,
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
},
|
|
),
|
|
);
|
|
|
|
function ObjectKeyProbe() {
|
|
const { resolvedUrl } = useResolvedAssetReadUrl('/legacy/public.png', {
|
|
objectKey: 'oss/editor/private-image.png',
|
|
refreshKey: 'asset-1',
|
|
});
|
|
return <output aria-label="资源地址">{resolvedUrl}</output>;
|
|
}
|
|
|
|
render(<ObjectKeyProbe />);
|
|
|
|
await waitFor(() => {
|
|
expect(screen.getByLabelText('资源地址').textContent).toBe(
|
|
'https://signed.example.com/private-image.png',
|
|
);
|
|
});
|
|
expect(String(vi.mocked(globalThis.fetch).mock.calls[0]?.[0])).toContain(
|
|
'objectKey=oss%2Feditor%2Fprivate-image.png',
|
|
);
|
|
});
|
|
|
|
test('无前导斜杠的 generated 私有资源也不会裸写入 img', async () => {
|
|
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
|
|
new Response(
|
|
JSON.stringify({
|
|
ok: true,
|
|
data: {
|
|
read: {
|
|
objectKey:
|
|
'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
|
|
signedUrl: 'https://signed.example.com/puzzle.png',
|
|
expiresAt: '2099-01-01T00:10:00Z',
|
|
},
|
|
},
|
|
error: null,
|
|
meta: {
|
|
apiVersion: '2026-06-16',
|
|
routeVersion: '2026-06-16',
|
|
latencyMs: 1,
|
|
timestamp: '2099-01-01T00:00:00Z',
|
|
},
|
|
}),
|
|
{
|
|
status: 200,
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
},
|
|
),
|
|
);
|
|
|
|
render(
|
|
<ResolvedAssetImage
|
|
src="generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
|
|
alt="候选图"
|
|
/>,
|
|
);
|
|
|
|
expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
|
|
|
|
const image = await screen.findByRole('img', { name: '候选图' });
|
|
expect(image.getAttribute('src')).toBe(
|
|
'https://signed.example.com/puzzle.png',
|
|
);
|
|
});
|
|
|
|
test('完整 OSS generated 地址也会先换签再写入 img', async () => {
|
|
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
|
|
new Response(
|
|
JSON.stringify({
|
|
ok: true,
|
|
data: {
|
|
read: {
|
|
objectKey:
|
|
'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
|
|
signedUrl: 'https://signed.example.com/puzzle.png',
|
|
expiresAt: '2099-01-01T00:10:00Z',
|
|
},
|
|
},
|
|
error: null,
|
|
meta: {
|
|
apiVersion: '2026-06-16',
|
|
routeVersion: '2026-06-16',
|
|
latencyMs: 1,
|
|
timestamp: '2099-01-01T00:00:00Z',
|
|
},
|
|
}),
|
|
{
|
|
status: 200,
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
},
|
|
),
|
|
);
|
|
|
|
render(
|
|
<ResolvedAssetImage
|
|
src="https://genarrative-release.oss-cn-beijing.aliyuncs.com/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
|
|
alt="候选图"
|
|
/>,
|
|
);
|
|
|
|
expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
|
|
|
|
const image = await screen.findByRole('img', { name: '候选图' });
|
|
expect(image.getAttribute('src')).toBe(
|
|
'https://signed.example.com/puzzle.png',
|
|
);
|
|
expect(String(vi.mocked(globalThis.fetch).mock.calls[0]?.[0])).toContain(
|
|
'legacyPublicPath=%2Fgenerated-puzzle-assets%2Fpuzzle-session-1%2Fcandidate-1%2Fasset-1%2Fimage.png',
|
|
);
|
|
});
|
|
|
|
test('refreshKey changes force a fresh signed url request without mutating OSS signature query', async () => {
|
|
vi.spyOn(globalThis, 'fetch').mockImplementation(
|
|
async () =>
|
|
new Response(
|
|
JSON.stringify({
|
|
ok: true,
|
|
data: {
|
|
read: {
|
|
objectKey:
|
|
'generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png',
|
|
signedUrl: 'https://signed.example.com/puzzle.png',
|
|
expiresAt: '2099-01-01T00:10:00Z',
|
|
},
|
|
},
|
|
error: null,
|
|
meta: {
|
|
apiVersion: '2026-06-16',
|
|
routeVersion: '2026-06-16',
|
|
latencyMs: 1,
|
|
timestamp: '2099-01-01T00:00:00Z',
|
|
},
|
|
}),
|
|
{
|
|
status: 200,
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
},
|
|
),
|
|
);
|
|
|
|
const { rerender } = render(
|
|
<ResolvedAssetImage
|
|
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
|
|
refreshKey="first-version"
|
|
alt="候选图"
|
|
/>,
|
|
);
|
|
|
|
const firstImage = await screen.findByRole('img', { name: '候选图' });
|
|
expect(firstImage.getAttribute('src')).toBe(
|
|
'https://signed.example.com/puzzle.png',
|
|
);
|
|
|
|
rerender(
|
|
<ResolvedAssetImage
|
|
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
|
|
refreshKey="second-version"
|
|
alt="候选图"
|
|
/>,
|
|
);
|
|
|
|
await waitFor(() => {
|
|
expect(globalThis.fetch).toHaveBeenCalledTimes(2);
|
|
});
|
|
expect(
|
|
screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
|
|
).toBe('https://signed.example.com/puzzle.png');
|
|
});
|
|
|
|
test('generated 私有资源签名失败时保持空图像而不是回退裸路径', async () => {
|
|
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
|
|
new Response(
|
|
JSON.stringify({
|
|
ok: false,
|
|
data: null,
|
|
error: {
|
|
code: 'NOT_FOUND',
|
|
message: '对象不存在',
|
|
},
|
|
meta: {
|
|
apiVersion: '2026-06-16',
|
|
routeVersion: '2026-06-16',
|
|
latencyMs: 1,
|
|
timestamp: '2099-01-01T00:00:00Z',
|
|
},
|
|
}),
|
|
{
|
|
status: 400,
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
},
|
|
),
|
|
);
|
|
|
|
render(
|
|
<ResolvedAssetImage
|
|
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
|
|
alt="候选图"
|
|
/>,
|
|
);
|
|
|
|
await waitFor(() => {
|
|
expect(globalThis.fetch).toHaveBeenCalledTimes(1);
|
|
});
|
|
expect(screen.queryByRole('img', { name: '候选图' })).toBeNull();
|
|
});
|
|
|
|
test('generated 私有资源签名失败时可使用显式 fallbackSrc', async () => {
|
|
vi.spyOn(globalThis, 'fetch').mockResolvedValue(
|
|
new Response(
|
|
JSON.stringify({
|
|
ok: false,
|
|
data: null,
|
|
error: {
|
|
code: 'NOT_FOUND',
|
|
message: '对象不存在',
|
|
},
|
|
meta: {
|
|
apiVersion: '2026-06-16',
|
|
routeVersion: '2026-06-16',
|
|
latencyMs: 1,
|
|
timestamp: '2099-01-01T00:00:00Z',
|
|
},
|
|
}),
|
|
{
|
|
status: 400,
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
},
|
|
),
|
|
);
|
|
|
|
render(
|
|
<ResolvedAssetImage
|
|
src="/generated-puzzle-assets/puzzle-session-1/candidate-1/asset-1/image.png"
|
|
fallbackSrc="/creation-type-references/puzzle.webp"
|
|
alt="候选图"
|
|
/>,
|
|
);
|
|
|
|
expect(
|
|
screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
|
|
).toBe('/creation-type-references/puzzle.webp');
|
|
await waitFor(() => {
|
|
expect(globalThis.fetch).toHaveBeenCalledTimes(1);
|
|
});
|
|
expect(
|
|
screen.getByRole('img', { name: '候选图' }).getAttribute('src'),
|
|
).toBe('/creation-type-references/puzzle.webp');
|
|
});
|
|
|
|
test('普通封面加载失败时切换到显式 fallbackSrc', async () => {
|
|
render(
|
|
<ResolvedAssetImage
|
|
src="/covers/missing-cover.webp"
|
|
fallbackSrc="/creation-type-references/puzzle.webp"
|
|
alt="草稿封面"
|
|
/>,
|
|
);
|
|
|
|
const image = screen.getByRole('img', { name: '草稿封面' });
|
|
expect(image.getAttribute('src')).toBe('/covers/missing-cover.webp');
|
|
|
|
fireEvent.error(image);
|
|
|
|
await waitFor(() => {
|
|
expect(
|
|
screen.getByRole('img', { name: '草稿封面' }).getAttribute('src'),
|
|
).toBe('/creation-type-references/puzzle.webp');
|
|
});
|
|
});
|
|
});
|