WorkBuddy
1fc34f1bcd
问题 1：五个导航页顶部与右上角胶囊按钮（··· ⊙）重合 - 根因：自定义导航用 env(safe-area-inset-top) 取的是设备物理安全区， 在 Android 上常为 0，完全不反映胶囊位置；且右对齐元素从未为胶囊让出宽度。 - 新增 miniapp/utils/nav-metrics.js 作为唯一事实源：以 wx.getMenuButtonBoundingClientRect() 实测胶囊矩形，反推并导出四个 CSS 变量 --nav-status / --nav-h / --nav-right / --nav-top，并提供无接口时的兜底值。 - nav-bar 组件改为自行获取导航度量（attached + observer 双触发）， 标题按胶囊垂直居中并收窄 max-width；外部传参降级为兜底。 - index / discover / messages / activity / mine 五页根结点注入同一组变量， WXSS 里的 env(safe-area-inset-top)、硬编码 88rpx 与右对齐 right:0 全量替换。 问题 2：首页「善缘公益服务」「善缘安全提醒」两个栏目过宽 - 根因：封面 <image> 只声明 width 未声明 height，小程序默认按 240px 计算， 实际把卡片撑到约 480rpx 高。 - 按「整体等比缩到 1/3」重构：两栏改为 mini-card 小卡，宽度 calc((100% - 2*gap)/3)、高度写死 168rpx，封面 height:100%； 公益服务一行三卡横向排布，安全提醒为「标题小卡 + 右侧文案条」， 长文案收进详情页，安全提示原文保留。 守卫与验证 - 新增 ui-tests/miniapp-capsule-safe-contracts.mjs： A 层多机型断言导航行与胶囊垂直居中、右对齐让位、navTop 与兜底值； B 层纯函数审计五个自带导航行页面（页面清单由文件系统推导，失配直接报红）； C 层断言首页小卡宽为 1/3 且显式声明高度，并钉住旧 service-/safety- 选择器回归。 审计前剥离注释，避免守卫被自身示例文本误伤。 - 新增 scripts/audit-image-height.mjs：按属性名精确比对，审计全仓 「有 width 无 height」的 <image>，当前 30 个类 0 命中。 - 负向注入 N1~N7（含 nav-safe 未接入、旧选择器回归、极小屏幕、无胶囊兜底等） 全部被守卫咬住并 exit 1，还原后复跑通过。 - 真编译（wcc/wcsc）：WXSS 88 / WXML 86，失败 0； tsc --noEmit 通过；UI 契约门控 21/21 PASS（新增第 21 个守卫并抬高 MIN_GUARDS）。 - 渲染探针实测：单卡 213rpx x 168rpx；五页右对齐元素右缘 423~528px， 均在胶囊右缘 365px 之外。 未纳入本次提交：miniapp/project.config.json（微信开发者工具自动改写， 仅追加若干布尔开关并删掉文件末换行）与生成的预览页 artifacts preview.html （约 7900 行生成产物），以免淹没代码评审视线。
61 lines
2.3 KiB
JavaScript
61 lines
2.3 KiB
JavaScript
import assert from 'node:assert/strict'
|
|
import { readFileSync } from 'node:fs'
|
|
import vm from 'node:vm'
|
|
// 首页会 require 顶部安全区工具（utils/nav-metrics.js）。这里直接注入**真实模块**而不是手写桩：
|
|
// 沙箱里没有 getWindowInfo / getMenuButtonBoundingClientRect，正好走它的兜底分支，
|
|
// 等于顺带验证了「系统接口不可用时也能给出安全值」。
|
|
import navMetrics from '../miniapp/utils/nav-metrics.js'
|
|
|
|
const source = readFileSync(new URL('../miniapp/pages/index/index.ts', import.meta.url), 'utf8')
|
|
let page
|
|
|
|
const sandbox = {
|
|
require(request) {
|
|
if (request === '../../stores') {
|
|
return {
|
|
authStore: { state: { isLoggedIn: false } },
|
|
appStore: { toastSuccess() {} },
|
|
}
|
|
}
|
|
if (request === '../../utils/api') {
|
|
return { get: async () => { throw new Error('未登录时不应请求首页接口') } }
|
|
}
|
|
if (request === '../../utils/nav-metrics') {
|
|
return navMetrics
|
|
}
|
|
throw new Error(`未预期依赖：${request}`)
|
|
},
|
|
Page(config) { page = config },
|
|
wx: {
|
|
getAccountInfoSync() {
|
|
return { miniProgram: { envVersion: 'develop' } }
|
|
},
|
|
},
|
|
console,
|
|
setTimeout,
|
|
}
|
|
|
|
vm.runInNewContext(source, sandbox, { filename: 'miniapp/pages/index/index.ts' })
|
|
assert.ok(page, '首页必须注册 Page 配置')
|
|
|
|
const pageState = { ...page.data }
|
|
await page.checkAuthAndLoad.call({
|
|
data: pageState,
|
|
setData(data) { Object.assign(pageState, data) },
|
|
loadHomeData() { throw new Error('未登录时不应进入首页数据加载流程') },
|
|
})
|
|
|
|
assert.equal(pageState.isOnboarding, true, '未登录时应进入登录引导状态')
|
|
assert.equal(pageState.userState, null, '未登录状态不得伪造实名用户，实名状态必须来自服务端数据库')
|
|
|
|
// 顶部安全区：无系统接口时必须退回兜底值（宁可多留不可少留），且四个 CSS 变量齐备
|
|
const fallbackVars = navMetrics.navSafeData(true)
|
|
assert.match(
|
|
fallbackVars.navVars,
|
|
/--nav-status:\d+px;--nav-h:\d+px;--nav-right:\d+px;--nav-top:\d+px;/,
|
|
'顶部安全区必须给出四个 CSS 变量（状态栏 / 导航行 / 胶囊安全区 / 内容起点）',
|
|
)
|
|
assert.ok(fallbackVars.navTopPx >= 64, '拿不到胶囊信息时也要留足顶部空间，避免压住操作按钮')
|
|
|
|
console.log('Phase 03 verification contracts passed')
|