feat: Allow aborting uploads using AbortSignal (#110)

Author: lucaas

source/session.ts

@@ -926,6 +926,8 @@ export class Session {
  * @param {?object} [options = {}] - Options
  * @param {?string} options.name - Component name. Defaults get from file object.
  * @param {?number} options.data - Component data. Defaults to {}.
+ * @param {XMLHttpRequest} options.xhr - Custom XHR object, deprecated in favor of options.signal.
+ * @param {AbortSignal} options.signal - Abort signal
  * @return {Promise} Promise resolved with the response when creating
  * Component and ComponentLocation.
  */
@@ -949,6 +951,12 @@ export class Session {
  const defaultProgress = (progress: number) => progress;
  const defaultAbort = () => {};
 
+ if (options.xhr) {
+ logger.warn(
+ "[session.createComponent] options.xhr is deprecated, use options.signal for aborting uploads."
+ );
+ }
+
  const data = options.data || {};
  const onProgress = options.onProgress || defaultProgress;
  const xhr = options.xhr || new XMLHttpRequest();
@@ -962,6 +970,12 @@ export class Session {
  let url: string;
  let headers: Record<string, string> = {};
 
+ const handleAbortSignal = () => {
+ xhr.abort();
+ options.signal?.removeEventListener("abort", handleAbortSignal);
+ };
+ options.signal?.addEventListener("abort", handleAbortSignal);
+
  const updateOnProgressCallback = (
  oEvent: ProgressEvent<XMLHttpRequestEventTarget>
  ) => {

source/types.ts

@@ -19,6 +19,7 @@ export interface CreateComponentOptions {
  data?: Data;
  onProgress?: (progress: number) => unknown;
  xhr?: XMLHttpRequest;
+ signal?: AbortSignal;
  onAborted?: () => unknown;
 }
 

test/session.test.js

@@ -289,7 +289,7 @@ describe("Session", () => {
  });
  });
 
- it("Should support abort of uploading file", async () => {
+ it("Should support abort of uploading file using xhr", async () => {
  const data = { foo: "bar" };
  const blob = new Blob([JSON.stringify(data)], {
  type: "application/json",
@@ -313,6 +313,30 @@ describe("Session", () => {
  await expect(promise).resolves.toEqual(true);
  });
 
+ it("Should support abort of uploading file using signal", async () => {
+ const data = { foo: "bar" };
+ const blob = new Blob([JSON.stringify(data)], {
+ type: "application/json",
+ });
+
+ const controller = new AbortController();
+ const promise = new Promise((resolve) => {
+ const onAborted = () => {
+ resolve(true);
+ };
+
+ session.createComponent(blob, {
+ signal: controller.signal,
+ name: "data.json",
+ onProgress: () => {
+ controller.abort();
+ },
+ onAborted,
+ });
+ });
+ await expect(promise).resolves.toEqual(true);
+ });
+
  it.skip("Should support ensure with create", async () => {
  const identifyingKeys = ["key", "parent_id", "parent_type"];
  const key = uuidV4();