refactor: H5 设备震动 API 调整 #18250
refactor: H5 设备震动 API 调整 #18250
Conversation
Walkthrough在 H5 端重构震动实现：新增显式 vibrator 助手检测并返回布尔值；vibrateShort 与 vibrateLong 改为接收 options 对象并从中解构回调；根据 vibrator 返回值通过 MethodHandler 分发 success/fail/complete；不支持或异常时记录告警并返回 false。 Changes
Sequence Diagram(s)sequenceDiagram
autonumber
participant App as 调用方
participant API as Taro.vibrateShort/Long
participant Vib as vibrator helper
participant MH as MethodHandler
participant Nav as window.navigator
App->>API: 调用 options { success, fail, complete }
API->>API: 解析 options
rect rgba(200,230,255,0.25)
note right of API: 调用 vibrator 助手（特性检测 & 调用）
API->>Vib: 请求振动（pattern）
Vib->>Nav: 检查 `navigator.vibrate`
alt 支持且调用成功
Nav-->>Vib: 执行并返回 true
Vib-->>API: true
else 不支持或异常
Vib-->>API: false（并 console.warn）
end
end
alt 返回 true
API->>MH: resolve(success)
else 返回 false
API->>MH: reject(fail, "style is not support")
end
MH-->>App: 触发 complete
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Suggested reviewers
Poem
Tip 🔌 Remote MCP (Model Context Protocol) integration is now available!Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats. 📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 💡 Knowledge Base configuration:
You can enable these sources in your CodeRabbit configuration. 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
✨ Finishing Touches
🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (7)
packages/taro-h5/src/api/device/vibrate.ts (7)
1-1: 仅类型用途的导入请改为 import type，避免运行时依赖与额外包体此处
Taro仅用于类型标注，建议使用import type，以避免将@tarojs/api的运行时代码打进 H5 包。-import Taro from '@tarojs/api' +import type Taro from '@tarojs/api'
5-16: 更健壮的特性检测与类型：使用 globalThis.navigator?.vibrate + VibratePattern；减少重复 warn
- 采用
globalThis.navigator?.vibrate可避免 SSR/非浏览器环境下对window的硬依赖，更安全。- 使用 DOM 自带
VibratePattern类型（等价于number | number[]）更贴合标准。- 统一告警文案，避免
try/catch和else分支重复warn。- 函数名改为
tryVibrate更贴合语义（返回布尔值表示尝试结果）。-const vibrator = function vibrator (mm: number | number[]): boolean { - try { - if (typeof window.navigator.vibrate === 'function') { - return window.navigator.vibrate(mm) - } - console.warn('当前浏览器不支持 vibrate。') - return false - } catch (e) { - console.warn('当前浏览器不支持 vibrate。') - return false - } -} +const tryVibrate = (pattern: VibratePattern): boolean => { + const nav = typeof globalThis !== 'undefined' + ? (globalThis as any).navigator as Navigator | undefined + : undefined + const vibrate = nav?.vibrate + if (typeof vibrate === 'function') { + try { + return vibrate.call(nav, pattern) + } catch { + console.warn('当前环境不支持 Vibration API。') + return false + } + } + console.warn('当前环境不支持 Vibration API。') + return false +}
21-21: 跟随 import type 调整签名类型引用，避免对值级别 Taro 的依赖
import type后不应再使用typeof Taro.vibrateShort，建议改为索引类型引用。-export const vibrateShort: typeof Taro.vibrateShort = (options: Taro.vibrateShort.Option = {}) => { +export const vibrateShort: Taro['vibrateShort'] = (options: Taro.vibrateShort.Option = {}) => {
24-24: 同步调用处的重命名：vibrator → tryVibrate与上方助手函数改名保持一致。
- if (vibrator(15)) { + if (tryVibrate(15)) {
27-27: 英文报错文案语法问题：应为 “is not supported”将 “is not support” 更正为 “is not supported”，并可考虑更清晰的提示语。
- return handle.fail({ errMsg: 'vibrateShort is not support' }) + return handle.fail({ errMsg: 'vibrateShort is not supported' })
31-42: vibrateLong 实现与 vibrateShort 保持一致即可，但建议统一错误信息风格与
vibrateShort同步修正语法问题，并考虑与全局 API 约定统一errMsg风格（详见下方校验建议）。-export const vibrateLong: typeof Taro.vibrateLong = (options: Taro.vibrateLong.Option = {}) => { +export const vibrateLong: Taro['vibrateLong'] = (options: Taro.vibrateLong.Option = {}) => { const { success, fail, complete } = options const handle = new MethodHandler({ name: 'vibrateLong', success, fail, complete }) - if (vibrator(400)) { + if (tryVibrate(400)) { return handle.success() } else { - return handle.fail({ errMsg: 'vibrateLong is not support' }) + return handle.fail({ errMsg: 'vibrateLong is not supported' }) } }
18-20: 请更新 packages/taro-h5/src/api/device/vibrate.ts 中的注释基于 MDN 与 caniuse 的最新兼容性信息，Vibration API 在不同平台上的支持情况如下：
- Chrome for Android、Android WebView、Firefox for Android、Samsung Internet、Opera for Android 等多数基于 Chromium/Gecko 的浏览器均支持
navigator.vibrate，但在无用户手势、省电模式、跨域 iframe 等场景可能被限制。- iOS Safari 及 iOS WebView（WKWebView）不支持该 API；原有“仅在 iPhone 7/7 Plus 以上生效”的描述容易导致误导。
- MDN 已将 Vibration API 标记为“已弃用/不推荐用于新项目”，后续可能被移除或进一步限制。
请将原有注释替换为更清晰的兼容性说明，并在调用前进行运行时检测。示例修改 diff 如下：
/** - * 使手机发生较短时间的振动（15 ms）。仅在 iPhone 7 / 7 Plus 以上及 Android 机型生效 + * 使设备产生一次短暂振动（约 15ms）。 + * 注意： + * - 支持：Chrome for Android、Android WebView、Firefox for Android、Samsung Internet、Opera for Android 等；不支持：iOS Safari / iOS WebView。 + * - 调用前请检测 'vibrate' in navigator，并在用户手势触发的上下文中执行。 + * - MDN 标注该 API 已弃用，后续版本可能移除或进一步限制。 */
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
packages/taro-h5/src/api/device/vibrate.ts(1 hunks)
🔇 Additional comments (1)
packages/taro-h5/src/api/device/vibrate.ts (1)
21-23: 参数对象化与 MethodHandler 续用：实现清晰，改动方向正确从解构参数切换为
options对象并继续沿用MethodHandler分发success/fail/complete，方向合理、接口更稳定。
meet-student
force-pushed
the
h5-device
branch
from
5269b7d to
a9bffd4
Compare
meet-student
force-pushed
the
h5-device
branch
from
a9bffd4 to
a401653
Compare
Codecov Report❌ Patch coverage is
❌ Your patch status has failed because the patch coverage (17.39%) is below the target coverage (75.00%). You can increase the patch coverage or adjust the target coverage. Additional details and impacted files@@ Coverage Diff @@
## main #18250 +/- ##
==========================================
- Coverage 55.07% 55.05% -0.02%
==========================================
Files 416 416
Lines 21559 21565 +6
Branches 5267 5269 +2
==========================================
Hits 11873 11873
+ Misses 8160 8044 -116
- Partials 1526 1648 +122
Flags with carried forward coverage won't be shown. Click here to find out more.
🚀 New features to boost your workflow:
|
|
CI 挂了 |
Single-Dancer
changed the title
3 participants
这个 PR 做了什么？ (简要描述所做更改)
这个 PR 是什么类型？ (至少选择一个)
这个 PR 涉及以下平台：
Summary by CodeRabbit