ClientFunction: _axios2 is not defined

Question

I'm running TestCafe for UI automation, using ClientFunctions to trigger API requests (so that I can pass along session cookies).

Currently I have a ClientFunction with fetch which works fine... except we're now testing IE 11 and Fetch is unsupported.

Fetch code:

const fetchRequestClientFunction = ClientFunction((details, endpoint, auth, method) => {
  return window
    .fetch(endpoint, {
      method,
      credentials: 'include',
      headers: new Headers({
        accept: 'application/json',
        'Content-Type': 'application/json',
      }),
      body: JSON.stringify(details),
    })
    .then(httpResponse => {
      if (httpResponse.ok) {
        return httpResponse.json();
      }
      return {
        err: true,
        errorMessage: `There was an error trying to send the data ${JSON.stringify(
          details
        )} to the API endpoint ${endpoint}. Status: ${httpResponse.status}; Status text: ${httpResponse.statusText}`,
      };
    });
});

However when I try to switch it to axios... not so much:

import axios from 'axios';

const axiosRequest = ClientFunction((details, endpoint, auth, method) => {
  return axios({
      method,
      auth,
      url: endpoint,
      data: details,
      headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json',
      },
      timeout: 3000,
    })
    .then(httpResponse => {
      if (httpResponse.status < 300) return httpResponse;

      return {
        err: true,
        errorMessage: `There was an error trying to send the data ${JSON.stringify(
          details
        )} to the API endpoint ${endpoint}. Status: ${httpResponse.status}; Status text: ${httpResponse.statusText}`,
      };
    });
});

Tried using window.axios, and also passing axios as a dependency. I've also tried making the axios request without the ClientFunction... and despite getting response of 200, the website wasn't updated as expected.

Each time I either get _axios2 is not defined or window.axios is not a function. I would greatly appreciate some guidance here.

Answer 1

TestCafe ClientFunctions allow only serializable objects as dependencies. You need to have axios on the client side to send such a request.