State directives test fixes

Author: Anatoly Ostrovsky

@types/animations/interface.d.ts

@@ -0,0 +1,17 @@
+export type RafScheduler = {
+  /**
+   * Schedules a list of functions to run on the next animation frame(s).
+   * @param tasks - The tasks to be scheduled.
+   */
+  (tasks: Array<() => void>): void;
+  /**
+   * Internal queue of scheduled task arrays.
+   */
+  queue: Array<Array<() => void>>;
+  /**
+   * Waits until the animation frame is quiet before running the provided function.
+   * Cancels any previous animation frame requests.
+   * @param fn - The function to run when the frame is quiet.
+   */
+  waitUntilQuiet(fn: () => void): void;
+};

@types/animations/raf-scheduler.d.ts

@@ -1,24 +1,37 @@
 /**
- * @typedef {Function} RafSchedulerFunction
- * @typedef {Object} RafSchedulerObject
- * @property {Function} waitUntilQuiet - Function to wait until the animation frame is quiet.
- * @typedef {RafSchedulerObject & RafSchedulerFunction} RafScheduler
+ * @typedef {import('./interface.js').RafScheduler} RafScheduler
+ * @typedef {import('../interface.js').ServiceProvider} ServiceProvider
  */
 /**
- * Creates a requestAnimationFrame scheduler.
+ * Service provider that creates a requestAnimationFrame-based scheduler.
+ * @implements {ServiceProvider}
  */
-export function RafSchedulerProvider(): void;
-export class RafSchedulerProvider {
+export class RafSchedulerProvider implements ServiceProvider {
   /**
-   * @returns {RafScheduler} The scheduler object.
+   * Internal task queue, where each item is an array of functions to run.
+   * @type {Array<Array<() => void>>}
    */
-  $get: () => RafScheduler;
-}
-export type RafSchedulerFunction = Function;
-export type RafSchedulerObject = {
+  queue: Array<Array<() => void>>;
+  /**
+   * ID of the currently scheduled animation frame (if any).
+   * Used for cancellation and tracking.
+   * @type {number|null}
+   */
+  cancelFn: number | null;
   /**
-   * - Function to wait until the animation frame is quiet.
+   * Processes the next batch of tasks in the animation frame.
+   * Executes the first group of functions in the queue, then
+   * schedules the next frame if needed.
    */
-  waitUntilQuiet: Function;
-};
-export type RafScheduler = RafSchedulerObject & RafSchedulerFunction;
+  nextTick(): void;
+  /**
+   * Returns the scheduler function.
+   * This function allows tasks to be queued for execution on future animation frames.
+   * It also has helper methods and state attached.
+   *
+   * @returns {RafScheduler} The scheduler function with `queue` and `waitUntilQuiet`.
+   */
+  $get(): RafScheduler;
+}
+export type RafScheduler = import("./interface.js").RafScheduler;
+export type ServiceProvider = import("../interface.js").ServiceProvider;

@types/router/directives/view-directive.d.ts

