Testcafe：如何测试请求的 POST 参数答案

【问题标题】：Testcafe: How to test POST parameters of requestTestcafe：如何测试请求的 POST 参数
【发布时间】：2018-10-18 12:34:37
【问题描述】：

我正在测试的页面在单击按钮时发出 POST ajax 请求。我想测试一下，这个请求中发送的参数是否正确。我该怎么办？

这就是我尝试过的：

import {RequestLogger, Selector} from '../../../node_modules/testcafe';

const requestUrl = 'http://localhost:8080/mypage/posttarget';
const logger = RequestLogger({url: requestUrl, method: 'post'}, {logRequestBody: true, logRequestHeaders: true});


fixture `Notifications`.page('http://localhost:8080/mypage')
  .requestHooks(logger);

test('notification request contains id', async t => {
  await t
    .click('#submit-notification')
    .expect(logger.request.body.id)
    .eql(1)
  ;
});

但是 logger.request 是未定义的。 logger.requests.length 也是 0。

如果有人可以告诉我如何检查请求正文，我将不胜感激？

【问题讨论】：

标签： javascript post request e2e-testing testcafe

【解决方案1】：

RequestLogger object 具有 requests property，它是记录的请求数组，但不是单个请求。我尝试使用空的requests 属性重现该问题，但它按预期工作。请检查以下测试代码：

import { RequestLogger } from 'testcafe';

const requestUrl = 'https://demos.devexpress.com/aspxgridviewdemos/gridediting/EditForm.aspx';
const logger = RequestLogger({ url: requestUrl, method: 'post' }, { logRequestBody: true, logRequestHeaders: true });


fixture `Notifications`.page('https://demos.devexpress.com/aspxgridviewdemos/gridediting/EditForm.aspx')
    .requestHooks(logger);

test('notification request contains id', async t => {
    await t.click('#ContentHolder_grid_DXEFL_DXCBtn9');
    await t.expect(logger.requests[0].request.body).ok();
});

UPD。我发现了两者之间的区别：

await t.click('#ContentHolder_grid_DXEFL_DXCBtn9');
await t.expect(logger.requests[0].request.body).ok();

和

await t
    .click('#ContentHolder_grid_DXEFL_DXCBtn9')
    .expect(logger.requests[0].request.body).ok();

第二种情况是行不通的，因为我们需要等到请求完全处理完毕，所以我们需要在断言之前添加一个await

【讨论】：