为什么instanceof在Chrome，Safari和Edge上返回false并在FireFox上返回true？

Question

我正在使用CKEditor上传一些文件，方法是将它们拖到编辑器上。

我在drop事件中看到了这种奇怪的行为。检查事件对象时，我可以访问files属性。调试器将其显示为类型FileList。但是，当我files instanceof FileList时，我在Chrome，Safari和Edge中获得false，在FireFox中获得true（请参阅this fiddle）。

这里发生了什么？

似乎它必须与CKEditor如何路由事件有关，因为没有CKEditor它似乎确实有效。这是我分叉的basic file drag-drop jsfiddle，以便打印instanceof FileList。

我正在通过Object.prototype.toString.call(files) == "[object FileList]"来解决这个问题。但这似乎不是一个好的长期解决方案。

编辑：我已经在Chromium上发布了a bug report，因为我认为这是Chrome中的错误

Answer 1

对错误报告的回复包含了这个问题的答案。

按rbyers：

  

这不仅仅是关于FileList而是整个DragEvent。调试这个我发现CKEditor正在创建一个iframe，因此传递给iframe的事件类型具有与运行事件处理程序的主窗口不同的原型对象。打破'drop'事件监听器（在任何JS运行之前并且可能与事件混乱）：

     

Object.getPrototypeOf(c)===window.DragEvent.prototype
  false

     

Object.getPrototypeOf(c)===document.querySelector('iframe.cke_wysiwyg_frame').contentWindow.DragEvent.prototype
  true

     

请在此处查看instanceof和多个上下文的文档：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/instanceof#instanceof_and_multiple_context_(e.g._frames_or_windows)

     

但是，我确实在Firefox中看到了这种情况的返回实例。这是一个非常简单的复制：http://jsbin.com/yefesuv

如果您阅读了更多回复，则表明Web IDL和ES规范之间存在差异，其中FireFox遵循Web IDL和所有其他浏览器ES。 They have updated the Web IDL spec而FireFox有a bug report。由于向后兼容性，FireFox会改变其行为还需要一段时间。