新增 PlatformUiKit 通用弹窗、按钮、状态、空态、媒体、表单和标签等公共组件 迁移结果页、创作工作台、认证入口、RPG 暗色面板和运行态弹窗的重复 UI chrome 补充组件测试、页面回归测试、技术文档和 Hermes 共享决策记录
54 lines
1.6 KiB
TypeScript
54 lines
1.6 KiB
TypeScript
/* @vitest-environment jsdom */
|
|
|
|
import { render, screen } from '@testing-library/react';
|
|
import { expect, test } from 'vitest';
|
|
|
|
import { PlatformOverlayBadge } from './PlatformOverlayBadge';
|
|
|
|
test('renders a light top-left overlay badge by default', () => {
|
|
render(<PlatformOverlayBadge>第1幕</PlatformOverlayBadge>);
|
|
|
|
const badge = screen.getByText('第1幕');
|
|
|
|
expect(badge.className).toContain('absolute');
|
|
expect(badge.className).toContain('left-3');
|
|
expect(badge.className).toContain('top-3');
|
|
expect(badge.className).toContain('bg-white/88');
|
|
expect(badge.className).toContain('tracking-[0.18em]');
|
|
});
|
|
|
|
test('supports alternate placement and custom class', () => {
|
|
render(
|
|
<PlatformOverlayBadge placement="bottomRight" className="custom-overlay">
|
|
已选择
|
|
</PlatformOverlayBadge>,
|
|
);
|
|
|
|
const badge = screen.getByText('已选择');
|
|
|
|
expect(badge.className).toContain('bottom-3');
|
|
expect(badge.className).toContain('right-3');
|
|
expect(badge.className).toContain('custom-overlay');
|
|
});
|
|
|
|
test('supports compact muted tight overlay badge', () => {
|
|
render(
|
|
<PlatformOverlayBadge
|
|
placement="topRight"
|
|
offset="tight"
|
|
tone="muted"
|
|
size="compact"
|
|
>
|
|
占位图
|
|
</PlatformOverlayBadge>,
|
|
);
|
|
|
|
const badge = screen.getByText('占位图');
|
|
|
|
expect(badge.className).toContain('right-2');
|
|
expect(badge.className).toContain('top-2');
|
|
expect(badge.className).toContain('bg-[var(--platform-subpanel-fill)]');
|
|
expect(badge.className).toContain('px-2');
|
|
expect(badge.className).toContain('tracking-normal');
|
|
});
|