From 49ec2418a2764e3d5f68296530878b060327ee60 Mon Sep 17 00:00:00 2001 From: wuzilong <704541015@qq.com> Date: Sat, 12 Sep 2026 18:50:23 +0800 Subject: [PATCH] refactor(miniprogram): reuse safe-area CSS builder in applySafeAreaCssVars Co-authored-by: Cursor --- miniprogram/utils/__tests__/safeArea.style.test.mjs | 9 +++++++++ miniprogram/utils/safeArea.js | 8 ++++---- 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/miniprogram/utils/__tests__/safeArea.style.test.mjs b/miniprogram/utils/__tests__/safeArea.style.test.mjs index d21e306c0..5f8a727f6 100644 --- a/miniprogram/utils/__tests__/safeArea.style.test.mjs +++ b/miniprogram/utils/__tests__/safeArea.style.test.mjs @@ -12,4 +12,13 @@ assert.equal(style['--sq-safe-top'], '44px') assert.equal(style['--sq-nav-height'], '40px') assert.equal(style['--sq-header-height'], '84px') assert.equal(style['--sq-capsule-right-safe'], '96px') + +const noCapsuleStyle = buildSafeAreaCssVarsStyle({ + topSafeHeight: 20, + navContentHeight: 44, + headerHeight: 64, + capsuleRightSafeWidth: 0, +}) + +assert.equal(noCapsuleStyle['--sq-capsule-right-safe'], '0px') console.log('ok') diff --git a/miniprogram/utils/safeArea.js b/miniprogram/utils/safeArea.js index bc3a3710f..729a5db7f 100644 --- a/miniprogram/utils/safeArea.js +++ b/miniprogram/utils/safeArea.js @@ -62,10 +62,10 @@ export function computeSafeAreaMetrics() { export function applySafeAreaCssVars(metrics) { if (typeof document === 'undefined' || !document?.documentElement) return const root = document.documentElement.style - root.setProperty('--sq-safe-top', `${metrics.topSafeHeight}px`) - root.setProperty('--sq-nav-height', `${metrics.navContentHeight}px`) - root.setProperty('--sq-header-height', `${metrics.headerHeight}px`) - root.setProperty('--sq-capsule-right-safe', `${metrics.capsuleRightSafeWidth}px`) + const style = buildSafeAreaCssVarsStyle(metrics) + Object.entries(style).forEach(([key, value]) => { + root.setProperty(key, value) + }) } export function initGlobalSafeArea() {