xhr.requestHandler.ts

import { HttpRequestHandler, NormalizedHttpOptions, RawHttpResponse } from '../httpClient.types';
import { HttpResponseHeaders } from '../httpResponseHeaders';
import { encodeText, getEncodingFromHeaders } from '../helpers/encoder.helper';
import { HttpRequestError } from '../httpRequestError';

const HEADERS_RECEIVED = 2;
const DONE = 4;

const createAsyncBodyHandler = <T>() => {
  let isCalled = false;

  let onBodyReceived: (body: T) => void;
  let bodyGetter: () => T;

  let onBodyFailure: (error: any) => void;
  let bodyFailer: () => T;

  const promise = new Promise<T>((resolve, reject) => {
    onBodyReceived = resolve;
    onBodyFailure = reject;
  });

  return {
    call: () => {
      isCalled = true;
      if (bodyGetter) {
        onBodyReceived(bodyGetter());
      } else if (bodyFailer) {
        onBodyFailure(bodyFailer());
      }
      return promise;
    },
    onBodyReceived: (getter: () => T) => {
      if (isCalled) {
        onBodyReceived(getter());
      } else {
        bodyGetter = getter;
      }
    },
    onBodyFailure: (failer: () => any) => {
      if (isCalled) {
        onBodyFailure(failer());
      } else {
        bodyFailer = failer;
      }
    },
  };
};

// TODO Extract to '@coolio/xhr-request-handler'
export const xhrRequestHandler = (): HttpRequestHandler => async (
  requestOptions: NormalizedHttpOptions,
): Promise<RawHttpResponse> => {
  if (typeof XMLHttpRequest === 'undefined') {
    throw new Error(
      'XMLHttpRequest is not present. Prior to using xhrRequestHandler, make sure that you included necessary polyfills.'
    );
  }

  return new Promise((resolve, reject) => {
    const isCors = requestOptions.mode === 'cors';
    const req = new XMLHttpRequest();
    if (isCors) {
      req.withCredentials = true;
    }
    req.open(requestOptions.method!, requestOptions.url, true);
    req.responseType = 'arraybuffer';
    req.timeout = requestOptions.timeout;
    req.ontimeout = () => {
      reject(new HttpRequestError(requestOptions, `Request timed out after ${requestOptions.timeout}ms.`));
    };

    for (const key in requestOptions.headers) {
      if (requestOptions.headers.hasOwnProperty(key)) {
        req.setRequestHeader(key, requestOptions.headers[key]);
      }
    }

    const bodyHandler = createAsyncBodyHandler<ArrayBuffer>();

    req.onerror = () => {
      const error = new Error('XHR request error');
      reject(error);
      bodyHandler.onBodyFailure(() => error);
    };
    req.onreadystatechange = () => {
      let response: RawHttpResponse | undefined;
      switch (req.readyState) {
        case HEADERS_RECEIVED:
          resolve(response = {
            arrayBuffer: bodyHandler.call,
            text: () => bodyHandler.call()
              .then(buffer => encodeText(buffer, getEncodingFromHeaders(response?.headers))),
            abort: () => req.abort(),
            url: requestOptions.url,
            headers: new HttpResponseHeaders(req.getAllResponseHeaders()),
            ok: req.status > 0 && req.status < 400,
            status: req.status,
            statusText: req.statusText,
            redirected: false,
          });
          break;
        case DONE:
          bodyHandler.onBodyReceived(() => req.response);
          break;
      }
    };
    req.send(requestOptions.body);
  });
};