Testcafe: How to test POST parameters of request

Question

The page I am testing makes a POST ajax request when clicking a button. I would like to test, if the parameters that are being sent in this request are correct. How would I go about that?

This is, what I tried:

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)
  ;
});

But logger.request is undefined. Also logger.requests.length is 0.

I would appreciate it, if someone could show me how I can check the request body?

Answer 1

The RequestLogger object has the requests property, which is an array of logged requests, but not a single request.   I've tried to reproduce the issue with an empty requests property but it works as expected. Please check the following test code:

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. I've found a difference between:

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

and

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

  The second case is not working because we need to wait until the request is fully processed, and so we need to add an await before assertion