文件
shanghaipeiwan/server/tests/theme-consistency.spec.ts
xcbyy dde3cce562 fix(ui): 下单页背景/卡片/文字跟随全局主题(修复暖色主题下仍是深色底)
- create.vue 原先把整套深色配色写死,仅局部有 .theme-warm 覆盖 → 暖色主题下页面底色/卡片仍是深色
- 统一改用全局主题变量:容器 var(--bg-primary)、卡片 var(--bg-surface)、次级面 var(--bg-surface-elevated)、文字 --text-primary/secondary/muted、描边 --border-subtle、品牌 --color-brand(-gradient)、底部支付栏 --bg-surface-glass
- 替换 15 处深色时代的中性半透明白(rgba(255,255,255,0.03~0.1))为对应主题变量,暖色下不再白上白
- 主按钮渐变改用 var(--color-brand-gradient),暖色下自动变为橙色渐变
- theme-consistency.spec.ts 增加下单页断言(99 套件/682 用例全绿)
2026-10-20 14:00:27 +08:00

70 行
3.3 KiB
TypeScript

// 已读取AGENTS.md
import * as fs from 'fs';
import * as path from 'path';
/**
* 第八十一批:新页面必须复用全局主题变量(随 theme-warm/theme-cool 切换自适应)。
* 背景:优惠券页/消息页初版写死深色,切到「暖阳晨曦」主题时不跟随,配色不一致。
*/
describe('第八十一批主题一致性闸门', () => {
const root = path.resolve(__dirname, '../../');
const read = (p: string) => fs.readFileSync(path.join(root, p), 'utf-8');
const coupons = read('pwuniapp/pages/user/coupons.vue');
const notifications = read('pwuniapp/pages/user/notifications.vue');
const workspace = read('pwuniapp/pages/expert/workspace.vue');
it('优惠券页使用全局主题变量而非写死配色', () => {
for (const v of ['var(--bg-primary', 'var(--bg-surface', 'var(--color-brand-gradient', 'var(--text-primary', 'var(--text-secondary', 'var(--text-muted', 'var(--border-subtle', 'var(--nav-bg']) {
expect(coupons).toContain(v);
}
expect(coupons).toContain("'theme-' + currentThemeKey");
});
it('消息通知页使用全局主题变量', () => {
for (const v of ['var(--bg-primary', 'var(--bg-surface', 'var(--color-brand', 'var(--text-primary', 'var(--text-muted', 'var(--border-subtle', 'var(--nav-bg']) {
expect(notifications).toContain(v);
}
expect(notifications).toContain("'theme-' + currentThemeKey");
});
it('大神工作台新增表单样式复用主题变量', () => {
expect(workspace).toContain('var(--bg-surface-elevated');
expect(workspace).toContain('var(--color-brand');
expect(workspace).toContain('var(--text-secondary');
expect(workspace).toContain('var(--text-primary');
});
it('新页面导航栏遵循统一规范(总高=安全区,内容行贴底对齐胶囊,标题绝对居中)', () => {
for (const page of [coupons, notifications]) {
expect(page).toContain('height: var(--safe-header-gap');
expect(page).toContain('position: absolute;');
expect(page).toContain('bottom: 0;');
expect(page).toContain('height: var(--capsule-height');
expect(page).toContain('transform: translateX(-50%)');
expect(page).toContain('flex-direction: column');
}
});
it('下单页(create)底色/卡片/文字全部走全局主题变量', () => {
const create = read('pwuniapp/pages/order/create.vue');
expect(create).toContain('background-color: var(--bg-primary)');
expect(create).toContain('background-color: var(--bg-surface)');
expect(create).toContain('var(--bg-surface-glass');
expect(create).toContain('border: 1px solid var(--border-subtle)');
expect(create).toContain('color: var(--text-primary)');
expect(create).toContain('color: var(--text-muted)');
// 不得残留深色时代的中性硬编码(否则暖色主题下白上白/底色不一致)
expect(create).not.toContain('background-color: rgba(21, 29, 48');
expect(create).not.toContain('background-color: #0A0F1D');
expect(create).not.toContain('rgba(255, 255, 255, 0.0');
expect(create).toContain("'theme-warm': currentThemeKey === 'warm'");
});
it('全局主题变量在 App.vue 中按主题定义', () => {
const app = read('pwuniapp/App.vue');
expect(app).toContain(':root, page {');
expect(app).toContain('.theme-warm {');
expect(app).toContain('--color-brand-gradient');
});
});