From a8088ac68fd5a67a4796330828be693bc16223ea Mon Sep 17 00:00:00 2001
From: mgechev <mgechev@gmail.com>
Date: Thu, 20 Feb 2020 12:13:31 -0800
Subject: [PATCH] fix(devtools): proper timing for operations

---
 .../ng-devtools-backend/src/lib/observer/index.ts     | 11 ++++++-----
 .../profiler/recording/timeline/format-records.ts     |  4 ++--
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/projects/ng-devtools-backend/src/lib/observer/index.ts b/projects/ng-devtools-backend/src/lib/observer/index.ts
index d6ff4be179d..50a4a1e89a5 100644
--- a/projects/ng-devtools-backend/src/lib/observer/index.ts
+++ b/projects/ng-devtools-backend/src/lib/observer/index.ts
@@ -29,7 +29,7 @@ export const start = (onFrame: (frame: ProfilerFrame) => void): void => {
         runOutsideAngular(() => {
           setTimeout(() => {
             inChangeDetection = false;
-            onFrame(flushBuffer(observer, eventMap, getChangeDetectionSource()));
+            onFrame(flushBuffer(observer, getChangeDetectionSource()));
           });
         });
       }
@@ -52,7 +52,7 @@ export const start = (onFrame: (frame: ProfilerFrame) => void): void => {
 };
 
 export const stop = (): ProfilerFrame => {
-  const result = flushBuffer(observer, eventMap);
+  const result = flushBuffer(observer);
   // We want to garbage collect the records;
   observer.destroy();
   inProgress = false;
@@ -81,8 +81,8 @@ const insertElementProfile = (frames: ElementProfile[], position: ElementPositio
   lastFrame.directives.push(profile);
 };
 
-const flushBuffer = (obs: ComponentTreeObserver, events: Map<any, DirectiveProfile>, source: string = '') => {
-  const items = Array.from(events.keys());
+const flushBuffer = (obs: ComponentTreeObserver, source: string = '') => {
+  const items = Array.from(eventMap.keys());
   const positions: ElementPosition[] = [];
   const positionDirective = new Map<ElementPosition, any>();
   items.forEach(dir => {
@@ -97,8 +97,9 @@ const flushBuffer = (obs: ComponentTreeObserver, events: Map<any, DirectiveProfi
   };
   positions.forEach(position => {
     const dir = positionDirective.get(position);
-    insertElementProfile(result.directives, position, events.get(dir));
+    insertElementProfile(result.directives, position, eventMap.get(dir));
   });
+  eventMap = new Map<any, DirectiveProfile>();
   return result;
 };
 
diff --git a/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/profiler/recording/timeline/format-records.ts b/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/profiler/recording/timeline/format-records.ts
index c573ae474ae..5b7832e5313 100644
--- a/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/profiler/recording/timeline/format-records.ts
+++ b/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/profiler/recording/timeline/format-records.ts
@@ -29,8 +29,8 @@ const getLabel = (element: ElementProfile) => {
 const addFrame = (nodes: FlamegraphNode[], elements: ElementProfile[]): number => {
   let timeSpent = 0;
   elements.forEach(element => {
-    // Possibly undefined because of the insertion
-    // on the backend.
+    // Possibly undefined because of
+    // the insertion on the backend.
     if (!element) {
       return;
     }