javascript - 在 Safari 上退出全屏切换空间时 RequestAnimationFrame 不工作

Question

单击原始空间的 Safari 窗口退出全屏时，请求动画帧停止工作。如果使用转义键或调用 cancelFullScreen() 取消全屏模式，一切都很好。

重现步骤:

• 打开https://dl.dropboxusercontent.com/u/769042/prezi/safari-fullscreen.html
• 点击“draw with raf”，出现一只小猫
• 点击“全屏”，进入全屏
• 点击“draw with raf”，出现一只小猫
• 回到原来safari所在的地方，显示“点击退出全屏模式”，点击任意位置，退出全屏
• 点击“draw with raf”，没有任何反应

它所做的只是处理点击调用:

window.requestAnimationFrame(draw);

它只是在 Canvas 上下文中绘制一些东西:

function draw() {
    ctx.drawImage(img, Math.random()*500|0, Math.random()*400|0, 100, 100);
}

我还检查了 .hidden 和 .visibilityState，它们得到了正确的更新。

在 osx 10.9.3、safari 7.0.4 (9537.76.4) 上测试。

除了切换到旧的 setTimeout 之外，有没有人对此有任何解决方法/解决方案？

Answer 1

这听起来像 WebKit Bug 88940 :

Using requestAnimationFrame and the fullscreen API on a DrawingArea-backed window would cause rAF to permanently suspend animations when fullscreened, because of the following:

1. JavaScript causes fullscreen transition to start.
2. Painting (and rAF) are suspended.
3. The page changes size. a. DrawingAreaProxyImpl::sizeDidChange() calls DrawingAreaImpl::updateBackingStoreState, which calls DrawingAreaImpl::resumePainting. b. DrawingAreaImpl::resumePainting resumes painting, but does not resume rAF, because windowIsVisible is (legitimately) false.
4. The view becomes visible, windowIsVisible is updated to true.
5. visibilityDidChange() calls resumePainting again, but this time it early exits because painting is not suspended.

Notice that because of the early exit in 4, rAF is never resumed.

根据此描述，我怀疑没有有效的解决方法，因为绘图区域进入调用 resumePainting 无效的状态。

(感谢 Jason Davies 找到此错误报告。)