本文基于上一篇,继续测试手机默认浏览器的场景,这次主要测试内容如下:
手机默认浏览器自动播放视频
所有
video
标签都由此扩展
手机默认浏览器,最原始标签,自动播放,视频本身为横屏
2.1 一些已知的手机默认浏览器的限制
- 在未播放和播放完这两个状态中,
ios
和android
结果都比较一致,比如:
- 未播放时,所有手机都满足预期的结果,即不自动播放,样式可控
- 播放完后,几乎所有手机都满足预期,只有华为手机出现了广告的现象。
- 在播放时状态中,两系统差异比较明显,比如:
-
ios
会统一自动全屏播放,且只能在全屏下播放(回到原始尺寸就暂停) -
android
不会自动进去全屏,同时样式上采用黑边填充,视频本身不会拉伸,但进入全屏后,一定会横屏播放,导致用户必须手机旋转到横屏下观看,此时视频高度撑满,宽度左右留有黑边。
- 多个手机同一个系统的,
ios
的结果很一致,android
则有差异,比如:
- 同是
ios
的手机,所有测试情况都是一致的 - 华为,在播放最后,出现了广告
- 魅族,
mov
格式无法播放(原先测试里使用的是mov
格式,当魅族不能播放后,统一改成了mp4
)
将上一次测试的结果,导入到这次的预测里,可以更突出这次的测试重点
封面poster能显示,样式完全按照css设定展示,拉伸 | ||
ios :自动且只能全屏,位于最顶层,看不到浏览器上方的网址
|
非全屏状态下,播放完成后,没有广告 | |
没有进度条,视频中间一个大大的播放按钮 | 按照css样式播放,视频保持原有比例,多余的地方会有黑边覆盖 | 全屏状态下,播放完成后,没有广告 |
进入全屏后,视频会旋转,手机得横着拿,横版视频纵向撑满屏幕,左右两边留黑 | ||
华为手机1,2,3都不满足,最后有广告 |
关于测试预期的简单说明:
- 根据微信x5的经验,
autoplay
标签不起作用,应该都无法自动播放 - 尽量将所有手机已知的情况都写到预期里,避免测试结果汇总显示效果不佳的情况
经测试后,惊讶的发现在android
都能自动播放,ios
都不能。