How to use the testcafe.RequestLogger function in testcafe

import { RequestLogger, RequestMock, Selector } from 'testcafe';
import DeviceChallengePollPageObject from '../framework/page-objects/DeviceChallengePollPageObject';
import identifyWithDeviceProbingLoopback from '../../../playground/mocks/idp/idx/data/identify-with-device-probing-loopback';
import loopbackChallengeNotReceived from '../../../playground/mocks/idp/idx/data/identify-with-device-probing-loopback-challenge-not-received';

const logger = RequestLogger(/localhost/);
  //[
 // 'http://localhost:3000/idp/idx/introspect',
//   'https://localhost:3000/probe2000',
//   'https://localhost:3000/probe6511',
//   'https://localhost:3000/probe6512',
//   'https://localhost:3000/probe6513',
//   'https://localhost:3000/challenge2000',
//   'https://localhost:3000/challenge6511',
//   'https://localhost:3000/challenge6512',
//   'https://localhost:3000/challenge6513',
// ]);

let failureCount = 0;
const mock = RequestMock()
  .onRequestTo('http://localhost:3000/idp/idx/introspect')
  .respond(identifyWithDeviceProbingLoopback)

import {Selector, RequestLogger} from 'testcafe';
import {ReactSelector} from 'testcafe-react-selectors';
import {beforeEach, subSection, checkPropTypes} from './../../utils.js';
import {Page} from './../../pageModel';

/* global fixture:true */

const changeRequestLogger = RequestLogger(request => request.url.endsWith('/neos/ui-services/change') && request.method === 'post' && request.isAjax);

fixture`Create new nodes`
    .beforeEach(beforeEach)
    .afterEach(() => checkPropTypes())
    .requestHooks(changeRequestLogger);

