在浏览器

Question

我正在http://freecodecamp.com处理挑战，我遇到了一个非常奇怪的错误＆＃34;。当我正在接受挑战时（例如，this one，虽然它发生在任何挑战中），如果我点击帮助来显示他们的帮助聊天，我的外部显示器会开始闪烁并且通常会出现故障。如果我关闭帮助聊天，它会立即恢复正常。如果我将浏览器拖到笔记本电脑上的内置显示器上，问题就会消失。如果我让闪烁继续持续超过几秒钟，它将移动显示器上所有内容的相对位置，例如，屏幕的上半部分显示在底部，反之亦然，这种变化将持续甚至< em>在之后我关闭帮助聊天，直到我拔下显示器并重新插入（打开和关闭显示器是不够的）。

以下是a video on YouTube of what is happening，因为我无法通过屏幕截图捕获它。

出现故障的显示器是HP 2311xi，而我在Ubuntu 16.04上使用的是Google Chrome版本55.0.2883.87。这个小故障出现在其他网站上，但总是很快就消失了，这是我第一次找到一个可以持续重现bug的环境。

查看页面来源，似乎聊天使用了Gitter sidecar，并且我已经确认其他地方使用的边车也会导致此故障，例如the sidecar on their demo site。 （我假设问题不在于Gitter边车本身，而在于他们碰巧使用的东西，也在网络上的其他地方使用过。）

作为JavaScript的学习者，以及对此类事情一般感到好奇的人，我想知道JavaScript或其他地方在我的外部显示器上会产生什么样的影响？

更新

所以我决定连接一台旧的戴尔显示器，看它是否特定于显示器，当我用显示器上显示的浏览器打开Gitter边车时，它几乎立即让显示器进入睡眠< / em> - 屏幕变黑，电源指示灯变为橙色等等。所以显然不是硬件特有的，但不同地影响不同的硬件...

更新2：

同样的事情发生在Firefox中，这并不让我感到惊讶。然而，让我感到惊讶的是，如果我访问已经显示聊天窗口的https://gitter.im/gitterHQ/sidecar-demo（与上面的其他链接不同，其中需要点击按钮以使边车滑出），并且此站点导致相同即使在浏览器中禁用了JavaScript ...

，也会出现故障

更新3：

在另一个没有 Gitter边车的网站上遇到此问题后，我能够进一步缩小原因。我发现当显示这样的链接时（因为它们在许多网站上都有，包括Gitter边车演示）：

  

这足以引起问题。通过在Chrome开发工具中切换css属性，我发现1px dotted black边框似乎是触发器。以下代码行足以为我重现：

<a href="#" style="border-bottom: 1px dotted black">This is a killer link</a>

如果我使边框超过1px，则不会发生（我发现它会在浏览器中以100％的缩放级别停止，并且大小为1.25px ，但仍会发生在＆lt; 1.25px。此外，如果我只将颜色更改为black以外的其他颜色或删除dotted属性，则不会发生故障。

最后一点需要注意的是，当我打开上面链接的屏幕截图时，我发现仅查看相关链接的屏幕截图会导致故障，并放大以便虚线边框更厚会使问题消失（如浏览器中的情况）。

最后几点显示问题根本就是由而不是引起的，我猜甚至与浏览器没有直接关系，因为我只需查看截图即可重现此问题。 / p>