refactor: drop the dummy method in BarGraphFormatter

mgechev · AleksanderBodurri · commit fa5e17b25105 · 2020-03-31T18:31:27.000-04:00
diff --git a/projects/ng-devtools/src/lib/devtools-tabs/profiler/recording/timeline/record-formatter/bargraph-formatter/bargraph-formatter.ts b/projects/ng-devtools/src/lib/devtools-tabs/profiler/recording/timeline/record-formatter/bargraph-formatter/bargraph-formatter.ts
@@ -16,11 +16,7 @@ export class BarGraphFormatter extends RecordFormatter<BargraphNode[]> {
     return result.filter((element) => element.value > 0).sort((a, b) => b.value - a.value);
   }
 
-  addFrame(nodes: BargraphNode[], elements: ElementProfile[]): number {
-    return -1;
-  }
-
-  addFrames(nodes: BargraphNode[], elements: ElementProfile[], parents: ElementProfile[]): number {
+  addFrame(nodes: BargraphNode[], elements: ElementProfile[], parents: ElementProfile[] = []): number {
     let timeSpent = 0;
     const suffix = addSpaces(nodes.length);
     elements.forEach((element) => {
@@ -31,7 +27,7 @@ export class BarGraphFormatter extends RecordFormatter<BargraphNode[]> {
         return;
       }
 
-      timeSpent += this.addFrames(nodes, element.children, parents.concat(element));
+      timeSpent += this.addFrame(nodes, element.children, parents.concat(element));
       timeSpent += super.getValue(element);
 
       element.directives.forEach((dir) => {
diff --git a/projects/ng-devtools/src/lib/devtools-tabs/profiler/recording/timeline/record-formatter/flamegraph-formatter/flamegraph-formatter.ts b/projects/ng-devtools/src/lib/devtools-tabs/profiler/recording/timeline/record-formatter/flamegraph-formatter/flamegraph-formatter.ts
@@ -50,8 +50,10 @@ export class FlamegraphFormatter extends RecordFormatter<FlamegraphNode> {
         instances: 1,
         original: element,
         changeDetected,
-        color: showChangeDetection ? (changeDetected ? CHANGE_DETECTION_COLOR : NO_CHANGE_DETECTION_COLOR) : undefined,
       };
+      if (showChangeDetection) {
+        node.color = changeDetected ? CHANGE_DETECTION_COLOR : NO_CHANGE_DETECTION_COLOR;
+      }
       timeSpent += this.addFrame(node.children, element.children, showChangeDetection);
       timeSpent += node.value;
       nodes.push(node);
diff --git a/projects/ng-devtools/src/lib/devtools-tabs/profiler/recording/timeline/record-formatter/record-formatter-spec-constants.ts b/projects/ng-devtools/src/lib/devtools-tabs/profiler/recording/timeline/record-formatter/record-formatter-spec-constants.ts
@@ -1,3 +1,5 @@
+import { FlamegraphNode } from './flamegraph-formatter';
+
 export const SIMPLE_RECORD = [
   {
     children: [
@@ -244,7 +246,7 @@ export const NESTED_RECORD = [
     ],
   },
 ];
-export const NESTED_FORMATTED_FLAMEGRAPH_RECORD = [
+export const NESTED_FORMATTED_FLAMEGRAPH_RECORD: FlamegraphNode[] = [
   {
     value: 1,
     label: 'AppComponent',
@@ -369,7 +371,6 @@ export const NESTED_FORMATTED_FLAMEGRAPH_RECORD = [
       directives: [
         {
           changeDetection: 1,
-          changeDetected: true,
           isElement: true,
           isComponent: true,
           lifecycle: {},
