在Chrome 67.0.3396.87视频背后的黑盒子

Question

在页面上有一个HTML标签的视频，从对话者（WebRTС）播放视频。

<div id="remoteVideoContainer">
    <video id="remotevideo" autoplay="autoplay" controls="" loop="loop" preload="true" 
height="500" width="100%">
    </video>
</div>

和CSS与此相关的部分：

video {
    display: inline-block;
    vertical-align: baseline;
}    

升级Chrome浏览器67.0.3396.87版本后，我有一个非常奇怪的错误 - 一个黑盒子（或两个）是根据窗口（对于某些尺寸消失）的尺寸的大小。还有一个在全屏模式下的孔。可能是什么问题呢？这里是内联模式：

这里是全屏幕：

在早期版本的Chrome浏览器有没有这样的问题。它也不会在其他浏览器存在。

Answer 1

尽量不要从HTML但JS创建视频元素。例如：

var el = document.createElement('video');
el.setAttribute('controls', 'true');
....

我认为它帮助。

Answer 2

这很有趣，在最新版本的Chrome Canary构建和不能复制这个问题。你唯一的解决办法就是等待下一个更新的铬。这个问题是不是在你的代码，这是对我可以保证固定在即将更新的浏览器。

Answer 3

像Sethu说，它似乎是铬，而不是你的代码。是否有一个浏览器测试版构建你可以试试它现在可能有一个修复？如果没有，也许你可以回滚到以前的Chrome版本。