test('Create an Image node from ContentTree', async t => {
    await t.switchToIframe('[name="neos-content-main"]');
    const initialImageCount = await Selector('.test-image img[src]').count;
    await t.switchToMainWindow();

    subSection('Create Image node');
    await t
        .click(Selector('#neos-ContentTree-ToggleContentTree'))
        .click(Page.treeNode.withText('Content Collection (main)'))
        .click(Selector('#neos-ContentTree-AddNode'))

export const host = 'http://localhost:5000';

async function fetchFromAPI(requestURL) {
  const response = await fetch(requestURL);
  const jsonData = await response.json();

  console.log(`writing ./testcafe/cachedAjax/${path2file(requestURL)}.json`);
  fs.writeFileSync(`./testcafe/cachedAjax/${path2file(requestURL)}.json`, JSON.stringify(jsonData, null, '\t'), (err) => {
    if (err) {
      console.log(err);
    }
  });
}

const logger = RequestLogger(/api.opendota.com\/api/);

function path2file(url) {
  return sanitize(url.replace('https://api.opendota.com/api/', ''), {
    replacement: '_',
  }).substr(0, 200);
}

export const fixtureBeforeHook = async (ctx) => {
  ctx.requests = [];
};

export const fixtureBeforeEachHook = async () => {
  await waitForReact(180000);
};

export const fixtureAfterHook = async (ctx) => {

class CustomRequestHook extends RequestHook {
    constructor() {
        super();
    }

    async onRequest (event: object) {

    }

    async onResponse (event: object) {

    }
}

const customHook = new CustomRequestHook();
const logger1    = RequestLogger('example.com', {logRequestBody: true});

const logger2 = RequestLogger(req => {
    return req.url === 'example.com';
});

const mock = RequestMock()
    .onRequestTo(/example.com/)
    .respond()
    .onRequestTo({url: 'https://example.com'})
    .respond(null, 204)
    .onRequestTo('https://example.com')
    .respond(null, 200, {'x-frame-options': 'deny'})
    .onRequestTo(req => {
        return req.url === 'https://example.com';
    }).respond((req, res) => {
        if (req.url === 'https://example.com')

.onRequestTo('http://localhost:3000/idp/idx')
  .respond(magicLinkReturnTab)

const magicLinkExpiredMock = RequestMock()
  .onRequestTo('http://localhost:3000/idp/idx')
  .respond(magicLinkExpired)

const magicLinkEmailSentMock = RequestMock()
  .onRequestTo('http://localhost:3000/idp/idx')
  .respond(magicLinkEmailSent)

const resendEmailMock = RequestMock()
  .onRequestTo('http://localhost:3000/idp/idx/challenge/resend')
  .respond(magicLinkEmailSent)

const logger = RequestLogger(/poll|resend/);

fixture(`Challenge Email Magic Link Form Content`)

async function setup(t) {
  const identityPage = new IdentityPageObject(t);
  await identityPage.navigateToPage();
  await identityPage.fillIdentifierField('Challenge Email');
  await identityPage.clickNextButton();
  return new ChallengeFactorPageObject(t);
}

test
  .requestHooks(magicLinkReturnTabMock)
  (`challenge email factor with magic link`, async t => {
    const challengeFactorPageObject = await setup(t);
    const pageSubTitle = challengeFactorPageObject.getPageSubTitle('.okta-form-subtitle');

import { RequestLogger, Selector, ClientFunction } from 'testcafe';
import parseUserAgent from '../../../../../../../../lib/utils/parse-user-agent';

const pageUrl = 'http://localhost:3000/fixtures/api/es-next/request-hooks/pages/multi-browser.html';

const logger = new RequestLogger(
    {
        url:    /get-browser-name/,
        isAjax: true
    },
    {
        logResponseBody:       true,
        stringifyResponseBody: true
    });

fixture `RequestLogger`
    .page(pageUrl);

test
    .requestHooks(logger)
    ('Multi-browser', async t => {
        const buttonSelector = Selector('button');

super();
    }

    async onRequest (event: object) {

    }

    async onResponse (event: object) {

    }
}

const customHook = new CustomRequestHook();
const logger1    = RequestLogger('example.com', {logRequestBody: true});

const logger2 = RequestLogger(req => {
    return req.url === 'example.com';
});

const mock = RequestMock()
    .onRequestTo(/example.com/)
    .respond()
    .onRequestTo({url: 'https://example.com'})
    .respond(null, 204)
    .onRequestTo('https://example.com')
    .respond(null, 200, {'x-frame-options': 'deny'})
    .onRequestTo(req => {
        return req.url === 'https://example.com';
    }).respond((req, res) => {
        if (req.url === 'https://example.com')
            res.statusCode = '200';
    });

import { ClientFunction, RequestLogger } from 'testcafe';
import parseUserAgent from '../../../../../../../../lib/utils/parse-user-agent';

const pageUrl = 'http://localhost:3000/fixtures/api/es-next/request-hooks/pages/index.html';
const logger1 = new RequestLogger(pageUrl);
const logger2 = new RequestLogger(pageUrl);

fixture `Fixture`
    .page(pageUrl);

test
    .requestHooks(logger1)
    ('Conditional adding', async t => {
        const userAgentStr = await ClientFunction(() => window.navigator.userAgent)();
        const browserName  = parseUserAgent(userAgentStr).name;

        if (browserName === 'Chrome')
            await t.addRequestHooks(logger2);

        await t
            .navigateTo(pageUrl)

import { ClientFunction, RequestLogger } from 'testcafe';
import parseUserAgent from '../../../../../../../../lib/utils/parse-user-agent';

const pageUrl = 'http://localhost:3000/fixtures/api/es-next/request-hooks/pages/index.html';
const logger1 = new RequestLogger(pageUrl);
const logger2 = new RequestLogger(pageUrl);

fixture `Fixture`
    .page(pageUrl);

test
    .requestHooks(logger1)
    ('Conditional adding', async t => {
        const userAgentStr = await ClientFunction(() => window.navigator.userAgent)();
        const browserName  = parseUserAgent(userAgentStr).name;

        if (browserName === 'Chrome')
            await t.addRequestHooks(logger2);

        await t
            .navigateTo(pageUrl)
            .expect(logger1.contains(r => r.request.url === pageUrl)).ok();

import { RequestLogger } from 'testcafe';
import config from '../../../../../../config';

const pageUrl = 'http://localhost:3000/fixtures/api/es-next/request-hooks/pages/index.html';
const logger  = new RequestLogger(pageUrl);

fixture `RequestLogger`
    .page(pageUrl);

test
    .requestHooks(logger)
    ('API', async t => {
        await t
            .expect(logger.contains(r => r.response.statusCode === 200)).ok()
            .expect(logger.count(r => r.request.url === pageUrl)).eql(config.retryTestPages ? 2 : 1);

        logger.clear();

        await t
            .expect(logger.contains(r => r.response.statusCode === 200)).notOk()
            .expect(logger.requests.length).eql(0);