@angular-wave/angular.ts 0.7.5 → 0.7.8

package/src/services/anchor-scroll.js

@@ -29,7 +29,7 @@ export class AnchorScrollProvider {
     "$rootScope",
     /**
      *
-     * @param {import('../core/location/location.js').Location} $location
+     * @param {import('../services/location/location.js').Location} $location
      * @param {import('../core/scope/scope.js').Scope} $rootScope
      * @returns
      */
@@ -128,7 +128,7 @@ export class AnchorScrollProvider {
           // skip the initial scroll if $location.hash is empty
           if (newVal === oldVal && newVal === "") return;
 
-          const action = () => $rootScope.$evalAsync(scroll);
+          const action = () => Promise.resolve().then(scroll);
           if (document.readyState === "complete") {
             // Force the action to be run async for consistent behavior
             // from the action's point of view

package/src/{core → services/exception}/exception-handler.js

@@ -42,9 +42,9 @@
  * @see {@link angular.ErrorHandler AngularTS ErrorHandler}
  */
 
-/** @typedef {import('../services/log/interface.ts').LogService} LogService */
+/** @typedef {import('../log/interface.ts').LogService} LogService */
 
-/** @typedef {import("./error-handler.ts").ErrorHandler}  ErrorHandler */
+/** @typedef {import("./interface.ts").Interface}  ErrorHandler */
 
 /**
  * Provider for `$exceptionHandler` service. Delegates uncaught exceptions to `$log.error()` by default.

package/src/{core/error-handler.ts → services/exception/interface.ts}

@@ -4,4 +4,4 @@
  * @param exception - The exception associated with the error.
  * @param [cause] - Optional information about the context in which the error was thrown.
  */
-export type ErrorHandler = (exception: Error, cause?: string) => void;
+export type Interface = (exception: Error, cause?: string) => void;

package/src/services/http/http.js

@@ -1,4 +1,4 @@
-import { urlIsAllowedOriginFactory } from "../../core/url-utils/url-utils.js";
+import { urlIsAllowedOriginFactory } from "../../shared/url-utils/url-utils.js";
 import {
   minErr,
   isObject,
@@ -377,21 +377,17 @@ export function HttpProvider() {
   });
 
   this.$get = [
-    "$browser",
     "$httpBackend",
-    "$rootScope",
     "$injector",
     "$sce",
     /**
      *
-     * @param {*} $browser
      * @param {*} $httpBackend
-     * @param {import("../../core/scope/scope.js").Scope} $rootScope
      * @param {import("../../core/di/internal-injector.js").InjectorService} $injector
      * @param {*} $sce
      * @returns
      */
-    function ($browser, $httpBackend, $rootScope, $injector, $sce) {
+    function ($httpBackend, $injector, $sce) {
       /**
        * @type {Map<string, string>}
        */
@@ -461,8 +457,6 @@ export function HttpProvider() {
           ? $injector.get(config.paramSerializer)
           : config.paramSerializer;
 
-        $browser.$$incOutstandingRequestCount("$http");
-
         const requestInterceptors = [];
         const responseInterceptors = [];
         let promise = Promise.resolve(config);
@@ -486,7 +480,6 @@ export function HttpProvider() {
         promise = chainInterceptors(promise, requestInterceptors);
         promise = promise.then(serverRequest);
         promise = chainInterceptors(promise, responseInterceptors);
-        promise = promise.finally(completeOutstandingRequest);
 
         return promise;
 
@@ -503,10 +496,6 @@ export function HttpProvider() {
           return promise;
         }
 
-        function completeOutstandingRequest() {
-          $browser.$$completeOutstandingRequest(() => {}, "$http");
-        }
-
         function executeHeaderFns(headers, config) {
           let headerContent;
           const processedHeaders = {};

package/src/services/http/interface.ts

@@ -139,14 +139,14 @@ export interface RequestConfig extends RequestShortcutConfig {
     | undefined;
 }
 
+export type HttpResponseStatus = "complete" | "error" | "timeout" | "abort";
 export interface HttpResponse<T> {
   data: T;
   status: number;
   headers: HttpHeadersGetter;
   config: RequestConfig;
   statusText: string;
-  /** Added in AngularJS 1.6.6 */
-  xhrStatus: "complete" | "error" | "timeout" | "abort";
+  xhrStatus: HttpResponseStatus;
 }
 
 export type HttpPromise<T> = Promise<HttpResponse<T>>;

package/src/services/http-backend/http-backend.js

@@ -1,4 +1,4 @@
-import { urlResolve } from "../../core/url-utils/url-utils.js";
+import { trimEmptyHash, urlResolve } from "../../shared/url-utils/url-utils.js";
 import { isDefined, isPromiseLike, isUndefined } from "../../shared/utils.js";
 
 /**
@@ -19,24 +19,14 @@ import { isDefined, isPromiseLike, isUndefined } from "../../shared/utils.js";
  */
 export class HttpBackendProvider {
   constructor() {
-    this.$get = [
-      "$browser",
-      /**
-       * @param {import('../browser.js').Browser} $browser
-       * @returns
-       */
-      function ($browser) {
-        return createHttpBackend($browser);
-      },
-    ];
+    this.$get = [() => createHttpBackend()];
   }
 }
 
 /**
- * @param {import('../browser.js').Browser} $browser
  * @returns
  */
-export function createHttpBackend($browser) {
+export function createHttpBackend() {
   // TODO(vojta): fix the signature
   return function (
     method,
@@ -50,7 +40,7 @@ export function createHttpBackend($browser) {
     eventHandlers,
     uploadEventHandlers,
   ) {
-    url = url || $browser.url();
+    url = url || trimEmptyHash(window.location.href);
 
     const xhr = new XMLHttpRequest();
     let abortedByTimeout = false;

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

@@ -5,7 +5,6 @@ import sinon from "sinon";
 
 describe("$httpBackend", () => {
   let $backend;
-  let $browser;
   let xhr;
   let callback;
   let requests;
@@ -18,9 +17,7 @@ describe("$httpBackend", () => {
       requests.push(req);
     };
     angular = window.angular = new Angular();
-    let $injector = createInjector(["ng"]);
-    $browser = $injector.get("$browser");
-    $backend = createHttpBackend($browser);
+    $backend = createHttpBackend();
     callback = jasmine.createSpy("done");
   });
 

package/src/services/location/interface.ts

@@ -0,0 +1,8 @@
+/**
+ * A callback function that gets called when the browser URL or state changes.
+ *
+ * @param url - The new URL after the change (with trailing `#` removed).
+ * @param state - The new history state associated with the URL (`history.state`).
+ * @returns void
+ */
+export type UrlChangeListener = (url: string, state: History["state"]) => void;

package/src/{core → services}/location/location.html

@@ -11,7 +11,10 @@
     <script src="/jasmine/jasmine-html.js"></script>
     <script src="/jasmine/boot0.js"></script>
     <script src="/jasmine/boot1.js"></script>
-    <script type="module" src="/src/core/location/location.spec.js"></script>
+    <script
+      type="module"
+      src="/src/services/location/location.spec.js"
+    ></script>
   </head>
   <body>
     <div id="app"></div>

package/src/{core → services}/location/location.js

@@ -1,4 +1,4 @@
-import { urlResolve } from "../url-utils/url-utils.js";
+import { trimEmptyHash, urlResolve } from "../../shared/url-utils/url-utils.js";
 import {
   encodeUriSegment,
   isBoolean,
@@ -11,7 +11,9 @@ import {
   parseKeyValue,
   toInt,
   toKeyValue,
+  equals,
 } from "../../shared/utils.js";
+import { getBaseHref } from "../../shared/dom.js";
 
 /**
  * @typedef {Object} DefaultPorts
@@ -78,7 +80,7 @@ export class Location {
      */
     this.$$replace = false;
 
-    /** @type {import('../url-utils/url-utils').HttpProtocol} */
+    /** @type {string} */
     this.$$protocol = parsedUrl.protocol;
 
     /** @type {string} */
@@ -145,7 +147,7 @@ export class Location {
   /**
    *
    * Return protocol of current URL.
-   * @return {import("../url-utils/url-utils").HttpProtocol} protocol of current URL
+   * @return {string} protocol of current URL
    */
   protocol() {
     return this.$$protocol;
@@ -446,12 +448,13 @@ export class LocationHtml5Url extends Location {
  * This object is exposed as $location service when developer doesn't opt into html5 mode.
  * It also serves as the base class for html5 mode fallback on legacy browsers.
  *
- * @constructor
- * @param {string} appBase application base URL
- * @param {string} appBaseNoFile application base URL stripped of any filename
- * @param {string} hashPrefix hashbang prefix
  */
 export class LocationHashbangUrl extends Location {
+  /**
+   * @param {string} appBase application base URL
+   * @param {string} appBaseNoFile application base URL stripped of any filename
+   * @param {string} hashPrefix hashbang prefix
+   */
   constructor(appBase, appBaseNoFile, hashPrefix) {
     super(appBase, appBaseNoFile);
     this.hashPrefix = hashPrefix;
@@ -562,6 +565,111 @@ export class LocationProvider {
       requireBase: true,
       rewriteLinks: true,
     };
+
+    /** @type {Array<import("./interface.js").UrlChangeListener>} */
+    this.urlChangeListeners = [];
+    this.urlChangeInit = false;
+
+    /** @type {History['state']} */
+    this.cachedState = null;
+    /** @typeof {History.state} */
+    this.lastHistoryState = null;
+    /** @type {string} */
+    this.lastBrowserUrl = window.location.href;
+    this.cacheState();
+  }
+
+  /// ///////////////////////////////////////////////////////////
+  // URL API
+  /// ///////////////////////////////////////////////////////////
+
+  setUrl(url, state) {
+    if (state === undefined) {
+      state = null;
+    }
+
+    // setter
+    if (url) {
+      url = urlResolve(url).href;
+
+      if (this.lastBrowserUrl === url && this.lastHistoryState === state) {
+        return this;
+      }
+
+      this.lastBrowserUrl = url;
+      this.lastHistoryState = state;
+      history.pushState(state, "", url);
+      this.cacheState();
+    }
+  }
+
+  /**
+   * Returns the current URL with any empty hash (`#`) removed.
+   * @return {string}
+   */
+  getUrl() {
+    return trimEmptyHash(window.location.href);
+  }
+
+  /**
+   * Returns the cached state.
+   * @returns {History['state']} The cached state.
+   */
+  state() {
+    return this.cachedState;
+  }
+
+  /**
+   * Caches the current state.
+   *
+   * @private
+   */
+  cacheState() {
+    const currentState = history.state ?? null;
+    if (!equals(currentState, this.lastCachedState)) {
+      this.cachedState = currentState;
+      this.lastCachedState = currentState;
+      this.lastHistoryState = currentState;
+    }
+  }
+
+  /**
+   * Fires the state or URL change event.
+   *
+   * @private
+   */
+  fireStateOrUrlChange() {
+    const prevLastHistoryState = this.lastHistoryState;
+    this.cacheState();
+    if (
+      this.lastBrowserUrl === this.getUrl() &&
+      prevLastHistoryState === this.cachedState
+    ) {
+      return;
+    }
+    this.lastBrowserUrl = this.getUrl();
+    this.lastHistoryState = this.cachedState;
+    this.urlChangeListeners.forEach((listener) => {
+      listener(trimEmptyHash(window.location.href), this.cachedState);
+    });
+  }
+
+  /**
+   * Registers a callback to be called when the URL changes.
+   *
+   * @param {import("./interface.js").UrlChangeListener} callback - The callback function to register.
+   * @returns void
+   */
+  onUrlChange(callback) {
+    if (!this.urlChangeInit) {
+      window.addEventListener("popstate", this.fireStateOrUrlChange.bind(this));
+      window.addEventListener(
+        "hashchange",
+        this.fireStateOrUrlChange.bind(this),
+      );
+      this.urlChangeInit = true;
+    }
+    this.urlChangeListeners.push(callback);
   }
 
   /**
@@ -623,21 +731,19 @@ export class LocationProvider {
 
   $get = [
     "$rootScope",
-    "$browser",
     "$rootElement",
     /**
      *
-     * @param {import('../scope/scope.js').Scope} $rootScope
-     * @param {import('../../services/browser').Browser} $browser
+     * @param {import('../../core/scope/scope.js').Scope} $rootScope
      * @param {Element} $rootElement
      * @returns
      */
-    ($rootScope, $browser, $rootElement) => {
+    ($rootScope, $rootElement) => {
       /** @type {Location} */
       let $location;
       let LocationMode;
-      const baseHref = $browser.baseHref(); // if base[href] is undefined, it defaults to ''
-      const initialUrl = /** @type {string} */ ($browser.url());
+      const baseHref = getBaseHref(); // if base[href] is undefined, it defaults to ''
+      const initialUrl = trimEmptyHash(window.location.href);
       let appBase;
 
       if (this.getHtml5Mode().enabled) {
@@ -662,20 +768,20 @@ export class LocationProvider {
       );
       $location.$$parseLinkUrl(initialUrl, initialUrl);
 
-      $location.$$state = $browser.state();
+      $location.$$state = this.state();
 
       const IGNORE_URI_REGEXP = /^\s*(javascript|mailto):/i;
 
-      function setBrowserUrlWithFallback(url, state) {
+      const setBrowserUrlWithFallback = (url, state) => {
         const oldUrl = $location.url();
         const oldState = $location.$$state;
         try {
-          $browser.url(url, state);
+          this.setUrl(url, state);
 
           // Make sure $location.state() returns referentially identical (not just deeply equal)
           // state object; this makes possible quick checking if the state changed in the digest
           // loop. Checking deep equality would be too expensive.
-          $location.$$state = $browser.state();
+          $location.$$state = this.state();
         } catch (e) {
           // Restore old values if pushState fails
           $location.url(/** @type {string} */ (oldUrl));
@@ -683,7 +789,7 @@ export class LocationProvider {
 
           throw e;
         }
-      }
+      };
 
       $rootElement.addEventListener(
         "click",
@@ -751,10 +857,6 @@ export class LocationProvider {
               // in html5mode and also without, so that we are able to abort navigation without
               // getting double entries in the location history.
               event.preventDefault();
-              // update location manually
-              // if ($location.absUrl() !== $browser.url()) {
-              //   $rootScope.$apply();
-              // }
             }
           }
         },
@@ -762,20 +864,20 @@ export class LocationProvider {
 
       // rewrite hashbang url <> html5 url
       if ($location.absUrl() !== initialUrl) {
-        $browser.url($location.absUrl(), true);
+        this.setUrl($location.absUrl(), true);
       }
 
       let initializing = true;
 
       // update $location when $browser url changes
-      $browser.onUrlChange((newUrl, newState) => {
+      this.onUrlChange((newUrl, newState) => {
         if (!startsWith(newUrl, appBaseNoFile)) {
           // If we are navigating outside of the app then force a reload
           window.location.href = newUrl;
           return;
         }
 
-        $rootScope.$evalAsync(() => {
+        Promise.resolve().then(() => {
           const oldUrl = $location.absUrl();
           const oldState = $location.$$state;
           let defaultPrevented;
@@ -810,9 +912,9 @@ export class LocationProvider {
         if (initializing || $location.$$urlUpdatedByLocation) {
           $location.$$urlUpdatedByLocation = false;
 
-          const oldUrl = /** @type {string} */ ($browser.url());
+          const oldUrl = /** @type {string} */ (this.getUrl());
           const newUrl = $location.absUrl();
-          const oldState = $browser.state();
+          const oldState = this.state();
           const urlOrStateChanged =
             !urlsEqual(oldUrl, newUrl) ||
             ($location.$$html5 && oldState !== $location.$$state);

package/src/{core → services}/location/location.spec.js

@@ -2,9 +2,9 @@ import {
   LocationHtml5Url,
   LocationHashbangUrl,
   LocationProvider,
-} from "./location";
+} from "./location.js";
 import { Angular } from "../../loader.js";
-import { createInjector } from "../di/injector.js";
+import { createInjector } from "../../core/di/injector.js";
 
 describe("$location", () => {
   let module;

package/src/{core → services}/location/location.test.js

@@ -1,6 +1,6 @@
 import { test, expect } from "@playwright/test";
 
-const TEST_URL = "src/core/location/location.html";
+const TEST_URL = "src/services/location/location.html";
 
 test("unit tests contain no errors", async ({ page }) => {
   await page.goto(TEST_URL);

package/src/{core → services}/sce/sce.html

@@ -11,7 +11,7 @@
     <script src="/jasmine/jasmine-html.js"></script>
     <script src="/jasmine/boot0.js"></script>
     <script src="/jasmine/boot1.js"></script>
-    <script type="module" src="/src/core/sce/sce.spec.js"></script>
+    <script type="module" src="/src/services/sce/sce.spec.js"></script>
   </head>
   <body>
     <div id="app"></div>

package/src/{core → services}/sce/sce.js

@@ -2,7 +2,7 @@ import {
   urlIsSameOrigin,
   urlIsSameOriginAsBaseUrl,
   urlResolve,
-} from "./../url-utils/url-utils.js";
+} from "../../shared/url-utils/url-utils.js";
 import {
   hasOwn,
   isFunction,
@@ -16,7 +16,7 @@ import {
 
 import { snakeToCamel } from "../../shared/dom.js";
 
-/** @typedef {import("../error-handler.ts").ErrorHandler }  ErrorHandler */
+/** @typedef {import("../exception/interface.ts").Interface }  ErrorHandler */
 
 const $sceMinErr = minErr("$sce");
 
@@ -72,6 +72,7 @@ export function adjustMatcher(matcher) {
       .replace(/\\\*/g, "[^:/.?&;]*");
     return new RegExp(`^${matcher}$`);
   }
+
   if (isRegExp(matcher)) {
     // The only other type of matcher allowed is a Regexp.
     // Match entire URL / disallow partial matches.
@@ -333,6 +334,11 @@ export class SceDelegateProvider {
           htmlSanitizer = $injector.get("$sanitize");
         }
 
+        /**
+         * @param {string|RegExp} matcher
+         * @param {import("../../shared/url-utils/interface").ParsedUrl} parsedUrl
+         * @return {boolean}
+         */
         function matchUrl(matcher, parsedUrl) {
           if (matcher === "self") {
             return (
@@ -340,7 +346,7 @@ export class SceDelegateProvider {
             );
           }
           // definitely a regex.  See adjustMatchers()
-          return !!matcher.exec(parsedUrl.href);
+          return !!(/** @type {RegExp} */ (matcher).exec(parsedUrl.href));
         }
 
         function isResourceUrlAllowedByPolicy(url) {

package/src/{core → services}/sce/sce.spec.js

@@ -1,7 +1,6 @@
-import { createInjector } from "../di/injector.js";
-
+import { createInjector } from "../../core/di/injector.js";
 import { Angular } from "../../loader.js";
-import { adjustMatcher } from "./sce";
+import { adjustMatcher } from "./sce.js";
 import { wait } from "../../shared/test-utils.js";
 
 describe("SCE", () => {

package/src/{core → services}/sce/sce.test.js

@@ -1,6 +1,6 @@
 import { test, expect } from "@playwright/test";
 
-const TEST_URL = "src/core/sce/sce.html";
+const TEST_URL = "src/services/sce/sce.html";
 
 test("unit tests contain no errors", async ({ page }) => {
   await page.goto(TEST_URL);

package/src/services/template-cache/interface.ts

@@ -1,4 +1,10 @@
 /**
- * A cache for mapping template names to their respective content.
+ * A cache interface for mapping template urls to their XHR responses.
  */
-export type TemplateCache = Map<string, string>;
+export interface TemplateCache {
+  get(key: string): any | undefined;
+  set(key: string, value: any): this;
+  has(key: string): boolean;
+  delete(key: string): boolean;
+  clear(): void;
+}

package/src/services/template-cache/template-cache.js

@@ -9,5 +9,7 @@ export class TemplateCacheProvider {
   /**
    * @returns {import('./interface.ts').TemplateCache}
    */
-  $get = () => this.cache;
+  $get() {
+    return this.cache;
+  }
 }

package/src/services/template-cache/template-cache.spec.js

@@ -59,4 +59,76 @@ describe("$templateCache", () => {
       "<p>This is the content of the template</p>",
     );
   });
+
+  it("can be swapped for localStorage", async () => {
+    dealoc(el);
+    angular = new Angular();
+    angular.module("customStorage", []).config(($templateCacheProvider) => {
+      templateCacheProvider = $templateCacheProvider;
+      templateCacheProvider.cache = new LocalStorageMap();
+      templateCacheProvider.cache.set("test", "hello");
+    });
+    angular
+      .bootstrap(el, ["customStorage"])
+      .invoke((_$templateCache_, _$compile_, _$rootScope_) => {
+        templateCache = _$templateCache_;
+        $compile = _$compile_;
+        $scope = _$rootScope_;
+      });
+
+    expect(templateCache instanceof LocalStorageMap).toBeTrue();
+    el.innerHTML = `
+        <div ng-include="'test'">test</div>
+      `;
+    expect(el.innerText).toEqual("test");
+    $compile(el)($scope);
+    await wait();
+    expect(el.innerText).toEqual("hello");
+    expect(window.localStorage.getItem("test")).toEqual("hello");
+  });
 });
+
+class LocalStorageMap {
+  constructor(prefix = "") {
+    this.prefix = prefix;
+  }
+
+  _key(key) {
+    return `${this.prefix}${key}`;
+  }
+
+  get(key) {
+    const raw = localStorage.getItem(this._key(key));
+    if (raw === null) return undefined;
+    try {
+      return JSON.parse(raw);
+    } catch {
+      return raw;
+    }
+  }
+
+  set(key, value) {
+    localStorage.setItem(this._key(key), value);
+    return this;
+  }
+
+  has(key) {
+    return localStorage.getItem(this._key(key)) !== null;
+  }
+
+  delete(key) {
+    localStorage.removeItem(this._key(key));
+    return true;
+  }
+
+  clear() {
+    const toRemove = [];
+    for (let i = 0; i < localStorage.length; i++) {
+      const k = localStorage.key(i);
+      if (k && k.startsWith(this.prefix)) {
+        toRemove.push(k);
+      }
+    }
+    toRemove.forEach((k) => localStorage.removeItem(k));
+  }
+}