在 ember-cli-mirage 中引入瞬时延迟

Question

我正在使用 ember-cli-mirage 进行验收测试。 对于特定情况，我想在通过慢速连接获取数据时检查行为。

ember-cli-mirage 中有一个设置，称为timing ，用于模拟响应中的延迟。 但是，此设置不能在特定测试中更改为不同：

// app/mirage/config.js
this.timing = 400;

我尝试过的其他事情是在假端点返回承诺。 通过一些导入/导出，我可以从我的测试中控制承诺的分辨率。 不幸的是，ember-cli-mirage 似乎没有将返回值识别为承诺，而只是将其逐字传递回适配器：

// app/mirage/config.js
this.get('/StopPoint/Search/:term', (db, request) => {
  return freezer.run(function() {
    return db[`stop-point-search-${request.params.term}`][0];
  });
});

// At my test
freezer.on()
runTests()
freezer.off()

问题：有没有办法做到这一点？ 即：控制 ember-cli-mirage 中特定响应的延迟？

Answer 1

一些想法：

• 您可以通过server.timing更改特定测试中的时间。 应该为每个测试重新实例化服务器，这样就不会影响其他测试。

   test('for slow behavior', function() { server.timing = 400; // });

• 您还可以在测试中重新定义路由处理程序，如验收测试指南的第二个示例中所示。 如果您使用0.2.0-beta ，路由处理程序有一个timing选项，您可以使用它来影响该处理程序：

   test('for slow behavior', function() { server.get('/slow-query', (schema, request) => { // return data; }, {timing: 400}; visit('/'); // assert(); });

我认为你本能地返回你可以控制冻结的东西将是测试这个的理想方式，与诸如Timecop 之类的东西一起。 也许 Mirage 最终可以为此添加一个 API。

Answer 2

我们必须使用 mirage 测试我们的<progress>元素是否在测试中显示，并发现使render方法同步并搭载waitFor和settled效果最佳（并且根本不需要设置this.server.timing ）：

const SELECTORS = {
    LOADING_SPINNER: '[role="progressbar"]'
};

test('it displays loading spinner when fetching blog post', async function(assert) {
    this.blogId = 1;
    render(hbs`<BlogPost @blogId={{this.blogId}}/>`); // NOTE: no await
    await waitFor(SELECTORS.LOADING_SPINNER);
    assert.dom(SELECTORS.LOADING_SPINNER).exists({ count: 1 }, 'loading spinner rendered while blog post loads');
    await settled();
    assert.dom(SELECTORS.LOADING_SPINNER).doesNotExist('loading spinner removed when blog post loaded');
});