禁用所有D3动画（用于测试） [英] Disabling all D3 animations (for testing)

问题描述

我在寻找D3等同于 jQuery.fx .off = true 。

假设你正在为一个应用程序编写测试（使用Mocha，QUnit等） D3。该应用程序有一些D3动画（ .transition（））。

动画对测试真的很糟糕： / p>

首先，它们很慢。

其次，因为它们是异步的，所以很容易引起闪烁测试。理想情况下，你想避免对 setTimeout / setInterval / requestAnimationFrame 。

有没有办法禁用所有D3动画，以便他们立即（并且理想地，同步地）跳转到结束状态？ （也许如果没有选项，我们可以加入计时器。 js ？）

解决方案

模拟转换的替代方法是直接同步执行它们的最终状态。 p>

使用D3.js v4，使用：

  function flushAllD3Transitions 
 var now = performance.now; 
 performance.now = function（）{return Infinity; }; 
 d3.timerFlush（）; 
 performance.now = now; 
} 
  

对于D3.js v3及以前版本，请执行：

  function flushAllD3Transitions（）{
 var now = Date.now; 
 Date.now = function（）{return Infinity; }; 
 d3.timer.flush（）; 
 Date.now = now; 
} 
  

另请参阅 d3 issue 1789 。

I'm looking for a D3 equivalent to jQuery.fx.off = true.

Say you are writing tests (with Mocha, QUnit, etc.) for an app that uses D3. The app has some D3 animations (with .transition()).

Animations are really bad for tests:

First, they are slow.

Second, because they are asynchronous, they can easily cause flickering tests. Ideally, you'd want to avoid any calls to setTimeout / setInterval / requestAnimationFrame.

Is there a way to disable all D3 animations, so that they instantly (and ideally, synchronously) jump to the end state? (Perhaps if there's not an option, we can hook into timer.js?)

解决方案

An alternative to mocking out transitions is executing them synchronously directly to their final state.

With D3.js v4, use:

function flushAllD3Transitions() {
    var now = performance.now;
    performance.now = function() { return Infinity; };
    d3.timerFlush();
    performance.now = now;
 }

With D3.js v3 and previous, do:

function flushAllD3Transitions() {
    var now = Date.now;
    Date.now = function() { return Infinity; };
    d3.timer.flush();
    Date.now = now;
 }

See also d3 issue 1789.

这篇关于禁用所有D3动画（用于测试）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！