在移动设备上测试

使用 builder 中的响应式视口切换器进行快速检查，然后发布并在真实设备上测试任何涉及移动端专属行为的功能。

Proyecta 的移动端测试分为两个层次：builder 内置的响应式预览，以及在已发布 URL 上进行的真实设备测试。

在 builder 中使用响应式预览

预览面板的地址栏中包含一个视口切换器：

模式	尺寸
Desktop	全窗口宽度
Tablet	768 × 1024
Mobile	390 × 844

在编辑时随时切换，可以尽早发现布局问题。这是捕捉明显响应式 bug（内容溢出、网格错乱、按钮无法点击）的最快方式。

用二维码在手机上打开

在真实设备上测试最快的方式是使用控制台中的 Mobile → Test 标签页。应用发布后，该页面会显示一个二维码——用手机相机扫描即可立即打开线上应用。如果你更倾向于发送链接给自己，也可以点击 Copy link 按钮。（如果尚未发布，该标签页会提示你先发布——设备测试需要一个线上 URL。）

在真实设备上测试

视口切换器只能模拟尺寸，无法模拟触摸输入、真实网络延迟、移动浏览器的特殊行为或平台专属特性。对于你真正关心的功能（触摸交互、安装提示、推送通知、摄像头、GPS），请务必在真实设备上进行测试：

1. 将你的应用发布到其 *.proyecta.live 子域名
2. 在手机浏览器中打开该 URL
3. 如果你已添加 PWA 支持，选择添加到主屏幕，并测试已安装的体验
4. 逐一走查你关心的功能流程

只有在真实设备上才能发现的问题

• 点击目标大小 —— 手指比鼠标指针大得多
• 固定定位元素 —— 视口单位在移动浏览器工具栏出现时表现不同
• 表单输入 —— 自动填充、键盘类型、自动补全
• iOS Safari 的特殊行为 —— 100vh 问题、滚动回弹、fixed 定位异常
• 推送通知权限流程 —— 仅在通过 HTTPS 提供服务的已发布域名的顶级浏览器标签页中有效；在 builder 的预览面板内无法触发（即使预览本身已通过 HTTPS 提供服务）。
• 性能 —— 在真实（性能较低的）硬件上的表现

测试技巧

• 使用手机的开发者工具。 macOS 上的 Safari 可以连接移动端 Safari 进行实时调试；Chrome 可以连接 Android Chrome。
• 也要测试横屏模式。 大多数开发者只测试竖屏，因此会遗漏横屏下的 bug。
• 开启低电量模式进行测试。 动画和计时器的行为会有所不同。
• 在真实 iPhone 上测试 PWA 推送。 iOS 上的推送通知仅适用于通过 Safari 安装的 PWA。