@angular-wave/angular.ts 0.9.3 → 0.9.4

package/src/services/http/http.js

@@ -1,4 +1,7 @@
-import { urlIsAllowedOriginFactory } from "../../shared/url-utils/url-utils.js";
+import {
+  trimEmptyHash,
+  urlIsAllowedOriginFactory,
+} from "../../shared/url-utils/url-utils.js";
 import {
   minErr,
   isObject,
@@ -20,8 +23,10 @@ import {
   uppercase,
   isPromiseLike,
 } from "../../shared/utils.js";
-import { getCookies } from "../cookie-reader.js";
+import { $injectTokens as $t } from "../../injection-tokens.js";
 
+let lastCookies = {};
+let lastCookieString = "";
 const APPLICATION_JSON = "application/json";
 const CONTENT_TYPE_APPLICATION_JSON = {
   "Content-Type": `${APPLICATION_JSON};charset=utf-8`,
@@ -53,8 +58,12 @@ function serializeValue(v) {
  * Note that serializer will sort the request parameters alphabetically.
  */
 export function HttpParamSerializerProvider() {
-  this.$get = function () {
-    return function ngParamSerializer(params) {
+  /**
+   * @returns {import('./interface.ts').HttpParamSerializer}
+   * A function that serializes parameters into a query string.
+   */
+  this.$get = () => {
+    return (params) => {
       if (!params) return "";
       const parts = [];
       Object.keys(params)
@@ -380,17 +389,15 @@ export function HttpProvider() {
   });
 
   this.$get = [
-    "$httpBackend",
-    "$injector",
-    "$sce",
+    $t.$injector,
+    $t.$sce,
     /**
      *
-     * @param {*} $httpBackend
      * @param {import("../../core/di/internal-injector.js").InjectorService} $injector
      * @param {*} $sce
      * @returns
      */
-    function ($httpBackend, $injector, $sce) {
+    function ($injector, $sce) {
       /**
        * @type {Map<string, string>}
        */
@@ -726,7 +733,7 @@ export function HttpProvider() {
        * Makes the request.
        *
        * !!! ACCESSES CLOSURE VARS:
-       * $httpBackend, defaults, $log, $rootScope, defaultCache, $http.pendingRequests
+       * defaults, $log, $rootScope, defaultCache, $http.pendingRequests
        */
       function sendReq(config, reqData) {
         const { promise, resolve, reject } = Promise.withResolvers();
@@ -797,7 +804,7 @@ export function HttpProvider() {
               xsrfValue;
           }
 
-          $httpBackend(
+          http(
             config.method,
             url,
             reqData,
@@ -813,6 +820,10 @@ export function HttpProvider() {
 
         return promise;
 
+        /**
+         * @param eventHandlers
+         * @return {Record<string, EventListener>}
+         */
         function createApplyHandlers(eventHandlers) {
           if (eventHandlers) {
             const applyHandlers = {};
@@ -829,12 +840,14 @@ export function HttpProvider() {
                 }
               };
             });
-            return applyHandlers;
+            return /** @type {Record<string, EventListener>} */ (applyHandlers);
+          } else {
+            return {};
           }
         }
 
         /**
-         * Callback registered to $httpBackend():
+         * Callback registered to http():
          *  - caches the response if desired
          *  - resolves the raw $http promise
          *  - calls $apply
@@ -920,3 +933,177 @@ export function HttpProvider() {
     },
   ];
 }
+
+/**
+ * Makes an HTTP request using XMLHttpRequest with flexible options.
+ *
+ * @param {string} method - The HTTP method (e.g., "GET", "POST").
+ * @param {string} [url] - The URL to send the request to. Defaults to the current page URL.
+ * @param {*} [post] - The body to send with the request, if any.
+ * @param {function(number, any, string|null, string, string): void} [callback] - Callback invoked when the request completes.
+ * @param {Object<string, string|undefined>} [headers] - Headers to set on the request.
+ * @param {number|Promise<any>} [timeout] - Timeout in ms or a cancellable promise.
+ * @param {boolean} [withCredentials] - Whether to send credentials with the request.
+ * @param {XMLHttpRequestResponseType} [responseType] - The type of data expected in the response.
+ * @param {Record<string, EventListener>} [eventHandlers] - Event listeners for the XMLHttpRequest object.
+ * @param {Record<string, EventListener>} [uploadEventHandlers] - Event listeners for the XMLHttpRequest.upload object.
+ * @returns {void}
+ */
+export function http(
+  method,
+  url,
+  post,
+  callback,
+  headers,
+  timeout,
+  withCredentials,
+  responseType,
+  eventHandlers,
+  uploadEventHandlers,
+) {
+  url = url || trimEmptyHash(window.location.href);
+
+  const xhr = new XMLHttpRequest();
+  let abortedByTimeout = false;
+  let timeoutId;
+
+  xhr.open(method, url, true);
+
+  if (headers) {
+    for (const [key, value] of Object.entries(headers)) {
+      if (isDefined(value)) {
+        xhr.setRequestHeader(key, value);
+      }
+    }
+  }
+
+  xhr.onload = () => {
+    let status = xhr.status || 0;
+    const statusText = xhr.statusText || "";
+
+    if (status === 0) {
+      status = xhr.response ? 200 : new URL(url).protocol === "file:" ? 404 : 0;
+    }
+
+    completeRequest(
+      status,
+      xhr.response,
+      xhr.getAllResponseHeaders(),
+      statusText,
+      "complete",
+    );
+  };
+
+  xhr.onerror = () => completeRequest(-1, null, null, "", "error");
+  xhr.ontimeout = () => completeRequest(-1, null, null, "", "timeout");
+
+  xhr.onabort = () => {
+    completeRequest(-1, null, null, "", abortedByTimeout ? "timeout" : "abort");
+  };
+
+  if (eventHandlers) {
+    for (const [key, handler] of Object.entries(eventHandlers)) {
+      xhr.addEventListener(key, handler);
+    }
+  }
+
+  if (uploadEventHandlers) {
+    for (const [key, handler] of Object.entries(uploadEventHandlers)) {
+      xhr.upload.addEventListener(key, handler);
+    }
+  }
+
+  if (withCredentials) {
+    xhr.withCredentials = true;
+  }
+
+  if (responseType) {
+    try {
+      xhr.responseType = responseType;
+    } catch (e) {
+      if (responseType !== "json") throw e;
+    }
+  }
+
+  xhr.send(isUndefined(post) ? null : post);
+
+  if (typeof timeout === "number" && timeout > 0) {
+    timeoutId = setTimeout(() => timeoutRequest("timeout"), timeout);
+  } else if (isPromiseLike(timeout)) {
+    /** @type {Promise} */ (timeout).then(() => {
+      timeoutRequest(isDefined(timeout["$$timeoutId"]) ? "timeout" : "abort");
+    });
+  }
+
+  /**
+   * @param {"timeout"|"abort"} reason
+   */
+  function timeoutRequest(reason) {
+    abortedByTimeout = reason === "timeout";
+    if (xhr) xhr.abort();
+  }
+
+  /**
+   * @param {number} status - HTTP status code or -1 for network errors.
+   * @param {*} response - The parsed or raw response from the server.
+   * @param {string|null} headersString - The raw response headers as a string.
+   * @param {string} statusText - The status text returned by the server.
+   * @param {"complete"|"error"|"timeout"|"abort"} xhrStatus - Final status of the request.
+   */
+  function completeRequest(
+    status,
+    response,
+    headersString,
+    statusText,
+    xhrStatus,
+  ) {
+    if (isDefined(timeoutId)) {
+      clearTimeout(timeoutId);
+    }
+    callback(status, response, headersString, statusText, xhrStatus);
+  }
+}
+
+/**
+ * @returns {Object<String, String>} List of all cookies
+ */
+function getCookies() {
+  let cookieArray;
+  let cookie;
+  let i;
+  let index;
+  let name;
+  const currentCookieString = document.cookie;
+
+  if (currentCookieString !== lastCookieString) {
+    lastCookieString = currentCookieString;
+    cookieArray = lastCookieString.split("; ");
+    lastCookies = {};
+
+    for (i = 0; i < cookieArray.length; i++) {
+      cookie = cookieArray[i];
+      index = cookie.indexOf("=");
+      if (index > 0) {
+        // ignore nameless cookies
+        name = safeDecodeURIComponent(cookie.substring(0, index));
+        // the first value that is seen for a cookie is the most
+        // specific one.  values for the same cookie name that
+        // follow are for less specific paths.
+        if (isUndefined(lastCookies[name])) {
+          lastCookies[name] = safeDecodeURIComponent(
+            cookie.substring(index + 1),
+          );
+        }
+      }
+    }
+  }
+  return lastCookies;
+}
+
+function safeDecodeURIComponent(str) {
+  try {
+    return decodeURIComponent(str);
+  } catch {
+    return str;
+  }
+}

package/src/services/http/http.spec.js

@@ -2,23 +2,17 @@ import { createInjector } from "../../core/di/injector.js";
 import { isObject } from "../../shared/utils.js";
 import { Angular } from "../../angular.js";
 import { wait } from "../../shared/test-utils.js";
-
-export function getLastAjaxRequest() {
-  let ajaxEntries = performance
-    .getEntriesByType("resource")
-    .filter((entry) => entry.initiatorType === "xmlhttprequest");
-  return ajaxEntries[ajaxEntries.length - 1];
-}
+import { http } from "./http.js";
+import sinon from "sinon";
 
 describe("$http", function () {
-  let $http, $injector, $httpBackend, requests, response, $rootScope;
+  let $http, $injector, requests, response, $rootScope;
 
   beforeEach(function () {
     window.angular = new Angular();
     requests = [];
     $injector = createInjector(["ng"]);
     $http = $injector.get("$http");
-    $httpBackend = $injector.get("$httpBackend");
     $rootScope = $injector.get("$rootScope");
   });
 
@@ -1143,6 +1137,391 @@ describe("$http", function () {
   });
 });
 
+describe("http", () => {
+  let $backend;
+  let xhr;
+  let callback;
+  let requests;
+  let angular;
+
+  beforeEach(() => {
+    xhr = sinon.useFakeXMLHttpRequest();
+    requests = [];
+    xhr.onCreate = function (req) {
+      requests.push(req);
+    };
+    angular = window.angular = new Angular();
+    callback = jasmine.createSpy("done");
+  });
+
+  afterEach(() => {
+    xhr.restore();
+  });
+
+  it("should do basics - open async xhr and send data", () => {
+    http("GET", "/some-url", "some-data", () => {});
+    expect(requests.length).toBe(1);
+    expect(requests[0].method).toBe("GET");
+    expect(requests[0].url).toBe("/some-url");
+    expect(requests[0].requestBody).toBe("some-data");
+    expect(requests[0].async).toBe(true);
+  });
+
+  it("should pass null to send if no body is set", () => {
+    http("GET", "/some-url", undefined, () => {});
+    expect(requests[0].requestBody).toBe(null);
+  });
+
+  it("should pass the correct falsy value to send if falsy body is set (excluding undefined, NaN)", () => {
+    [false, 0, "", null].forEach((value, index) => {
+      http("GET", "/some-url", value, () => {});
+      expect(requests[index].requestBody).toBe(value);
+    });
+  });
+
+  it("should pass NaN to send if NaN body is set", () => {
+    http("GET", "/some-url", NaN, () => {});
+    expect(isNaN(requests[0].requestBody)).toEqual(true);
+  });
+
+  it("should call completion function with xhr.statusText if present", () => {
+    callback.and.callFake((status, response, headers, statusText) => {
+      expect(statusText).toBe("OK");
+    });
+
+    http("GET", "/some-url", null, callback);
+    requests[0].respond(200);
+    expect(callback).toHaveBeenCalled();
+  });
+
+  it("should set only the requested headers", () => {
+    http("POST", "URL", null, () => {}, {
+      "X-header1": "value1",
+      "X-header2": "value2",
+    });
+    expect(requests[0].requestHeaders["X-header1"]).toEqual("value1");
+    expect(requests[0].requestHeaders["X-header2"]).toEqual("value2");
+  });
+
+  it("should not try to read response data when request is aborted", () => {
+    callback.and.callFake((status, response, headers, statusText) => {
+      expect(status).toBe(-1);
+      expect(response).toBe(null);
+      expect(headers).toBe(null);
+      expect(statusText).toBe("");
+    });
+    http("GET", "/url", null, callback, {}, 2000);
+    requests[0].respond(0);
+    expect(callback).toHaveBeenCalled();
+  });
+
+  it("should complete the request on abort", () => {
+    callback.and.callFake(
+      (status, response, headers, statusText, xhrStatus) => {
+        expect(status).toBe(-1);
+        expect(response).toBe(null);
+        expect(headers).toBe(null);
+        expect(statusText).toBe("");
+      },
+    );
+    http("GET", "/url", null, callback, {});
+
+    expect(callback).not.toHaveBeenCalled();
+    requests[0].error();
+    expect(callback).toHaveBeenCalled();
+  });
+
+  it("should complete the request on error", () => {
+    callback.and.callFake(
+      (status, response, headers, statusText, xhrStatus) => {
+        expect(status).toBe(-1);
+        expect(response).toBe(null);
+        expect(headers).toBe(null);
+        expect(statusText).toBe("");
+        expect(xhrStatus).toBe("error");
+      },
+    );
+    http("GET", "/url", null, callback, {});
+
+    expect(callback).not.toHaveBeenCalled();
+    requests[0].error();
+    expect(callback).toHaveBeenCalled();
+  });
+
+  it("should complete the request on success", () => {
+    callback.and.callFake(
+      (status, response, headers, statusText, xhrStatus) => {
+        expect(status).toBe(200);
+        expect(response).toBe("response");
+        expect(headers).toBe("");
+        expect(statusText).toBe("OK");
+        expect(xhrStatus).toBe("complete");
+      },
+    );
+    http("GET", "/url", null, callback, {});
+
+    expect(callback).not.toHaveBeenCalled();
+    requests[0].respond(200, "", "response");
+    expect(callback).toHaveBeenCalled();
+  });
+
+  // it("should set withCredentials", () => {
+  //   $backend("GET", "/some.url", null, callback, {}, null, true);
+  //   expect(requests[0].withCredentials).toBeTrue();
+  // });
+
+  // it("should abort request on $timeout promise resolution", () => {
+  //   callback.and.callFake(
+  //     (status, response, headers, statusText, xhrStatus) => {
+  //       expect(status).toBe(-1);
+  //       expect(xhrStatus).toBe("timeout");
+  //     },
+  //   );
+
+  //   $backend(
+  //     "GET",
+  //     "/url",
+  //     null,
+  //     callback,
+  //     {},
+  //     setTimeout(() => {}, 2000),
+  //   );
+  //   spyOn(xhr, "abort");
+  //   expect(xhr.abort).toHaveBeenCalled();
+
+  //   requests[0].abort();
+  //   expect(callback).toHaveBeenCalled();
+  // });
+
+  // it("should not abort resolved request on timeout promise resolution", () => {
+  //   callback.and.callFake((status, response) => {
+  //     expect(status).toBe(200);
+  //   });
+
+  //   $backend(
+  //     "GET",
+  //     "/url",
+  //     null,
+  //     callback,
+  //     {},
+  //     setTimeout(() => {}, 2000),
+  //   );
+  //   xhr = MockXhr.$$lastInstance;
+  //   spyOn(xhr, "abort");
+
+  //   xhr.status = 200;
+  //   xhr.onload();
+  //   expect(callback).toHaveBeenCalled();
+
+  //   $timeout.flush();
+  //   expect(xhr.abort).not.toHaveBeenCalled();
+  // });
+
+  // it("should abort request on canceler promise resolution", () => {
+  //   const canceler = Promise.withResolvers();
+
+  //   callback.and.callFake(
+  //     (status, response, headers, statusText, xhrStatus) => {
+  //       expect(status).toBe(-1);
+  //       expect(xhrStatus).toBe("abort");
+  //     },
+  //   );
+
+  //   $backend("GET", "/url", null, callback, {}, canceler.promise);
+  //   xhr = MockXhr.$$lastInstance;
+
+  //   canceler.resolve();
+  //   $browser.defer.flush();
+
+  //   expect(callback).toHaveBeenCalled();
+  // });
+
+  // it("should cancel timeout on completion", () => {
+  //   callback.and.callFake((status, response) => {
+  //     expect(status).toBe(200);
+  //   });
+
+  //   $backend("GET", "/url", null, callback, {}, 2000);
+  //   xhr = MockXhr.$$lastInstance;
+  //   spyOn(xhr, "abort");
+
+  //   expect($browser.deferredFns[0].time).toBe(2000);
+
+  //   xhr.status = 200;
+  //   xhr.onload();
+  //   expect(callback).toHaveBeenCalled();
+
+  //   expect($browser.deferredFns.length).toBe(0);
+  //   expect(xhr.abort).not.toHaveBeenCalled();
+  // });
+
+  // it('should call callback with xhrStatus "abort" on explicit xhr.abort() when $timeout is set', () => {
+  //   callback.and.callFake(
+  //     (status, response, headers, statusText, xhrStatus) => {
+  //       expect(status).toBe(-1);
+  //       expect(xhrStatus).toBe("abort");
+  //     },
+  //   );
+
+  //   $backend(
+  //     "GET",
+  //     "/url",
+  //     null,
+  //     callback,
+  //     {},
+  //     setTimeout(() => {}, 2000),
+  //   );
+  //   spyOn(xhr, "abort").and.callThrough();
+
+  //   xhr.abort();
+
+  //   expect(callback).toHaveBeenCalled();
+  // });
+
+  it("should set up event listeners", () => {
+    const progressFn = function () {
+      "progressFn";
+    };
+    http("GET", "/url", null, callback, {}, null, null, null, {
+      progress: progressFn,
+    });
+    expect(requests[0].eventListeners.progress[1].listener).toBe(progressFn);
+    //expect(requests[0].eventListeners.progress[1].listener).toBe(uploadProgressFn);
+  });
+
+  // describe("responseType", () => {
+  //   it("should set responseType and return xhr.response", () => {
+  //     $backend("GET", "/whatever", null, callback, {}, null, null, "blob");
+
+  //     const xhrInstance = MockXhr.$$lastInstance;
+  //     expect(xhrInstance.responseType).toBe("blob");
+
+  //     callback.and.callFake((status, response) => {
+  //       expect(response).toBe(xhrInstance.response);
+  //     });
+
+  //     xhrInstance.response = { some: "object" };
+  //     xhrInstance.onload();
+
+  //     expect(callback).toHaveBeenCalled();
+  //   });
+
+  //   it("should read responseText if response was not defined", () => {
+  //     //  old browsers like IE9, don't support responseType, so they always respond with responseText
+
+  //     $backend("GET", "/whatever", null, callback, {}, null, null, "blob");
+
+  //     const xhrInstance = MockXhr.$$lastInstance;
+  //     const responseText = '{"some": "object"}';
+  //     expect(xhrInstance.responseType).toBe("blob");
+
+  //     callback.and.callFake((status, response) => {
+  //       expect(response).toBe(responseText);
+  //     });
+
+  //     xhrInstance.responseText = responseText;
+  //     xhrInstance.onload();
+
+  //     expect(callback).toHaveBeenCalled();
+  //   });
+  // });
+
+  // describe("protocols that return 0 status code", () => {
+  //   function respond(status, content) {
+  //     xhr = MockXhr.$$lastInstance;
+  //     xhr.status = status;
+  //     xhr.responseText = content;
+  //     xhr.onload();
+  //   }
+
+  //   beforeEach(() => {
+  //     $backend = createHttpBackend($browser, createMockXhr);
+  //   });
+
+  //   it("should convert 0 to 200 if content and file protocol", () => {
+  //     $backend("GET", "file:///whatever/index.html", null, callback);
+  //     respond(0, "SOME CONTENT");
+
+  //     expect(callback).toHaveBeenCalled();
+  //     expect(callback.calls.mostRecent().args[0]).toBe(200);
+  //   });
+
+  //   it("should convert 0 to 200 if content for protocols other than file", () => {
+  //     $backend("GET", "someProtocol:///whatever/index.html", null, callback);
+  //     respond(0, "SOME CONTENT");
+
+  //     expect(callback).toHaveBeenCalled();
+  //     expect(callback.calls.mostRecent().args[0]).toBe(200);
+  //   });
+
+  //   it("should convert 0 to 404 if no content and file protocol", () => {
+  //     $backend("GET", "file:///whatever/index.html", null, callback);
+  //     respond(0, "");
+
+  //     expect(callback).toHaveBeenCalled();
+  //     expect(callback.calls.mostRecent().args[0]).toBe(404);
+  //   });
+
+  //   it("should not convert 0 to 404 if no content for protocols other than file", () => {
+  //     $backend("GET", "someProtocol:///whatever/index.html", null, callback);
+  //     respond(0, "");
+
+  //     expect(callback).toHaveBeenCalled();
+  //     expect(callback.calls.mostRecent().args[0]).toBe(0);
+  //   });
+
+  // it("should convert 0 to 404 if no content - relative url", () => {
+  //   const originalUrlParsingNode = urlParsingNode;
+
+  //   // temporarily overriding the DOM element to pretend that the test runs origin with file:// protocol
+  //   urlParsingNode = {
+  //     hash: "#/C:/",
+  //     host: "",
+  //     hostname: "",
+  //     href: "file:///C:/base#!/C:/foo",
+  //     pathname: "/C:/foo",
+  //     port: "",
+  //     protocol: "file:",
+  //     search: "",
+  //     setAttribute: () => {},
+  //   };
+
+  //   try {
+  //     $backend("GET", "/whatever/index.html", null, callback);
+  //     respond(0, "");
+
+  //     expect(callback).toHaveBeenCalled();
+  //     expect(callback.calls.mostRecent().args[0]).toBe(404);
+  //   } finally {
+  //     urlParsingNode = originalUrlParsingNode;
+  //   }
+  // });
+
+  // it("should return original backend status code if different from 0", () => {
+  //   // request to http://
+  //   $backend("POST", "http://rest_api/create_whatever", null, callback);
+  //   respond(201, "");
+
+  //   expect(callback).toHaveBeenCalled();
+  //   expect(callback.calls.mostRecent().args[0]).toBe(201);
+
+  //   // request to file://
+  //   $backend("POST", "file://rest_api/create_whatever", null, callback);
+  //   respond(201, "");
+
+  //   expect(callback).toHaveBeenCalled();
+  //   expect(callback.calls.mostRecent().args[0]).toBe(201);
+
+  //   // request to file:// with HTTP status >= 300
+  //   $backend("POST", "file://rest_api/create_whatever", null, callback);
+  //   respond(503, "");
+
+  //   expect(callback).toHaveBeenCalled();
+  //   expect(callback.calls.mostRecent().args[0]).toBe(503);
+  // });
+  // });
+});
+
 // describe("$http", () => {
 //   let callback;
 //   let mockedCookies;