在 Safari 中播放 HLS 视频时,错误的元素会全屏显示

作者: awilfox创建于 2025年5月20日更新于 2025年6月6日

如果选择 DASH 输入,则可以在 MediaElement 网站上重现此问题,并且在使用原生 DASH 或 HLS 功能的任何网站上也可以重现此问题。JS 在 `t.media.originalNode` 上调用 `webkitEnterFullscreen`,而不是在 `t.node` 上调用。`originalNode` 在 https://GitHub.com/mediaelement/mediaelement/blob/1db45837bc7634524d7db273fbb4aa82897557a5/src/js/renderers/dash.js#L238 中设置为 `display: none;`,而在 https://GitHub.com/mediaelement/mediaelement/blob/1db45837bc7634524d7db273fbb4aa82897557a5/src/js/renderers/hls.js#L270 中设置为 `display: none;`。Safari 会很高兴地将此元素全屏显示,但由于它设置为 `display:none;`, 无法与之交互。实际上,页面位于不可视的 <video/> 元素后面;在我本地的重现器中,整个文本和播放器就是这个元素。在 mejs 网站上,可显示的内容是海报。我将在 `t.node` 中进行更改,这将解决这个问题(在 Safari 17 和 18 中进行了测试),但我没有能力测试每种播放器类型。在合并之前,更多地测试其他视频类型将是非常欢迎的。

内容来源: mediaelement/mediaelement