d3单位测试过渡 [英] d3 transition in unit-testing

问题描述

我有一个由 d3 构建的图表，它显示转换，当所有转换结束时，我需要测试图表。我使用 jasmine 进行单元测试。怎么做？
我找到方法 d3.timer.flush（），但它只跳过第一帧，但我想跳过所有的动画，现在看到最终结果，

I have an chart built by d3 and which appears with transitions and I need to test chart when all transitions have ended. I use jasmine for unit-testing. How to do it? I find method d3.timer.flush(), but it skips only first frame, but I want to skip all animations and see an final result right now and make some assertions on it.

推荐答案

您可以直接执行转换到它们的最终状态，同时调用D3的计时器刷新在刷新期间模拟其时间戳确定，如下所示：

You can execute transitions synchronously directly to their final state with one call to D3's timer flush if you mock out its timestamp determination during the flush like so:

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

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

使用D3.js v4，执行：

With D3.js v4, do:

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

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

With D3.js v3 and previous, do:

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

完全模拟转换（以避免计算开销） ，例如，如果您的最终状态是使用 attrTween 创建的，则需要执行。

Mocking the transition altogether (to avoid the calculation overhead) yielded mixed results for me, for example if your final state is created with an attrTween, it needs to be executed.

d3问题1789 和 SO 14443724 。

这篇关于d3单位测试过渡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！