新增 PlatformUiKit 通用弹窗、按钮、状态、空态、媒体、表单和标签等公共组件 迁移结果页、创作工作台、认证入口、RPG 暗色面板和运行态弹窗的重复 UI chrome 补充组件测试、页面回归测试、技术文档和 Hermes 共享决策记录
74 lines
2.4 KiB
TypeScript
74 lines
2.4 KiB
TypeScript
/* @vitest-environment jsdom */
|
|
|
|
import { render, screen } from '@testing-library/react';
|
|
import { expect, test } from 'vitest';
|
|
|
|
import { PlatformEmptyState } from './PlatformEmptyState';
|
|
|
|
test('renders compact soft platform empty state', () => {
|
|
render(<PlatformEmptyState>暂无作品</PlatformEmptyState>);
|
|
|
|
const emptyState = screen.getByText('暂无作品');
|
|
|
|
expect(emptyState.className).toContain('platform-empty-state');
|
|
expect(emptyState.className).toContain('platform-surface--soft');
|
|
expect(emptyState.className).toContain('rounded-[1.35rem]');
|
|
expect(emptyState.className).toContain('px-4');
|
|
});
|
|
|
|
test('supports dashed panel empty state for picker dialogs', () => {
|
|
render(
|
|
<PlatformEmptyState surface="dashed" size="panel" className="mt-2">
|
|
读取中...
|
|
</PlatformEmptyState>,
|
|
);
|
|
|
|
const emptyState = screen.getByText('读取中...');
|
|
|
|
expect(emptyState.className).toContain('border-dashed');
|
|
expect(emptyState.className).toContain('min-h-[14rem]');
|
|
expect(emptyState.className).toContain('mt-2');
|
|
});
|
|
|
|
test('supports inline subpanel empty state for runtime panels', () => {
|
|
render(
|
|
<PlatformEmptyState surface="subpanel" size="inline">
|
|
暂无历史
|
|
</PlatformEmptyState>,
|
|
);
|
|
|
|
const emptyState = screen.getByText('暂无历史');
|
|
|
|
expect(emptyState.className).toContain('rounded-[1rem]');
|
|
expect(emptyState.className).toContain('bg-white/74');
|
|
expect(emptyState.className).toContain('py-5');
|
|
expect(emptyState.className).toContain('text-[var(--platform-text-soft)]');
|
|
});
|
|
|
|
test('allows explicit tone override', () => {
|
|
render(
|
|
<PlatformEmptyState surface="subpanel" size="inline" tone="base">
|
|
暂无属性
|
|
</PlatformEmptyState>,
|
|
);
|
|
|
|
const emptyState = screen.getByText('暂无属性');
|
|
|
|
expect(emptyState.className).toContain('text-[var(--platform-text-base)]');
|
|
});
|
|
|
|
test('supports dark editor dashed empty state', () => {
|
|
render(
|
|
<PlatformEmptyState surface="editorDark" size="compact" tone="soft">
|
|
还没有配置角色技能。
|
|
</PlatformEmptyState>,
|
|
);
|
|
|
|
const emptyState = screen.getByText('还没有配置角色技能。');
|
|
|
|
expect(emptyState.className).toContain('border-dashed');
|
|
expect(emptyState.className).toContain('border-white/12');
|
|
expect(emptyState.className).toContain('bg-black/20');
|
|
expect(emptyState.className).toContain('text-[var(--platform-text-soft)]');
|
|
});
|