@@ -18,7 +18,7 @@ export namespace $ViewDirectiveFill {
  * - `name`: (Optional) A view name.
  *   The name should be unique amongst the other views in the same state.
  *   You can have views of the same name that live in different states.
- *   The ng-view can be targeted in a View using the name ([[Ng1StateDeclaration.views]]).
+ *   The ng-view can be targeted in a View using the name ([[StateDeclaration.views]]).
  *
  * - `autoscroll`: an expression. When it evaluates to true, the `ng-view` will be scrolled into view when it is activated.
  *   Uses [[$ngViewScroll]] to do the scrolling.
@@ -49,7 +49,7 @@ export namespace $ViewDirectiveFill {
  * ```
  *
  * The above is a convenient shortcut equivalent to specifying your view explicitly with the
- * [[Ng1StateDeclaration.views]] config property, by name, in this case an empty name:
+ * [[StateDeclaration.views]] config property, by name, in this case an empty name:
  *
  * ```js
  * $stateProvider.state("home", {
@@ -119,7 +119,7 @@ export namespace $ViewDirectiveFill {
  * Resolve data:
  *
  * The resolved data from the state's `resolve` block is placed on the scope as `$resolve` (this
- * can be customized using [[Ng1ViewDeclaration.resolveAs]]).  This can be then accessed from the template.
+ * can be customized using [[ViewDeclaration.resolveAs]]).  This can be then accessed from the template.
  *
  * Note that when `controllerAs` is being used, `$resolve` is set on the controller instance *after* the
  * controller is instantiated.  The `$onInit()` hook can be used to perform initialization code which

@types/router/state/interface.d.ts

@@ -66,7 +66,7 @@ export interface ViewDeclaration {
   /**
    * The name of the component to use for this view.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * The name of an [angular 1.5+ `.component()`](https://docs.angularjs.org/guide/component) (or directive with
    * bindToController and/or scope declaration) which will be used for this view.
@@ -119,7 +119,7 @@ export interface ViewDeclaration {
   /**
    * An object which maps `resolve`s to [[component]] `bindings`.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * When using a [[component]] declaration (`component: 'myComponent'`), each input binding for the component is supplied
    * data from a resolve of the same name, by default.  You may supply data from a different resolve name by mapping it here.
@@ -162,7 +162,7 @@ export interface ViewDeclaration {
   /**
    * Dynamic component provider function.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * This is an injectable provider function which returns the name of the component to use.
    * The provider will invoked during a Transition in which the view's state is entered.
@@ -183,7 +183,7 @@ export interface ViewDeclaration {
   /**
    * The view's controller function or name
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * The controller function, or the name of a registered controller.  The controller function will be used
    * to control the contents of the [[directives.uiView]] directive.
@@ -197,7 +197,7 @@ export interface ViewDeclaration {
   /**
    * A controller alias name.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * If present, the controller will be published to scope under the `controllerAs` name.
    * See: https://docs.angularjs.org/api/ng/directive/ngController
@@ -206,7 +206,7 @@ export interface ViewDeclaration {
   /**
    * Dynamic controller provider function.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * This is an injectable provider function which returns the actual controller function, or the name
    * of a registered controller.  The provider will invoked during a Transition in which the view's state is
@@ -231,7 +231,7 @@ export interface ViewDeclaration {
   /**
    * The scope variable name to use for resolve data.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * When a view is activated, the resolved data for the state which the view belongs to is put on the scope.
    * This property sets the name of the scope variable to use for the resolved data.
@@ -242,7 +242,7 @@ export interface ViewDeclaration {
   /**
    * The HTML template for the view.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * HTML template as a string, or a function which returns an html template as a string.
    * This template will be used to render the corresponding [[directives.uiView]] directive.
@@ -267,7 +267,7 @@ export interface ViewDeclaration {
   /**
    * The URL for the HTML template for the view.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * A path or a function that returns a path to an html template.
    * The template will be fetched and used to render the corresponding [[directives.uiView]] directive.
@@ -290,7 +290,7 @@ export interface ViewDeclaration {
   /**
    * Injected function which returns the HTML template.
    *
-   * A property of [[Ng1StateDeclaration]] or [[Ng1ViewDeclaration]]:
+   * A property of [[StateDeclaration]] or [[ViewDeclaration]]:
    *
    * Injected function which returns the HTML template.
    * The template will be used to render the corresponding [[directives.uiView]] directive.

@types/router/state/state-object.d.ts

@@ -1,3 +1,4 @@
+/** @typedef {import('./interface.js').StateDeclaration} StateDeclaration */
 /**
  * Internal representation of a ng-router state.
  *
@@ -7,9 +8,13 @@
  *
  * This class prototypally inherits from the corresponding [[StateDeclaration]].
  * Each of its own properties (i.e., `hasOwnProperty`) are built using builders from the [[StateBuilder]].
+ * @implements {StateDeclaration}
  */
-export class StateObject {
-  constructor(config: any);
+export class StateObject implements StateDeclaration {
+  /**
+   * @param {import('./interface.js').StateDeclaration} config
+   */
+  constructor(config: import("./interface.js").StateDeclaration);
   name: any;
   navigable: any;
   /** @type {?StateObject} */
@@ -18,7 +23,10 @@ export class StateObject {
   url: any;
   includes: any;
   $$state: () => this;
-  self: any;
+  /**
+   * @type {import('./interface.js').StateDeclaration}
+   */
+  self: import("./interface.js").StateDeclaration;
   __stateObjectCache: {
     nameGlob: Glob;
   };
@@ -71,4 +79,5 @@ export namespace StateObject {
   /** Predicate which returns true if the object is an internal [[StateObject]] object */
   function isState(obj: any): boolean;
 }
+export type StateDeclaration = import("./interface.js").StateDeclaration;
 import { Glob } from "../common/glob.js";

@types/router/state/state-registry.d.ts

@@ -8,10 +8,16 @@
  */
 export class StateRegistryProvider implements ServiceProvider {
   static $inject: string[];
+  /**
+   * @param urlService
+   * @param stateService
+   * @param {import('../globals.js').RouterGlobals} globals
+   * @param viewService
+   */
   constructor(
     urlService: any,
     stateService: any,
-    globals: any,
+    globals: import("../globals.js").RouterGlobals,
     viewService: any,
   );
   states: {};
@@ -26,7 +32,7 @@ export class StateRegistryProvider implements ServiceProvider {
   $get: import("../../interface.ts").AnnotatedFactory;
   /**
    * This is a [[StateBuilder.builder]] function for angular1 `onEnter`, `onExit`,
-   * `onRetain` callback hooks on a [[Ng1StateDeclaration]].
+   * `onRetain` callback hooks on a [[StateDeclaration]].
    *
    * When the [[StateBuilder]] builds a [[StateObject]] object from a raw [[StateDeclaration]], this builder
    * ensures that those hooks are injectable for @uirouter/angularjs (ng1).

@types/router/state/views.d.ts

@@ -1,7 +1,4 @@
-export function getNg1ViewConfigFactory(): (
-  path: any,
-  view: any,
-) => Ng1ViewConfig;
+export function getViewConfigFactory(): (path: any, view: any) => ViewConfig;
 /**
  * This is a [[StateBuilder.builder]] function for angular1 `views`.
  *
@@ -13,7 +10,7 @@ export function getNg1ViewConfigFactory(): (
  *
  */
 export function ng1ViewsBuilder(state: any): {};
-export class Ng1ViewConfig {
+export class ViewConfig {
   /**
    * Normalizes a view's name from a state.views configuration block.
    *

@types/router/transition/transition.d.ts

@@ -18,14 +18,18 @@ export class Transition implements IHookRegistry {
    *        encapsulates the "from state".
    * @param targetState The target state and parameters being transitioned to (also, the transition options)
    * @param {import('../transition/transition-service.js').TransitionProvider} transitionService The [[TransitionService]] instance
+   * @param {import('../globals.js').RouterGlobals} globals
    */
   constructor(
     fromPath: any,
     targetState: any,
     transitionService: import("../transition/transition-service.js").TransitionProvider,
-    globals: any,
+    globals: import("../globals.js").RouterGlobals,
   );
-  globals: any;
+  /**
+   * @type {import('../globals.js').RouterGlobals}
+   */
+  globals: import("../globals.js").RouterGlobals;
   transitionService: import("../transition/transition-service.js").TransitionProvider;
   _deferred: any;
   /**
@@ -67,10 +71,9 @@ export class Transition implements IHookRegistry {
   getHooks(hookName: any): any;
   applyViewConfigs(): void;
   /**
-   * @internal
-   * @returns the internal from [State] object
+   * @returns {import('../state/state-object.js').StateObject} the internal from [State] object
    */
-  $from(): any;
+  $from(): import("../state/state-object.js").StateObject;
   /**
    * @returns {import('../state/state-object.js').StateObject} the internal to [State] object
    */
@@ -82,15 +85,15 @@ export class Transition implements IHookRegistry {
    *
    * @returns The state declaration object for the Transition's ("from state").
    */
-  from(): any;
+  from(): import("../state/interface.ts").StateDeclaration;
   /**
    * Returns the "to state"
    *
    * Returns the state that the transition is going *to*.
    *
    * @returns The state declaration object for the Transition's target state ("to state").
    */
-  to(): any;
+  to(): import("../state/interface.ts").StateDeclaration;
   /**
    * Gets the Target State
    *

@types/router/view/view.d.ts

@@ -38,12 +38,12 @@ export class ViewService {
   /**
    * @param path
    * @param decl
-   * @return {import("../state/views.js").Ng1ViewConfig}
+   * @return {import("../state/views.js").ViewConfig}
    */
   createViewConfig(
     path: any,
     decl: any,
-  ): import("../state/views.js").Ng1ViewConfig;
+  ): import("../state/views.js").ViewConfig;
   /**
    * Deactivates a ViewConfig.
    *

index.html

@@ -14,10 +14,8 @@
           }
         }
         class TodoController {
-          constructor($element) {
+          constructor() {
             this.greeting = "Todos";
-            this.counter = 123;
-            this.name = "dfsf";
             this.model = {
               name: "John",
               lastName: "Doe",
@@ -26,7 +24,6 @@
               new Todo("Learn AngularTS"),
               new Todo("Build an AngularTS app"),
             ];
-            window.test = this;
           }
 
           get() {
@@ -64,13 +61,7 @@
         window.angular
           .module("todo", [])
           .controller("TodoCtrl", TodoController)
-          .controller("DemoCtrl", Demo)
-          .run(($rootScope) => {
-            $rootScope.model = [
-              { name: "a", item: ["a1", "a2"] },
-              { name: "b", item: ["b1", "b2"] },
-            ];
-          });
+          .controller("DemoCtrl", Demo);
       });
     </script>
   </head>