Refactor out record long tasks into a separate function (#17)

Author: draffensperger

packages/opencensus-web-instrumentation-perf/src/index.ts

@@ -13,3 +13,8 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
+export * from './perf-types';
+export {getInitialLoadRootSpan} from './initial-load-root-span';
+export {recordLongTasks} from './long-tasks-recorder';
+export {GroupedPerfEntries, getPerfEntries, clearPerfEntries} from './perf-grouper';

packages/opencensus-web-instrumentation-perf/src/initial-load-root-span.ts

@@ -15,7 +15,7 @@
  */
 
 import {Annotation, ATTRIBUTE_HTTP_URL, ATTRIBUTE_HTTP_USER_AGENT, ATTRIBUTE_LONG_TASK_ATTRIBUTION, ATTRIBUTE_NAV_TYPE, parseUrl, RootSpan, Span, SpanKind, Tracer} from '@opencensus/web-core';
-import {GroupedPerfEntries} from './perf-recorder';
+import {GroupedPerfEntries} from './perf-grouper';
 import {PerformanceLongTaskTiming, PerformanceNavigationTimingExtended} from './perf-types';
 import {getResourceSpan} from './resource-span';
 import {annotationsForPerfTimeFields} from './util';
@@ -83,7 +83,7 @@ export function getInitialLoadRootSpan(
 
   const resourceSpans = perfEntries.resourceTimings.map(
       (resourceTiming) => getResourceSpan(resourceTiming, traceId, root.id));
-  const longTaskSpans = perfEntries.longTasks.map(
+  const longTaskSpans = perfEntries.longTaskTimings.map(
       (longTaskTiming) => getLongTaskSpan(longTaskTiming, traceId, root.id));
 
   root.spans = root.spans.concat(resourceSpans, longTaskSpans);

packages/opencensus-web-instrumentation-perf/src/long-tasks-recorder.ts

@@ -0,0 +1,41 @@
+/**
+ * Copyright 2019, OpenCensus Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {PerformanceLongTaskTiming, PerformanceObserverEntryList, WindowWithLongTasks} from './perf-types';
+
+/** Cast `window` to be access the `ocwLt` field for long task timings.  */
+const windowWithLongTasks = window as WindowWithLongTasks;
+
+/**
+ * Begin recording `longtask` timings. These need to be captured using
+ * `PerformanceObserver`.
+ */
+export function recordLongTasks() {
+  if (!windowWithLongTasks.performance) return;
+  if (windowWithLongTasks.PerformanceObserver) {
+    const longTaskObserver =
+        new windowWithLongTasks.PerformanceObserver(onLongTasks);
+    longTaskObserver.observe({entryTypes: ['longtask']});
+  }
+  windowWithLongTasks.ocwLt = [];
+}
+
+function onLongTasks(entryList: PerformanceObserverEntryList) {
+  // These must be PerformanceLongTaskTiming objects because we only observe
+  // 'longtask' above.
+  windowWithLongTasks.ocwLt!.push(
+      ...(entryList.getEntries() as PerformanceLongTaskTiming[]));
+}

packages/opencensus-web-instrumentation-perf/src/perf-grouper.ts

@@ -0,0 +1,67 @@
+/**
+ * Copyright 2019, OpenCensus Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {PerformanceLongTaskTiming, PerformanceNavigationTimingExtended, PerformancePaintTiming, PerformanceResourceTimingExtended, WindowWithLongTasks} from './perf-types';
+
+/** Cast `window` to be access the `ocwLt` field for long task timings.  */
+const windowWithLongTasks = window as WindowWithLongTasks;
+
+/** Represent all collected performance timings grouped by type. */
+export interface GroupedPerfEntries {
+  navigationTiming?: PerformanceNavigationTimingExtended;
+  paintTimings: PerformancePaintTiming[];
+  resourceTimings: PerformanceResourceTimingExtended[];
+  longTaskTimings: PerformanceLongTaskTiming[];
+}
+
+/** Returns the recorded performance entries but does not clear them. */
+export function getPerfEntries(): GroupedPerfEntries {
+  if (!window.performance) {
+    return {
+      resourceTimings: [],
+      longTaskTimings: [],
+      paintTimings: [],
+    };
+  }
+
+  const perf = window.performance;
+
+  const longTaskTimings = windowWithLongTasks.ocwLt;
+
+  const entries: GroupedPerfEntries = {
+    resourceTimings: perf.getEntriesByType('resource') as
+        PerformanceResourceTimingExtended[],
+    paintTimings: perf.getEntriesByType('paint') as PerformancePaintTiming[],
+    longTaskTimings: longTaskTimings ? longTaskTimings.slice() : [],
+  };
+
+  const navEntries = perf.getEntriesByType('navigation');
+  if (navEntries.length) {
+    entries.navigationTiming =
+        navEntries[0] as PerformanceNavigationTimingExtended;
+  }
+
+  return entries;
+}
+
+/** Clears resource timings, marks, measures and stored long task timings. */
+export function clearPerfEntries() {
+  if (!window.performance) return;
+  windowWithLongTasks.ocwLt = [];
+  performance.clearResourceTimings();
+  performance.clearMarks();
+  performance.clearMeasures();
+}

packages/opencensus-web-instrumentation-perf/src/perf-recorder.ts

@@ -162,3 +162,8 @@ export declare interface PerformanceLongTaskTiming extends PerformanceEntry {
 export declare type WindowWithPerformanceObserver = Window & {
   readonly PerformanceObserver?: PerformanceObserver;
 };
+
+/** Type for the `window` object with a field to track LongTask timings. */
+export declare type WindowWithLongTasks = WindowWithPerformanceObserver & {
+  ocwLt?: PerformanceLongTaskTiming[];
+};

packages/opencensus-web-instrumentation-perf/src/perf-types.ts

@@ -18,5 +18,5 @@
 // should import from all test files.
 
 import './test-initial-load-root-span';
-import './test-perf-recorder';
+import './test-perf-grouper';
 import './test-resource-span';

packages/opencensus-web-instrumentation-perf/test/index.ts

@@ -16,7 +16,7 @@
 
 import {Annotation, Attributes, SpanKind, Tracer} from '@opencensus/web-core';
 import {getInitialLoadRootSpan} from '../src/initial-load-root-span';
-import {GroupedPerfEntries} from '../src/perf-recorder';
+import {GroupedPerfEntries} from '../src/perf-grouper';
 
 const SPAN_ID_REGEX = /[0-9a-f]{16}/;
 const USER_AGENT = 'Mozilla/5.0 TEST';
@@ -49,7 +49,7 @@ const PERF_ENTRIES: GroupedPerfEntries = {
       toJSON: () => ({}),
     },
   ],
-  longTasks: [
+  longTaskTimings: [
     {
       name: 'self',
       entryType: 'longtask',

packages/opencensus-web-instrumentation-perf/test/test-initial-load-root-span.ts

@@ -14,7 +14,8 @@
  * limitations under the License.
  */
 
-import {clearPerfEntries, getPerfEntries, recordPerfEntries, TEST_ONLY} from '../src/perf-recorder';
+import {recordLongTasks} from '../src/long-tasks-recorder';
+import {clearPerfEntries, getPerfEntries} from '../src/perf-grouper';
 import {PerformanceLongTaskTiming, PerformanceNavigationTimingExtended, PerformanceObserver, PerformanceObserverConfig, PerformanceObserverEntryList, PerformancePaintTiming, PerformanceResourceTimingExtended} from '../src/perf-types';
 
 const LONG_TASK_1: PerformanceLongTaskTiming = {
@@ -157,24 +158,17 @@ describe('performance recorder functions', () => {
     windowWithPerfObserver.PerformanceObserver = realPerformanceObserver;
   });
 
-  describe('recordPerfEntries', () => {
-    it('increases the resource buffer size', () => {
-      spyOn(performance, 'setResourceTimingBufferSize');
-      recordPerfEntries();
-      expect(performance.setResourceTimingBufferSize)
-          .toHaveBeenCalledWith(TEST_ONLY.RESOURCE_TIMING_BUFFER_SIZE);
-    });
-
+  describe('recordLongTasks', () => {
     it('starts tracking long tasks', () => {
-      recordPerfEntries();
+      recordLongTasks();
       expect(performanceObserver).toBeDefined();
       expect(performanceObserver!.config).toEqual({entryTypes: ['longtask']});
     });
   });
 
   describe('getPerfEntries', () => {
     it('combines perf entries for nav, paint, resource and long tasks', () => {
-      recordPerfEntries();
+      recordLongTasks();
       performanceObserver!.sendMockPerfEntries(
           new MockPerfEntryList([LONG_TASK_1, LONG_TASK_2]));
       spyOn(performance, 'getEntriesByType')
@@ -186,7 +180,7 @@ describe('performance recorder functions', () => {
         navigationTiming: NAVIGATION_ENTRY,
         paintTimings: [PAINT_ENTRY],
         resourceTimings: [RESOURCE_ENTRY],
-        longTasks: [LONG_TASK_1, LONG_TASK_2],
+        longTaskTimings: [LONG_TASK_1, LONG_TASK_2],
       });
     });
   });
@@ -205,14 +199,14 @@ describe('performance recorder functions', () => {
     });
 
     it('clears stored long tasks', () => {
-      recordPerfEntries();
+      recordLongTasks();
       performanceObserver!.sendMockPerfEntries(
           new MockPerfEntryList([LONG_TASK_1]));
-      expect(getPerfEntries().longTasks.length).toBe(1);
+      expect(getPerfEntries().longTaskTimings.length).toBe(1);
 
       clearPerfEntries();
 
-      expect(getPerfEntries().longTasks.length).toBe(0);
+      expect(getPerfEntries().longTaskTimings.length).toBe(0);
     });
   });
 });