将于2020年10月6日发布的Google Chrome 86将具有开发工具的更新版本。此更新引入了新功能,扩展了该工具的实用性。发布者将能够在易于访问的新媒体面板中调试视频,可以访问更多仿真器,并利用从Lighthouse到6.2更好的审核优势。
新媒体面板视频调试器的屏幕截图
新媒体面板
Chrome开发者工具现在具有媒体面板,可让您调试视频。
有关如何访问媒体面板的分步说明:
- 单击显示更多选项的三个点。
- 选择更多工具
- 选择“媒体”以显示新的视频调试器工具。
新的媒体面板允许您检查属性,事件,消息和时间轴。
根据Google的说法:
““属性”选项卡显示媒体播放器的属性。单击事件选项卡以查看所有媒体播放器事件。单击消息选项卡以查看媒体播放器消息日志。您可以按日志级别或字符串过滤消息。在“时间轴”选项卡上,您可以实时查看媒体播放和缓冲区状态。”
捕获节点屏幕截图
现在,您可以通过“元素”面板中的上下文下拉菜单来获取特定节点的屏幕截图。
模拟缺少的本地字体
启用后,此功能将忽略计算机上的字体,并表现为缺少字体。这将导致开发工具像新访问者一样获取字体,从而使您可以调试过程。
模拟偏好减少的数据
此设置可以模拟具有为数据保存模式设置浏览器首选项的网站访问者。然后,按偏好减少数据的CSS媒体查询可以显示较小的图像。
这是一项实验功能。
W3c注意到有关此功能可用于识别低收入用户的担忧。
从Chrome 85开始,包括基于Chrome的Microsoft Edge,将支持此媒体查询。
通过启用此仿真,发布者可以查看和调试这些情况下的网页行为。