Merge pull request rangle#828 from stevenkampen/fix-dependency-tree-s…

…upport-skipself

Fix dependency tree support skipself

src/backend/utils/description.ts

@@ -1,5 +1,10 @@
 import {DebugElement} from '@angular/core';
 
+export interface Dependency {
+  type: string;
+  decorators: Array<string>;
+}
+
 export interface Property {
   key: string;
   value;

src/frontend/components/dependency/dependency.html

@@ -5,8 +5,8 @@
       *ngFor="let dep of dependencies">
       <a href="#"
         class="node-item-property"
-        (click)="onDependencySelected(dep)">
-        {{dep}}
+        (click)="onDependencySelected(dep.type)">
+        {{dep.type}}
         </a>
     </li>
   </ul>
@@ -36,8 +36,8 @@
         <li *ngFor="let dep of comp.dependencies">
           <a href="#"
             class="node-item-property"
-            (click)="onDependencySelected(dep)">
-            {{dep}}
+            (click)="onDependencySelected(dep.type)">
+            {{dep.type}}
             </a>
         </li>
       </ul>

src/frontend/components/dependency/dependency.ts

@@ -32,7 +32,7 @@ export class Dependency {
 
   constructor(private userActions: UserActions) {}
 
-  private get dependencies(): Array<string> {
+  private get dependencies(): Array<{[key: string]: any}> {
     if (this.selectedNode == null) {
       return [];
     }
@@ -83,9 +83,11 @@ export class Dependency {
     const dependents = new Array<Node>();
 
     this.tree.recurseAll(node => {
-      if (node.dependencies.indexOf(dependency) >= 0) {
-        dependents.push(node);
-      }
+      this.dependencies.map((dep: any) => {
+        if (dep.type === dependency) {
+          dependents.push(node);
+        }
+      });
     });
 
     return dependents;

src/frontend/components/injector-tree/injector-tree.ts

@@ -65,12 +65,12 @@ export class InjectorTree implements OnChanges {
     }
 
     this.selectedNode.dependencies.forEach(
-      dependency => {
-        if (this.selectedNode.injectors.indexOf(dependency) < 0) {
+      (dependency: any) => {
+        if (this.selectedNode.injectors.indexOf(dependency.type) < 0) {
           const parent = this.parseUtils.getDependencyLink
-            (this.tree, this.selectedNode.id, dependency);
+            (this.tree, this.selectedNode.id, dependency.type);
           if (!parent) {
-            rootElement.injectors.push(dependency);
+            rootElement.injectors.push(dependency.type);
           }
         }
       });
@@ -198,11 +198,17 @@ export class InjectorTree implements OnChanges {
       this.graphUtils.addLine(this.svg, x1, y1, x2, y2, 'arrow stroke-component');
     }
 
-    this.selectedNode.dependencies.forEach((dependency) => {
+    this.selectedNode.dependencies.forEach((dependency: any) => {
+      const providedForSelf = this.selectedNode.providers.reduce((prev, curr, idx, p) =>
+        prev ? prev : p[idx].key === dependency.type && dependency.decorators.indexOf('@SkipSelf') < 0, false);
+      if (providedForSelf) {
+        return;
+      }
+
       const parent = this.parseUtils.getDependencyLink
-        (this.tree, this.selectedNode.id, dependency);
+        (this.tree, this.selectedNode.id, dependency.type);
       if (parent) {
-        const service = positions[parent.id].injectors[dependency];
+        const service = positions[parent.id].injectors[dependency.type];
         if (service) {
           x1 = positions[this.selectedNode.id].x + 5;
           y1 = positions[this.selectedNode.id].y - 10;

src/tree/decorators.ts

@@ -14,6 +14,9 @@ export const propertyDecorators = (instance): Array<any> =>
 export const parameterTypes = (instance): Array<any> =>
   Reflect.getOwnMetadata('design:paramtypes', instance.constructor) || [];
 
+export const injectedParameterDecorators = (instance): Array<any> =>
+  Reflect.getOwnMetadata('parameters', instance.constructor) || [];
+
 export const iteratePropertyDecorators = (instance, fn: (key: string, decorator) => void) => {
   if (instance == null) {
     return;

src/tree/node.ts

@@ -1,4 +1,4 @@
-import {Property} from '../backend/utils/description';
+import {Property, Dependency} from '../backend/utils/description';
 
 export interface EventListener {
   name: string;
@@ -20,7 +20,7 @@ export interface Node {
   description: Array<Property>;
   nativeElement: () => HTMLElement; // null on frontend
   listeners: Array<EventListener>;
-  dependencies: Array<string>;
+  dependencies: Array<Dependency>;
   directives: Array<string>;
   injectors: Array<string>;
   providers: Array<Property>;

src/tree/transformer.ts

@@ -3,6 +3,7 @@ import * as clone from 'clone';
 import {
   Description,
   Property,
+  Dependency,
 } from '../backend/utils/description';
 
 import {
@@ -21,6 +22,7 @@ import {
   componentOutputs,
   parameterTypes,
   propertyDecorators,
+  injectedParameterDecorators,
 } from './decorators';
 
 /// Transform a {@link DebugElement} or {@link DebugNode} element into a Node
@@ -192,9 +194,14 @@ const getChangeDetection = (metadata): number => {
   }
 };
 
-const getDependencies = (instance): Array<string> => {
+const getDependencies = (instance): Array<Dependency> => {
   if (instance == null) {
     return [];
   }
-  return parameterTypes(instance).map(param => functionName(param));
+  const paramTypes = parameterTypes(instance);
+  const parameterDecorators = injectedParameterDecorators(instance);
+  return paramTypes.map((param, i) => ({
+    type: functionName(param),
+    decorators: parameterDecorators[i] ? parameterDecorators[i].map(d => d.toString()) : [],
+  }));
 };