Firefox Inspector输出与渲染页面不匹配

Question

问题

我的情况是Firefox页面渲染与检查器html不匹配 - 也就是说，如果我将检查器的outerHTML复制到新文档中，它会正确呈现。 这怎么可能？

这肯定是一个Firefox错误，还是有一些中间渲染状态，其中检查器输出已更新但页面视图还没有？ （如果是这样，我将如何强制渲染进入此中间状态？）

额外细节

• 我也可以＆＃34;修复＆＃34;通过手动（在检查器中）编辑未正确显示的属性进行渲染。
  • 具体来说，例如，我可能会遇到代码正在调用setAttribute('width',10)的情况，这会导致检查员说width="10"，但会导致页面显示先前设置的宽度。如果我用width="10"手动替换width="10"，则不会发生任何事情;但是，如果我将width="10"更改为width="11"，则宽度显示为11，之后我可以再次将宽度设置为10以使其正确显示。
• 不幸的是，我还没有能够设计出一个简单的例子来证明这一点。我的具体案例与相当数量的渲染代码纠缠在一起，并涉及更改svg foreignObject s上的维度，但我主要对检查器和页面呈现如何的一般问题的答案感兴趣。不同步。
  • （我无法在任何其他浏览器中重现此问题，因为Firefox目前是唯一真正正确处理foreignObject的人。）
• Firefox版本：Mac 10.10.5上的51.0.1（64位）

更新

• 主要问题仍然存在，但我越来越多地认为一个微妙的Firefox漏洞就是其中的根源。一些原因：
  • 刷新页面有时会改变行为，有时候不会改变。
  • 我尝试在每个getBBox之后立即添加setAttribute次调用，以强制浏览器重新计算布局。这似乎适用于每个foreignObject - 除了页面上的第一个。 （但是，有时第一个出现 - 似乎没有任何改变。）
  • JQuery＆＃39; .attr似乎产生的行为与.setAttribute和.setAttributeNS
  不同