跨端: 补齐「我的」页深色可读性(4 页 219 段全 ≥3:1)+ 判据自己漏报的那一类
上一条把通信/日历/联系扫干净了,但**「我的」页没扫到**
(扫描脚本按文案点不到它 —— 那是侧栏**底部的头像按钮**,不是导航项)。
补上后立刻又抓出问题,并把判据自身的**漏报形状**一并修了。
## 一、「我的」页两处真 bug
1. **主题分段按钮 `SettingsPage.ets:834`**:
`.fontColor(... ? Theme.surface : Theme.textPrimary)` —— `surface` 是
**会翻转的面色**,压在 `Theme.accent` 蓝底上,深色下变成近黑。
设备读数:`深色 2.93:1 ink rgb(32,34,36) bg rgb(34,96,228)`。
2. **权限档徽标 `MailDetailPage.ets:391`**:同一个错法(第 13 处)。
3. **账号名 `SettingsPage.ets:1179`**:三元里的裸 `Theme.accent`
压在 `accentSoftFor()` 底上 ⇒ `jianf 2.83:1`。
`AdminUsersPage.ets:386` 同形状(角色徽标)。
## 二、判据自己的漏报形状(比 bug 本身更值得记)
静态防线(`C|会翻转的 Resource 不得当前景色`)**在 bug 存在时是绿的**。
原因是它的提取正则:
/\.fontColor\(Theme\.([A-Za-z0-9_]+)\)/ ← 要求令牌是**唯一实参**
于是**三元里的令牌全被漏掉**:
.fontColor(this.appearanceTheme === t ? Theme.surface : Theme.textPrimary)
改成"在 `fontColor(` 之后的整段实参里找所有 `Theme.X`"之后,
它**立刻报出上面第 1、2 两处**(此前一直绿)。
★ **判据漏报的常见形状是它自己的正则太窄,而不是被测代码太隐蔽。**
这条写成注释留在判据里了。
## 三、我自己犯的批量替换错误(已加判据钉住)
把裸 `Theme.accent` 换成 `accentFor()` 时,**误把 6 处 `backgroundColor` 也换了**。
`accentFor()` 深色给浅蓝 `#80AFF9`,而搭档前景是白色 `accentFg`
⇒ 白字压浅蓝 ≈ **1.4:1**,主按钮文字会彻底看不见。
- 6 处已逐处还原(复核:`grep -c "backgroundColor(Theme.accentFor())"` = 0)。
- 新增判据 **`C2`**:`accentFor / dangerFor / approveFor / warnFgFor / textSubtleFor`
**只能用于前景**,`backgroundColor(Theme.XFor(...))` 直接判红。
(`accentSoftFor` 是例外 —— 它本来就是"面"。)
★ 修法不是"下次小心点":批量替换一定会再犯,**一行判据把它变成不可能**。
## 四、设备复扫(修后)
```
[通信] 扫 42 段,低对比 0
[日历] 扫 85 段,低对比 0
[联系人] 扫 51 段,低对比 0
[我的] 扫 41 段,低对比 0 ← 新增
```
**219 段文字全部 ≥3:1**(本轮全部针对深色)。
## 五、底本
`baseline.sha` 第 5 次重算。重算前**专门复核**了"那 6 处误改有没有残留"
(不只看 `git diff` 非空就放行):`backgroundColor(accentFor)` 计数为 0、
`git diff HEAD~1` 里 backgroundColor 只有 calendar 那一处(有意改动)。
`run-all.mjs` → `checks=515 pass=515 fail=0 skip=0 red=0 broken=0 unreported=0`。
**未验**:浅色主题下的对比度没扫(本轮全部针对深色)。
This commit is contained in:
@ -948,6 +948,55 @@ test('★ 品牌浅底必须有深色变体(深色下白底卡片 = 刺眼的
|
||||
'\n改成 Theme.accentSoftFor(this.isDarkNow)(页面要有一个 isDarkNow 状态)');
|
||||
});
|
||||
|
||||
test('C2|`*For()` 入口只能用于**前景**,不得当背景(我批量替换时真犯过)', () => {
|
||||
/*
|
||||
* ★★ 这条是给**我自己**写的 —— 2026-09-19 我批量把裸 `Theme.accent`
|
||||
* 换成 `Theme.accentFor()` 时,把**6 处 `backgroundColor` 也一起换了**。
|
||||
*
|
||||
* 为什么那是 bug:`accentFor()` 在深色下返回**浅蓝** `#80AFF9`,
|
||||
* 而它的搭档前景是 `accentFg`(白)——
|
||||
* 白字压浅蓝底 ≈ 1.4:1,主按钮上的文字会**彻底看不见**。
|
||||
*
|
||||
* ★ 修法不是"下次小心点":批量替换一定会再犯。
|
||||
* 在 `backgroundColor(Theme.XFor(...))` 这个形状上直接判红,
|
||||
* 代价一行,收益是这类错误不可能再出现。
|
||||
*
|
||||
* 适用对象:所有 `*For()` 主题自适应入口 —— 它们的返回值都是
|
||||
* **为前景调过亮的**(`accentFor` / `dangerFor` / `approveFor` / `warnFgFor`)。
|
||||
* `accentSoftFor` 是例外:它本来就是**面**(浅底),当背景才是对的。
|
||||
*/
|
||||
const FG_ONLY = ['accentFor', 'dangerFor', 'approveFor', 'warnFgFor', 'textSubtleFor'];
|
||||
const files = [];
|
||||
const walkDir = (d) => {
|
||||
for (const e of readdirSync(d, { withFileTypes: true })) {
|
||||
const p = join(d, e.name);
|
||||
if (e.isDirectory()) walkDir(p);
|
||||
else if (e.name.endsWith('.ets')) files.push(p);
|
||||
}
|
||||
};
|
||||
walkDir(HARMONY_ETS);
|
||||
|
||||
const bad = [];
|
||||
for (const f of files) {
|
||||
const src = prose(f);
|
||||
const rel = f.replace(HARMONY_ETS, '');
|
||||
src.split('\n').forEach((ln, i) => {
|
||||
for (const name of FG_ONLY) {
|
||||
if (new RegExp(`backgroundColor\\(\\s*Theme\\.${name}\\(`).test(ln)) {
|
||||
bad.push(`${rel}:${i + 1} ${ln.trim().slice(0, 90)}`);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
assert.deepStrictEqual(bad, [],
|
||||
'★ 这些地方把**为前景调亮的** `*For()` 入口当成背景色用了:\n ' + bad.join('\n ') + '\n' +
|
||||
' 它们返回的是"压在这类底上的字色"(深色下更亮),当**底**会把上面的文字吞掉\n' +
|
||||
' (实测形状:`accentFor()` 深色给 #80AFF9,白字压上去 ≈1.4:1)。\n' +
|
||||
' 当背景用**不带 For 的那个**:`Theme.accent` / `danger` / `approve` / `warnFg`\n' +
|
||||
' (WebUI 的实心按钮底 `--s-*` 两个主题同值,跟着变会让主按钮失去视觉重量)。');
|
||||
});
|
||||
|
||||
test('★ 设备:品牌色**真的画成那个色**(令牌写对了 ≠ 渲染对了)', async (t) => {
|
||||
/*
|
||||
* 补的是 `run-all.mjs` 的 `STATIC_ONLY` 登记里说的那个缺口:
|
||||
@ -1120,6 +1169,20 @@ test('★ 设备:品牌色**真的画成那个色**(令牌写对了 ≠ 渲
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* 两边都用**且都合理**的令牌 —— 逐条给理由,别只列名字。
|
||||
*
|
||||
* ★ 目前**空**:这类令牌满足"会翻转的 Resource"且两边都用的组合,
|
||||
* 本身就很可疑(那正是 `Theme.surface` 出问题的形状)。
|
||||
*
|
||||
* ★ 已审过、**不需要**列在这里的(说明为什么它们不该进这张表):
|
||||
* · `accent` / `danger` / `approve` / `warnFg` —— 两边都用是正常设计
|
||||
* (蓝底白字主按钮 + 白底蓝字返回箭头),而且它们是**字符串常量**,
|
||||
* 不跟随主题翻转 ⇒ 不满足条件 A,判据本来就不会碰它们。
|
||||
* · `textPrimary` / `textMuted` / `textSubtle` —— 只当字色,不满足条件 B。
|
||||
*/
|
||||
const ALLOW_BOTH_BG_AND_FG = new Set([]);
|
||||
|
||||
test('C|「会跟随主题翻转的 Resource」不得当前景色(含矛盾信号)', () => {
|
||||
/*
|
||||
* ★★ 这是设备判据(上面那条)抓到的 bug 的**静态防线** ——
|
||||
@ -1198,11 +1261,32 @@ test('C|「会跟随主题翻转的 Resource」不得当前景色(含矛盾
|
||||
for (const m of ln.matchAll(/backgroundColor\(Theme\.([A-Za-z0-9_]+)\)/g)) {
|
||||
if (!asBg.has(m[1])) asBg.set(m[1], where);
|
||||
}
|
||||
for (const m of ln.matchAll(/\.fontColor\(Theme\.([A-Za-z0-9_]+)\)/g)) {
|
||||
if (!asFg.has(m[1])) asFg.set(m[1], where);
|
||||
/*
|
||||
* ★★ 提取时**不能要求令牌是唯一实参** —— 这一版原来用
|
||||
* `\.fontColor\(Theme\.(\w+)\)`,于是**三元里的令牌全被漏掉**:
|
||||
*
|
||||
* .fontColor(this.appearanceTheme === t ? Theme.surface : Theme.textPrimary)
|
||||
*
|
||||
* 实测代价:`SettingsPage.ets:834` 正是这个形状(`surface` 当字色压在
|
||||
* `accent` 蓝底上),而判据**照样绿** —— 直到设备扫描报出
|
||||
* `深色 2.93:1 ink rgb(32,34,36) bg rgb(34,96,228)` 才发现。
|
||||
*
|
||||
* ⇒ 改成"在 `fontColor(` 之后的**整段实参**里找所有 `Theme.X`"。
|
||||
* 判据漏报的形状往往就是它**自己的正则太窄**,而不是被测代码太隐蔽。
|
||||
*/
|
||||
for (const m of ln.matchAll(/\.fontColor\(/g)) {
|
||||
const rest = ln.slice(m.index + m[0].length);
|
||||
/* 只取到本行结束(这些调用都在一行内闭合) */
|
||||
for (const t of rest.matchAll(/Theme\.([A-Za-z0-9_]+)/g)) {
|
||||
if (!asFg.has(t[1])) asFg.set(t[1], where);
|
||||
}
|
||||
}
|
||||
for (const m of ln.matchAll(/iconColor:\s*Theme\.([A-Za-z0-9_]+)/g)) {
|
||||
if (!asFg.has(m[1])) asFg.set(m[1], where);
|
||||
/* `iconColor: X` 同理 —— 冒号后整段都可能有三元 */
|
||||
for (const m of ln.matchAll(/iconColor:/g)) {
|
||||
const rest = ln.slice(m.index + m[0].length);
|
||||
for (const t of rest.matchAll(/Theme\.([A-Za-z0-9_]+)/g)) {
|
||||
if (!asFg.has(t[1])) asFg.set(t[1], where);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@ -58,10 +58,25 @@
|
||||
# ⇒ 是"我改的",不是"变异忘了还原"。
|
||||
# ★ 取证命令留在这里,下次照着做:
|
||||
# git diff --quiet HEAD -- <file> && echo STALE || echo INTENTIONAL
|
||||
#
|
||||
# 2026-09-19 20:4x baseline 重算(第 5 次):
|
||||
# ① AdminUsersPage.ets / SettingsPage.ets -- 有意编辑:修三元里的裸 Theme.accent
|
||||
# (前景位置漏改的那 2 处)+ 那一批 textSubtleFor()。
|
||||
# ② 本次格外重要的一步:我批量替换 Theme.accent -> accentFor() 时,
|
||||
# 误把 6 处 backgroundColor 也换了(accentFor() 深色给浅蓝 #80AFF9,
|
||||
# 白字压上去约 1.4:1,主按钮文字会看不见)。发现后已逐处还原。
|
||||
# 重算前专门复核过三件事(不能只看 git diff 非空就放行):
|
||||
# - grep -c "backgroundColor(Theme.accentFor())" 得到 0
|
||||
# - 三个涉及文件里都无 accentFor 背景
|
||||
# - git diff HEAD~1 里 backgroundColor 只有 calendar 那一处
|
||||
# (原本是 accentSoftFor,属本次有意改动)
|
||||
# => 确认无「改错了没还原」的残留在。
|
||||
# ③ 新增判据 C2(*For() 入口只能用于前景、不得当背景)把这整类钉住,
|
||||
# 下次再手滑批量替换会直接判红,不必再靠事后复核。
|
||||
4f3e0802346ba93740d7a6989fa6a9ef7dce16d1db59ea7402ff554127b07e3e client/harmony/entry/src/main/ets/model/AdminUsers.ts
|
||||
c465b178ec1853ba66ac619e0d5614f48aef66db2ed2fecba25a4ae10e3dd13b client/harmony/entry/src/main/ets/model/ImagePrep.ts
|
||||
ceec4a5aae5e9064d9ab57ef24acd4b7f185506de8582ae2c67e35f634ff8593 client/harmony/entry/src/main/ets/pages/AdminUsersPage.ets
|
||||
7cdaa94bb0b4473aea652d50e5fe1b7b43c60b00076d0d3ac2cc49a3226f0aa5 client/harmony/entry/src/main/ets/pages/AdminUsersPage.ets
|
||||
73c66c7045f579c3eb8b8e0aa07803e7c9363b7ae8375972b251633d3ce969be client/harmony/entry/src/main/ets/common/BackgroundPicker.ets
|
||||
e773fd556f4454efbb204ff72841b63a0a584f7ca7827c73142884af21328ba5 client/harmony/entry/src/main/ets/pages/SettingsPage.ets
|
||||
b53872c62acdeb88803df79d48ee94cca0810715b26e6cbb336e526c00b528b8 client/harmony/entry/src/main/ets/pages/SettingsPage.ets
|
||||
f3c7c3de22acaa94c8c3603fdd387547090807ee13e1e9fe35514d2028f5647e client/harmony/entry/src/main/ets/api/ApiClient.ets
|
||||
6550e1892d1ebea82fb75a3d2cf8eaf826186199ff4a0ecf0430b1e3517d8681 client/harmony/entry/src/main/ets/api/AppearanceApi.ets
|
||||
|
||||
@ -68,7 +68,7 @@ const SUITE = [
|
||||
// 「只有通信页深色正常」的回归锁 —— 38 条里后 8 条是这次新增)。
|
||||
['test/theme.test.mjs', [], 38],
|
||||
['test/background.test.mjs', [], 44],
|
||||
['test/cross-client-theme.test.mjs', [], 20],
|
||||
['test/cross-client-theme.test.mjs', [], 21],
|
||||
// 左右滑动翻页的**语义契约**(两端逐项相同、数值各自定)—— 这是
|
||||
// `docs/DEBTS.json` 的 `gesture-semantics` 那条债:它写着「鸿蒙侧出现滑动
|
||||
// 手势代码时**立即建**(此前建 = 只有一端存在的假判据)」。
|
||||
|
||||
@ -383,7 +383,8 @@ struct AdminUsersPage {
|
||||
.maxLines(1).textOverflow({ overflow: TextOverflow.Ellipsis })
|
||||
this.Chip(user.role === 'admin' ? '管理员' : '用户',
|
||||
user.role === 'admin' ? Theme.chipNeutralBg : Theme.surfaceMuted,
|
||||
user.role === 'admin' ? Theme.accent : Theme.textMuted)
|
||||
/* ★ 2026-09-19 修:三元里的裸 `Theme.accent`(同批 2 处,见 SettingsPage 那条)。 */
|
||||
user.role === 'admin' ? Theme.accentFor() : Theme.textMuted)
|
||||
Text(' ').width(4)
|
||||
this.Chip(user.status === 'active' ? '启用' : '禁用',
|
||||
user.status === 'active' ? Theme.approveBg : Theme.surfaceMuted,
|
||||
|
||||
@ -1245,12 +1245,12 @@ export struct CalendarPage {
|
||||
*/
|
||||
Text('导入')
|
||||
.fontSize(Theme.fontSmall)
|
||||
.fontColor(this.icsBusy ? Theme.textSubtle : Theme.accent)
|
||||
.fontColor(this.icsBusy ? Theme.textSubtle : Theme.accentFor())
|
||||
.margin({ left: 8 })
|
||||
.onClick(() => { this.importIcs(); })
|
||||
Text('导出')
|
||||
.fontSize(Theme.fontSmall)
|
||||
.fontColor(this.icsBusy ? Theme.textSubtle : Theme.accent)
|
||||
.fontColor(this.icsBusy ? Theme.textSubtle : Theme.accentFor())
|
||||
.margin({ left: 8 })
|
||||
.onClick(() => { this.exportIcs(); })
|
||||
/*
|
||||
|
||||
@ -254,7 +254,7 @@ struct ComposePage {
|
||||
Row() {
|
||||
Text(acct.displayName)
|
||||
.fontSize(13)
|
||||
.fontColor(this.selectedAccountId === acct.id ? Theme.accent : Theme.textPrimary)
|
||||
.fontColor(this.selectedAccountId === acct.id ? Theme.accentFor() : Theme.textPrimary)
|
||||
.fontWeight(this.selectedAccountId === acct.id ? FontWeight.Bold : FontWeight.Normal)
|
||||
.layoutWeight(1)
|
||||
if (this.selectedAccountId === acct.id) {
|
||||
|
||||
@ -388,7 +388,13 @@ export struct MailDetailView {
|
||||
ForEach(['plan', 'workspace', 'full'], (mode: string) => {
|
||||
Text(permissionLabel(mode))
|
||||
.fontSize(11)
|
||||
.fontColor(this.permissionMode === mode ? Theme.surface : Theme.textMuted)
|
||||
/*
|
||||
* ★ 2026-09-19 修:选中态前景是 `Theme.accentFg`(白),不是 `Theme.surface`。
|
||||
* `surface` 是**会跟随主题翻转的面色**(浅色近白 / 深色近黑)——
|
||||
* 压在 `Theme.accent` 蓝底上,浅色下碰巧对、**深色下变成近黑** ⇒ 字看不见。
|
||||
* 这是本仓同一个错法的第 N 次出现(同批一共修了 12 处)。
|
||||
*/
|
||||
.fontColor(this.permissionMode === mode ? Theme.accentFg : Theme.textMuted)
|
||||
.backgroundColor(this.permissionMode === mode ? Theme.accent : Theme.chipNeutralBg)
|
||||
.borderRadius(4)
|
||||
.padding({ left: 8, right: 8, top: 3, bottom: 3 })
|
||||
@ -896,7 +902,7 @@ export struct MailDetailView {
|
||||
/* 「抄送」是个**折叠开关**(WebUI 同形:默认收起,点它才出现输入框) */
|
||||
Text(this.forwardCcOpen ? '收起抄送' : '抄送')
|
||||
.fontSize(11)
|
||||
.fontColor(this.forwardCcOpen ? Theme.accent : Theme.textMuted)
|
||||
.fontColor(this.forwardCcOpen ? Theme.accentFor() : Theme.textMuted)
|
||||
.onClick(() => { this.forwardCcOpen = !this.forwardCcOpen; })
|
||||
}
|
||||
.width('100%')
|
||||
|
||||
@ -438,7 +438,7 @@ struct InboxTab {
|
||||
if (this.showAccountPicker && this.accountList.length > 1) {
|
||||
Column() {
|
||||
Text('全部邮箱')
|
||||
.fontSize(14).fontColor(this.accountFilter === 'all' ? Theme.accent : Theme.textPrimary)
|
||||
.fontSize(14).fontColor(this.accountFilter === 'all' ? Theme.accentFor() : Theme.textPrimary)
|
||||
.fontWeight(this.accountFilter === 'all' ? FontWeight.Bold : FontWeight.Normal)
|
||||
.width('100%').height(40).padding({ left: 16 })
|
||||
.backgroundColor(this.accountFilter === 'all' ? Theme.accentSoftFor(this.isDarkNow) : Theme.surface)
|
||||
@ -453,7 +453,7 @@ struct InboxTab {
|
||||
Column() {
|
||||
Text(acct.displayName)
|
||||
.fontSize(14)
|
||||
.fontColor(this.accountFilter === acct.id ? Theme.accent : Theme.textPrimary)
|
||||
.fontColor(this.accountFilter === acct.id ? Theme.accentFor() : Theme.textPrimary)
|
||||
.fontWeight(this.accountFilter === acct.id ? FontWeight.Bold : FontWeight.Normal)
|
||||
Text(acct.username)
|
||||
.fontSize(11).fontColor(Theme.textSubtleFor())
|
||||
@ -1384,7 +1384,7 @@ struct CommPage {
|
||||
Text(commTabLabel(key))
|
||||
.fontSize(13)
|
||||
.fontWeight(this.commTab === key ? FontWeight.Bold : FontWeight.Normal)
|
||||
.fontColor(this.commTab === key ? Theme.accent : Theme.textMuted)
|
||||
.fontColor(this.commTab === key ? Theme.accentFor() : Theme.textMuted)
|
||||
if (badgeText(badgeCount(key, this.unreadCount, this.pendingCount)).length > 0) {
|
||||
Text(badgeText(badgeCount(key, this.unreadCount, this.pendingCount)))
|
||||
.fontSize(10).fontColor(Theme.accentFg)
|
||||
|
||||
@ -831,7 +831,14 @@ export struct SettingsPane {
|
||||
ForEach(['system', 'light', 'dark'], (t: string) => {
|
||||
Text(t === 'system' ? '跟随系统' : (t === 'light' ? '浅色' : '深色'))
|
||||
.fontSize(13)
|
||||
.fontColor(this.appearanceTheme === t ? Theme.surface : Theme.textPrimary)
|
||||
/*
|
||||
* ★ 2026-09-19 修:同上 —— 选中态压在 `Theme.accent` 蓝底上,
|
||||
* 前景必须是**不翻转**的 `accentFg`,不能用 `surface`。
|
||||
* ★ 这处是".fontColor(三元)"形状,判据的第一版正则只认
|
||||
* `.fontColor(Theme.X)`(令牌是唯一实参)⇒ **漏掉了它**,
|
||||
* 直到设备扫描报出「深色 2.93:1 ink rgb(32,34,36) bg rgb(34,96,228)」。
|
||||
*/
|
||||
.fontColor(this.appearanceTheme === t ? Theme.accentFg : Theme.textPrimary)
|
||||
.backgroundColor(this.appearanceTheme === t ? Theme.accent : Theme.surfaceMuted)
|
||||
.borderRadius(Theme.radiusControl)
|
||||
.padding({ left: 12, right: 12, top: 6, bottom: 6 })
|
||||
@ -1169,7 +1176,9 @@ export struct SettingsPane {
|
||||
Row() {
|
||||
Text(account.displayName)
|
||||
.fontSize(15).fontWeight(FontWeight.Bold)
|
||||
.fontColor(account.id === this.activeId ? Theme.accent : Theme.textPrimary)
|
||||
/* ★ 2026-09-19 修:三元里的裸 `Theme.accent` —— 批量替换漏了这种形状(同批共 2 处)。
|
||||
* 深色下压在 `accentSoftFor()` 底上只有 2.83:1(设备实测)。 */
|
||||
.fontColor(account.id === this.activeId ? Theme.accentFor() : Theme.textPrimary)
|
||||
if (account.id === this.activeId) {
|
||||
Text(' 默认')
|
||||
.fontSize(11).fontColor(Theme.accentFor())
|
||||
|
||||
Reference in New Issue
Block a user