@angular-wave/angular.ts 0.0.69 → 0.0.71

package/src/core/compile/compile.js

@@ -19,13 +19,10 @@ import {
   isString,
   lowercase,
   extend,
-  reverseParams,
-  snakeCase,
   isScope,
   valueFn,
   inherit,
   isUndefined,
-  arrayRemove,
   getNodeName,
   bind,
   trim,
@@ -37,9 +34,10 @@ import {
   directiveNormalize,
 } from "../../shared/utils";
 import { SCE_CONTEXTS } from "../sce/sce";
-import { PREFIX_REGEXP, ALIASED_ATTR } from "../../shared/constants";
+import { PREFIX_REGEXP } from "../../shared/constants";
 import { createEventDirective } from "../../directive/events/events";
 import { CACHE, EXPANDO } from "../cache/cache";
+import { Attributes } from "./attributes";
 
 let ttl = TTL;
 
@@ -50,17 +48,10 @@ let ttl = TTL;
 
 const $compileMinErr = minErr("$compile");
 
-const _UNINITIALIZED_VALUE = new Object();
+const UNINITALIZED_VALIED = new Object();
 const EXCLUDED_DIRECTIVES = ["ngIf", "ngRepeat"];
 
-/**
- * @ngdoc provider
- * @name $compileProvider
- *
- * @description
- */
 $CompileProvider.$inject = ["$provide", "$$sanitizeUriProvider"];
-
 export function $CompileProvider($provide, $$sanitizeUriProvider) {
   const hasDirectives = {};
   const Suffix = "Directive";
@@ -159,24 +150,6 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
     return bindings;
   }
 
-  function assertValidDirectiveName(name) {
-    const letter = name.charAt(0);
-    if (!letter || letter !== lowercase(letter)) {
-      throw $compileMinErr(
-        "baddir",
-        "Directive/Component name '{0}' is invalid. The first character must be a lowercase letter",
-        name,
-      );
-    }
-    if (name !== name.trim()) {
-      throw $compileMinErr(
-        "baddir",
-        "Directive/Component name '{0}' is invalid. The name should not contain leading or trailing whitespaces",
-        name,
-      );
-    }
-  }
-
   function getDirectiveRequire(directive) {
     const require =
       directive.require || (directive.controller && directive.name);
@@ -206,11 +179,6 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
   }
 
   /**
-   * @ngdoc method
-   * @name $compileProvider#directive
-   * @kind function
-   *
-   * @description
    * Register a new directive with the compiler.
    *
    * @param {string|Object} name Name of the directive in camel-case (i.e. `ngBind` which will match
@@ -273,18 +241,14 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
   };
 
   /**
-   * @ngdoc method
-   * @name $compileProvider#component
-   * @module ng
    * @param {string|Object} name Name of the component in camelCase (i.e. `myComp` which will match `<my-comp>`),
    *    or an object map of components where the keys are the names and the values are the component definition objects.
    * @param {Object} options Component definition object (a simplified
-   *    {@link ng.$compile#directive-definition-object directive definition object}),
+   *    {directive definition object}),
    *    with the following properties (all optional):
    *
    *    - `controller` – `{(string|function()=}` – controller constructor function that should be
-   *      associated with newly created scope or the name of a {@link ng.$compile#-controller-
-   *      registered controller} if passed as a string. An empty `noop` function by default.
+   *      associated with newly created scope or the name of a {controller} if passed as a string. An empty `noop` function by default.
    *    - `controllerAs` – `{string=}` – identifier name for to reference the controller in the component's scope.
    *      If present, the controller will be published to scope under the `controllerAs` name.
    *      If not present, this will default to be `$ctrl`.
@@ -292,7 +256,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
    *      returns an html template as a string which should be used as the contents of this component.
    *      Empty string by default.
    *
-   *      If `template` is a function, then it is {@link auto.$injector#invoke injected} with
+   *      If `template` is a function, then it is {injected} with
    *      the following locals:
    *
    *      - `$element` - Current element
@@ -301,7 +265,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
    *    - `templateUrl` – `{string=|function()=}` – path or function that returns a path to an html
    *      template that should be used  as the contents of this component.
    *
-   *      If `templateUrl` is a function, then it is {@link auto.$injector#invoke injected} with
+   *      If `templateUrl` is a function, then it is {injected} with
    *      the following locals:
    *
    *      - `$element` - Current element
@@ -309,59 +273,20 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
    *
    *    - `bindings` – `{object=}` – defines bindings between DOM attributes and component properties.
    *      Component properties are always bound to the component controller and not to the scope.
-   *      See {@link ng.$compile#-bindtocontroller- `bindToController`}.
-   *    - `transclude` – `{boolean=}` – whether {@link $compile#transclusion content transclusion} is enabled.
+   *      See {`bindToController`}.
+   *    - `transclude` – `{boolean=}` – whether {content transclusion} is enabled.
    *      Disabled by default.
    *    - `require` - `{Object<string, string>=}` - requires the controllers of other directives and binds them to
    *      this component's controller. The object keys specify the property names under which the required
-   *      controllers (object values) will be bound. See {@link ng.$compile#-require- `require`}.
+   *      controllers (object values) will be bound. See {`require`}.
    *    - `$...` – additional properties to attach to the directive factory function and the controller
    *      constructor function. (This is used by the component router to annotate)
    *
-   * @returns {ng.$compileProvider} the compile provider itself, for chaining of function calls.
-   * @description
-   * Register a **component definition** with the compiler. This is a shorthand for registering a special
-   * type of directive, which represents a self-contained UI component in your application. Such components
-   * are always isolated (i.e. `scope: {}`) and are always restricted to elements (i.e. `restrict: 'E'`).
-   *
-   * Component definitions are very simple and do not require as much configuration as defining general
-   * directives. Component definitions usually consist only of a template and a controller backing it.
-   *
-   * In order to make the definition easier, components enforce best practices like use of `controllerAs`,
-   * `bindToController`. They always have **isolate scope** and are restricted to elements.
-   *
-   * Here are a few examples of how you would usually define components:
-   *
-   * ```js
-   *   let myMod = angular.module(...);
-   *   myMod.component('myComp', {
-   *     template: '<div>My name is {{$ctrl.name}}</div>',
-   *     controller: function() {
-   *       this.name = 'shahar';
-   *     }
-   *   });
-   *
-   *   myMod.component('myComp', {
-   *     template: '<div>My name is {{$ctrl.name}}</div>',
-   *     bindings: {name: '@'}
-   *   });
-   *
-   *   myMod.component('myComp', {
-   *     templateUrl: 'views/my-comp.html',
-   *     controller: 'MyCtrl',
-   *     controllerAs: 'ctrl',
-   *     bindings: {name: '@'}
-   *   });
-   *
-   * ```
-   * For more examples, and an in-depth guide, see the {@link guide/component component guide}.
-   *
-   * <br />
-   * See also {@link ng.$compileProvider#directive $compileProvider.directive()}.
+   * @returns {$CompileProvider} the compile provider itself, for chaining of function calls.
    */
-  this.component = function registerComponent(name, options) {
+  this.component = function (name, options) {
     if (!isString(name)) {
-      forEach(name, reverseParams(bind(this, registerComponent)));
+      Object.entries(name).forEach(([key, val]) => this.component(key, val));
       return this;
     }
 
@@ -454,11 +379,6 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
   };
 
   /**
-   * @ngdoc method
-   * @name $compileProvider#imgSrcSanitizationTrustedUrlList
-   * @kind function
-   *
-   * @description
    * Retrieves or overrides the default regular expression that is used for determining trusted safe
    * urls during img[src] sanitization.
    *
@@ -482,16 +402,10 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
   };
 
   /**
-   * @ngdoc method
-   * @name  $compileProvider#strictComponentBindingsEnabled
-   *
    * @param {boolean=} enabled update the strictComponentBindingsEnabled state if provided,
    * otherwise return the current strictComponentBindingsEnabled state.
    * @returns {*} current value if used as getter or itself (chaining) if used as setter
    *
-   * @kind function
-   *
-   * @description
    * Call this method to enable / disable the strict component bindings check. If enabled, the
    * compiler will enforce that all scope / controller bindings of a
    * {@link $compileProvider#directive directive} / {@link $compileProvider#component component}
@@ -512,15 +426,10 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
 
   /**
    * The security context of DOM Properties.
-   * @private
    */
   const PROP_CONTEXTS = Object.create(null);
 
   /**
-   * @ngdoc method
-   * @name $compileProvider#addPropertySecurityContext
-   * @description
-   *
    * Defines the security context for DOM properties bound by ng-prop-*.
    *
    * @param {string} elementName The element name or '*' to match any element.
@@ -622,11 +531,11 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
     /**
      * @param {import("../../core/di/internal-injector").InjectorService} $injector
      * @param {*} $interpolate
-     * @param {*} $exceptionHandler
+     * @param {import("../exception-handler").ExceptionHandlerProvider} $exceptionHandler
      * @param {*} $templateRequest
-     * @param {*} $parse
+     * @param {import("../parser/parse").ParseService} $parse
      * @param {*} $controller
-     * @param {*} $rootScope
+     * @param {import('../scope/scope').Scope} $rootScope
      * @param {*} $sce
      * @param {*} $animate
      * @returns
@@ -642,9 +551,6 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
       $sce,
       $animate,
     ) {
-      const SIMPLE_ATTR_NAME = /^\w/;
-      const specialAttrHolder = window.document.createElement("div");
-
       // The onChanges hooks should all be run together in a single digest
       // When changes occur, the call to trigger their hooks will be added to this queue
       let onChangesQueue;
@@ -678,284 +584,6 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
         }
       }
 
-      function sanitizeSrcset(value, invokeType) {
-        if (!value) {
-          return value;
-        }
-        if (!isString(value)) {
-          throw $compileMinErr(
-            "srcset",
-            'Can\'t pass trusted values to `{0}`: "{1}"',
-            invokeType,
-            value.toString(),
-          );
-        }
-
-        // Such values are a bit too complex to handle automatically inside $sce.
-        // Instead, we sanitize each of the URIs individually, which works, even dynamically.
-
-        // It's not possible to work around this using `$sce.trustAsMediaUrl`.
-        // If you want to programmatically set explicitly trusted unsafe URLs, you should use
-        // `$sce.trustAsHtml` on the whole `img` tag and inject it into the DOM using the
-        // `ng-bind-html` directive.
-
-        var result = "";
-
-        // first check if there are spaces because it's not the same pattern
-        var trimmedSrcset = trim(value);
-        //                (   999x   ,|   999w   ,|   ,|,   )
-        var srcPattern = /(\s+\d+x\s*,|\s+\d+w\s*,|\s+,|,\s+)/;
-        var pattern = /\s/.test(trimmedSrcset) ? srcPattern : /(,)/;
-
-        // split srcset into tuple of uri and descriptor except for the last item
-        var rawUris = trimmedSrcset.split(pattern);
-
-        // for each tuples
-        var nbrUrisWith2parts = Math.floor(rawUris.length / 2);
-        for (var i = 0; i < nbrUrisWith2parts; i++) {
-          var innerIdx = i * 2;
-          // sanitize the uri
-          result += $sce.getTrustedMediaUrl(trim(rawUris[innerIdx]));
-          // add the descriptor
-          result += " " + trim(rawUris[innerIdx + 1]);
-        }
-
-        // split the last item into uri and descriptor
-        var lastTuple = trim(rawUris[i * 2]).split(/\s/);
-
-        // sanitize the last uri
-        result += $sce.getTrustedMediaUrl(trim(lastTuple[0]));
-
-        // and add the last descriptor if any
-        if (lastTuple.length === 2) {
-          result += " " + trim(lastTuple[1]);
-        }
-        return result;
-      }
-
-      class Attributes {
-        constructor(element, attributesToCopy) {
-          if (attributesToCopy) {
-            const keys = Object.keys(attributesToCopy);
-            for (let i = 0, l = keys.length; i < l; i++) {
-              const key = keys[i];
-              this[key] = attributesToCopy[key];
-            }
-          } else {
-            this.$attr = {};
-          }
-          this.$$element = element;
-        }
-
-        /**
-         * @ngdoc method
-         * @name $compile.directive.Attributes#$normalize
-         * @kind function
-         *
-         * @description
-         * Converts an attribute name (e.g. dash/colon/underscore-delimited string, optionally prefixed with `x-` or
-         * `data-`) to its normalized, camelCase form.
-         *
-         * Also there is special case for Moz prefix starting with upper case letter.
-         *
-         * For further information check out the guide on {@link guide/directive#matching-directives Matching Directives}
-         *
-         * @param {string} name Name to normalize
-         */
-        $normalize = directiveNormalize;
-
-        /**
-         * @ngdoc method
-         * @name $compile.directive.Attributes#$addClass
-         * @kind function
-         *
-         * @description
-         * Adds the CSS class value specified by the classVal parameter to the element. If animations
-         * are enabled then an animation will be triggered for the class addition.
-         *
-         * @param {string} classVal The className value that will be added to the element
-         */
-        $addClass(classVal) {
-          if (classVal && classVal.length > 0) {
-            $animate.addClass(this.$$element, classVal);
-          }
-        }
-
-        /**
-         * @ngdoc method
-         * @name $compile.directive.Attributes#$removeClass
-         * @kind function
-         *
-         * @description
-         * Removes the CSS class value specified by the classVal parameter from the element. If
-         * animations are enabled then an animation will be triggered for the class removal.
-         *
-         * @param {string} classVal The className value that will be removed from the element
-         */
-        $removeClass(classVal) {
-          if (classVal && classVal.length > 0) {
-            $animate.removeClass(this.$$element, classVal);
-          }
-        }
-
-        /**
-         * @ngdoc method
-         * @name $compile.directive.Attributes#$updateClass
-         * @kind function
-         *
-         * @description
-         * Adds and removes the appropriate CSS class values to the element based on the difference
-         * between the new and old CSS class values (specified as newClasses and oldClasses).
-         *
-         * @param {string} newClasses The current CSS className value
-         * @param {string} oldClasses The former CSS className value
-         */
-        $updateClass(newClasses, oldClasses) {
-          const toAdd = tokenDifference(newClasses, oldClasses);
-          if (toAdd && toAdd.length) {
-            $animate.addClass(this.$$element, toAdd);
-          }
-
-          const toRemove = tokenDifference(oldClasses, newClasses);
-          if (toRemove && toRemove.length) {
-            $animate.removeClass(this.$$element, toRemove);
-          }
-        }
-
-        /**
-         * Set a normalized attribute on the element in a way such that all directives
-         * can share the attribute. This function properly handles boolean attributes.
-         * @param {string} key Normalized key. (ie ngAttribute)
-         * @param {string|boolean} value The value to set. If `null` attribute will be deleted.
-         * @param {boolean=} writeAttr If false, does not write the value to DOM element attribute.
-         *     Defaults to true.
-         * @param {string=} attrName Optional none normalized name. Defaults to key.
-         */
-        $set(key, value, writeAttr, attrName) {
-          // TODO: decide whether or not to throw an error if "class"
-          // is set through this function since it may cause $updateClass to
-          // become unstable.
-
-          const node = this.$$element[0];
-          const booleanKey = getBooleanAttrName(node, key);
-          const aliasedKey = ALIASED_ATTR[key];
-          let observer = key;
-
-          if (booleanKey) {
-            this.$$element[0][key] = value;
-            attrName = booleanKey;
-          } else if (aliasedKey) {
-            this[aliasedKey] = value;
-            observer = aliasedKey;
-          }
-
-          this[key] = value;
-
-          // translate normalized key to actual key
-          if (attrName) {
-            this.$attr[key] = attrName;
-          } else {
-            attrName = this.$attr[key];
-            if (!attrName) {
-              this.$attr[key] = attrName = snakeCase(key, "-");
-            }
-          }
-
-          let nodeName = this.$$element[0].nodeName.toLowerCase();
-
-          // Sanitize img[srcset] values.
-          if (nodeName === "img" && key === "srcset") {
-            this[key] = value = sanitizeSrcset(value, "$set('srcset', value)");
-          }
-
-          if (writeAttr !== false) {
-            if (value === null || isUndefined(value)) {
-              this.$$element[0].removeAttribute(attrName);
-              //
-            } else if (SIMPLE_ATTR_NAME.test(attrName)) {
-              // jQuery skips special boolean attrs treatment in XML nodes for
-              // historical reasons and hence AngularJS cannot freely call
-              // `.attr(attrName, false) with such attributes. To avoid issues
-              // in XHTML, call `removeAttr` in such cases instead.
-              // See https://github.com/jquery/jquery/issues/4249
-              if (booleanKey && value === false) {
-                this.$$element[0].removeAttribute(attrName);
-              } else {
-                this.$$element.attr(attrName, value);
-              }
-            } else {
-              setSpecialAttr(this.$$element[0], attrName, value);
-            }
-          }
-
-          // fire observers
-          const { $$observers } = this;
-          if ($$observers) {
-            forEach($$observers[observer], (fn) => {
-              try {
-                fn(value);
-              } catch (e) {
-                $exceptionHandler(e);
-              }
-            });
-          }
-        }
-
-        /**
-       * @ngdoc method
-       * @name $compile.directive.Attributes#$observe
-       * @kind function
-       *
-       * @description
-       * Observes an interpolated attribute.
-       *
-       * The observer function will be invoked once during the next `$digest` following
-       * compilation. The observer is then invoked whenever the interpolated value
-       * changes.
-       *
-       * @param {string} key Normalized key. (ie ngAttribute) .
-       * @param {function(interpolatedValue)} fn Function that will be called whenever
-                the interpolated value of the attribute changes.
-       *        See the {@link guide/interpolation#how-text-and-attribute-bindings-work Interpolation
-       *        guide} for more info.
-       * @returns {function()} Returns a deregistration function for this observer.
-       */
-        $observe(key, fn) {
-          const $$observers =
-            this.$$observers || (this.$$observers = Object.create(null));
-          const listeners = $$observers[key] || ($$observers[key] = []);
-
-          listeners.push(fn);
-          $rootScope.$evalAsync(() => {
-            if (
-              !listeners.$$inter &&
-              Object.prototype.hasOwnProperty.call(this, key) &&
-              !isUndefined(this[key])
-            ) {
-              // no one registered attribute interpolation function, so lets call it manually
-              fn(this[key]);
-            }
-          });
-
-          return function () {
-            arrayRemove(listeners, fn);
-          };
-        }
-      }
-
-      function setSpecialAttr(element, attrName, value) {
-        // Attributes names that do not start with letters (such as `(click)`) cannot be set using `setAttribute`
-        // so we have to jump through some hoops to get such an attribute
-        // https://github.com/angular/angular.js/pull/13318
-        specialAttrHolder.innerHTML = `<span ${attrName}>`;
-        const { attributes } = specialAttrHolder.firstChild;
-        const attribute = attributes[0];
-        // We have to remove the attribute from its container element before we can add it to the destination element
-        attributes.removeNamedItem(attribute.name);
-        attribute.value = value;
-        element.attributes.setNamedItem(attribute);
-      }
-
       const startSymbol = $interpolate.startSymbol();
       const endSymbol = $interpolate.endSymbol();
       const denormalizeTemplate =
@@ -988,20 +616,15 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
         ignoreDirective,
         previousCompileContext,
       ) {
-        if (!($compileNodes instanceof JQLite)) {
-          // jquery always rewraps, whereas we need to preserve the original selector so that we can
-          // modify it.
-
-          $compileNodes = JQLite($compileNodes);
-        }
+        let jqCompileNodes = JQLite($compileNodes);
 
         /**
          * @type {CompositeLinkFn}
          */
         let compositeLinkFn = compileNodes(
-          $compileNodes,
+          jqCompileNodes,
           transcludeFn,
-          $compileNodes,
+          jqCompileNodes,
           maxPriority,
           ignoreDirective,
           previousCompileContext,
@@ -1009,7 +632,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
 
         let namespace = null;
         return function publicLinkFn(scope, cloneConnectFn, options) {
-          if (!$compileNodes) {
+          if (!jqCompileNodes) {
             throw $compileMinErr(
               "multilink",
               "This element has already been linked.",
@@ -1048,7 +671,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
           }
           let $linkNode;
           if (namespace !== "html") {
-            // When using a directive with replace:true and templateUrl the $compileNodes
+            // When using a directive with replace:true and templateUrl the jqCompileNodes
             // (or a child element inside of them)
             // might change, so we need to recreate the namespace adapted compileNodes
             // for call to the link function.
@@ -1056,17 +679,16 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
             $linkNode = JQLite(
               wrapTemplate(
                 namespace,
-                JQLite("<div></div>").append($compileNodes).html(),
+                JQLite("<div></div>").append(jqCompileNodes).html(),
               ),
             );
           } else if (cloneConnectFn) {
-            $linkNode = JQLite(
-              Array.from($compileNodes).map((element) =>
-                element.cloneNode(true),
-              ),
-            );
+            let elements = jqCompileNodes
+              .elements()
+              .map((element) => element.cloneNode(true));
+            $linkNode = new JQLite(elements);
           } else {
-            $linkNode = $compileNodes;
+            $linkNode = jqCompileNodes;
           }
 
           if (transcludeControllers) {
@@ -1087,7 +709,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
             );
 
           if (!cloneConnectFn) {
-            $compileNodes = compositeLinkFn = null;
+            jqCompileNodes = compositeLinkFn = null;
           }
           return $linkNode;
         };
@@ -1112,12 +734,14 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
        * function, which is the a linking function for the node.
        *
        * @param {NodeList} nodeList an array of nodes or NodeList to compile
-       * @param {function(ng.IScope, cloneAttachFn=)} transcludeFn A linking function, where the
+       * @param {*} transcludeFn A linking function, where the
        *        scope argument is auto-generated to the new child of the transcluded parent scope.
        * @param {Element=} $rootElement If the nodeList is the root of the compilation tree then
        *        the rootElement must be set the JQLite collection of the compile root. This is
        *        needed so that the JQLite collection items can be replaced with widgets.
        * @param {number=} maxPriority Max directive priority.
+       * @param {*} [ignoreDirective]
+       * @param {*} [previousCompileContext]
        * @returns {Function} A composite linking function of all of the matched directives or null.
        */
       function compileNodes(
@@ -1138,12 +762,12 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
         let nodeLinkFnFound;
 
         for (let i = 0; i < nodeList.length; i++) {
-          attrs = new Attributes();
+          attrs = new Attributes($rootScope, $animate, $exceptionHandler, $sce);
 
           // We must always refer to `nodeList[i]` hereafter,
           // since the nodes can be replaced underneath us.
           directives = collectDirectives(
-            nodeList[i],
+            /** @type Element */ (nodeList[i]),
             [],
             attrs,
             i === 0 ? maxPriority : undefined,
@@ -1323,7 +947,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
        * @param {Element} node Node to search.
        * @param directives An array to which the directives are added to. This array is sorted before
        *        the function returns.
-       * @param attrs The shared attrs object which is used to populate the normalized attributes.
+       * @param {Attributes} attrs The shared attrs object which is used to populate the normalized attributes.
        * @param {number=} maxPriority Max directive priority.
        */
       function collectDirectives(
@@ -1578,7 +1202,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
        *        this needs to be pre-sorted by priority order.
        * @param {Node} compileNode The raw DOM node to apply the compile functions to
        * @param {Object} templateAttrs The shared attribute function
-       * @param {function(angular.Scope, cloneAttachFn=)} transcludeFn A linking function, where the
+       * @param {function(import('../../core/scope/scope').Scope, Function=):any} transcludeFn A linking function, where the
        *                                                  scope argument is auto-generated to the new
        *                                                  child of the transcluded parent scope.
        * @param {JQLite} jqCollection If we are working on the root of the compile tree then this
@@ -1586,9 +1210,9 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
        *                              on it.
        * @param {Object=} originalReplaceDirective An optional directive that will be ignored when
        *                                           compiling the transclusion.
-       * @param {Array.<Function>} preLinkFns
-       * @param {Array.<Function>} postLinkFns
-       * @param {Object} previousCompileContext Context used for previous compilation of the current
+       * @param {Array.<Function>} [preLinkFns]
+       * @param {Array.<Function>} [postLinkFns]
+       * @param {Object} [previousCompileContext] Context used for previous compilation of the current
        *                                        node
        * @returns {Function} linkFn
        */
@@ -1633,7 +1257,11 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
 
           // collect multiblock sections
           if (attrStart) {
-            $compileNode = groupScan(compileNode, attrStart, attrEnd);
+            $compileNode = groupScan(
+              /** @type {Element} */ (compileNode),
+              attrStart,
+              attrEnd,
+            );
           }
           $template = undefined;
 
@@ -2065,7 +1693,14 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
             $element = templateAttrs.$$element;
           } else {
             $element = JQLite(linkNode);
-            attrs = new Attributes($element, templateAttrs);
+            attrs = new Attributes(
+              $rootScope,
+              $animate,
+              $exceptionHandler,
+              $sce,
+              $element,
+              templateAttrs,
+            );
           }
 
           controllerScope = scope;
@@ -3195,7 +2830,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
                 destination[scopeName] = lastValue;
               }
               initialChanges[scopeName] = new SimpleChange(
-                _UNINITIALIZED_VALUE,
+                UNINITALIZED_VALIED,
                 destination[scopeName],
               );
               removeWatchCollection.push(removeWatch);
@@ -3272,7 +2907,7 @@ export function $CompileProvider($provide, $$sanitizeUriProvider) {
 
               var initialValue = (destination[scopeName] = parentGet(scope));
               initialChanges[scopeName] = new SimpleChange(
-                _UNINITIALIZED_VALUE,
+                UNINITALIZED_VALIED,
                 destination[scopeName],
               );
 
@@ -3370,25 +3005,10 @@ class SimpleChange {
    * @returns {boolean}
    */
   isFirstChange() {
-    return this.previousValue === _UNINITIALIZED_VALUE;
+    return this.previousValue === UNINITALIZED_VALIED;
   }
 }
 
-function tokenDifference(str1, str2) {
-  let values = "";
-  const tokens1 = str1.split(/\s+/);
-  const tokens2 = str2.split(/\s+/);
-
-  outer: for (let i = 0; i < tokens1.length; i++) {
-    const token = tokens1[i];
-    for (let j = 0; j < tokens2.length; j++) {
-      if (token === tokens2[j]) continue outer;
-    }
-    values += (values.length > 0 ? " " : "") + token;
-  }
-  return values;
-}
-
 function removeComments(jqNodes) {
   jqNodes = JQLite(jqNodes);
   let i = jqNodes.length;
@@ -3408,3 +3028,25 @@ function removeComments(jqNodes) {
   }
   return jqNodes;
 }
+
+/**
+ * @param {String} name
+ * @returns {void}
+ */
+function assertValidDirectiveName(name) {
+  const letter = name.charAt(0);
+  if (!letter || letter !== lowercase(letter)) {
+    throw $compileMinErr(
+      "baddir",
+      "Directive/Component name '{0}' is invalid. The first character must be a lowercase letter",
+      name,
+    );
+  }
+  if (name !== name.trim()) {
+    throw $compileMinErr(
+      "baddir",
+      "Directive/Component name '{0}' is invalid. The name should not contain leading or trailing whitespaces",
+      name,
+    );
+  }
+}