Skip to content

When making use of axios CancelToken, ReferenceError: exports is not defined at xhr.onabort error occurs #11238

@dangrima90

Description

@dangrima90

Issue Description

When making use of axios' CancelToken, ReferenceError: exports is not defined at xhr.onabort error occurs.

In my code base I've had this issue due to a production issue and fixed it via patching the packages/core/fetch/index.mjs file. I replaced exports.DOMException with DOMException in these two instances:

function fetch(input, init) {
return new Promise(function (resolve, reject) {
var request = new Request(input, init);
if (request.signal && request.signal.aborted) {
return reject(new exports.DOMException("Aborted", "AbortError"));
}

xhr.onabort = function () {
reject(new exports.DOMException("Aborted", "AbortError"));
};

I believe with the changes done here: cc0b503, DOMException can be accessed from the exported classes.

If it helps I have a branch ready with the changes which I can push too :)

Reproduction

Sample code:

// service.js
let requestSource;

getData() {
  if (requestSource) {
    requestSource.cancel('Request cancelled!');
  }

  const currentSource = axios.CancelToken.source();
  requestSource = currentSource;

  const config = {
    cancelToken: requestSource.token
  };

  return axios.get('api/get-data', undefined, config).finally(() => {
    if (requestSource === currentSource) {
      requestSource = undefined;
    }
  });
}
// somewhere in app call function
try {
  getData();
} catch (e) {
  console.log('Error ::', e); // results in ReferenceError: exports is not defined at xhr.onabort
}

Relevant log output (if applicable)

Environment

No response

Please accept these terms

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions