@office-iss/react-native-win32 0.0.0-canary.298 → 0.0.0-canary.299

package/src/private/webapis/performance/Performance.js

@@ -18,6 +18,7 @@ import type {
 import type {DetailType, PerformanceMarkOptions} from './UserTiming';
 
 import DOMException from '../errors/DOMException';
+import structuredClone from '../structuredClone/structuredClone';
 import {setPlatformObject} from '../webidl/PlatformObjects';
 import {EventCounts} from './EventTiming';
 import {
@@ -38,12 +39,17 @@ declare var global: {
 const getCurrentTimeStamp: () => DOMHighResTimeStamp =
   NativePerformance?.now ?? global.nativePerformanceNow ?? (() => Date.now());
 
-export type PerformanceMeasureOptions = {
-  detail?: DetailType,
-  start?: DOMHighResTimeStamp,
-  duration?: DOMHighResTimeStamp,
-  end?: DOMHighResTimeStamp,
-};
+export type PerformanceMeasureOptions =
+  | {
+      detail?: DetailType,
+      start?: DOMHighResTimeStamp | string,
+      duration?: DOMHighResTimeStamp,
+    }
+  | {
+      detail?: DetailType,
+      start?: DOMHighResTimeStamp | string,
+      end?: DOMHighResTimeStamp | string,
+    };
 
 const ENTRY_TYPES_AVAILABLE_FROM_TIMELINE: $ReadOnlyArray<PerformanceEntryType> =
   ['mark', 'measure'];
@@ -111,11 +117,39 @@ export default class Performance {
     markName: string,
     markOptions?: PerformanceMarkOptions,
   ): PerformanceMark {
+    if (markName == null) {
+      throw new TypeError(
+        `Failed to execute 'mark' on 'Performance': 1 argument required, but only 0 present.`,
+      );
+    }
+
+    let resolvedDetail;
+    if (markOptions?.detail != null) {
+      resolvedDetail = structuredClone(markOptions.detail);
+    }
+
     let computedStartTime;
     if (NativePerformance?.markWithResult) {
+      let resolvedStartTime;
+
+      const startTime = markOptions?.startTime;
+      if (startTime !== undefined) {
+        resolvedStartTime = Number(startTime);
+        if (resolvedStartTime < 0) {
+          throw new TypeError(
+            `Failed to execute 'mark' on 'Performance': '${markName}' cannot have a negative start time.`,
+          );
+        } else if (!Number.isFinite(resolvedStartTime)) {
+          throw new TypeError(
+            `Failed to execute 'mark' on 'Performance': Failed to read the 'startTime' property from 'PerformanceMarkOptions': The provided double value is non-finite.`,
+          );
+        }
+      }
+
+      // $FlowExpectedError[not-a-function]
       computedStartTime = NativePerformance.markWithResult(
         markName,
-        markOptions?.startTime,
+        resolvedStartTime,
       );
     } else {
       warnNoNativePerformance();
@@ -124,7 +158,7 @@ export default class Performance {
 
     return new PerformanceMark(markName, {
       startTime: computedStartTime,
-      detail: markOptions?.detail,
+      detail: resolvedDetail,
     });
   }
 
@@ -142,66 +176,135 @@ export default class Performance {
     startMarkOrOptions?: string | PerformanceMeasureOptions,
     endMark?: string,
   ): PerformanceMeasure {
-    let options;
-    let startMarkName,
-      endMarkName = endMark,
-      duration,
-      startTime = 0,
-      endTime = 0;
-
-    if (typeof startMarkOrOptions === 'string') {
-      startMarkName = startMarkOrOptions;
-      options = {};
-    } else if (startMarkOrOptions !== undefined) {
-      options = startMarkOrOptions;
-      if (endMark !== undefined) {
-        throw new TypeError(
-          "Performance.measure: Can't have both options and endMark",
-        );
-      }
-      if (options.start === undefined && options.end === undefined) {
-        throw new TypeError(
-          'Performance.measure: Must have at least one of start/end specified in options',
-        );
-      }
-      if (
-        options.start !== undefined &&
-        options.end !== undefined &&
-        options.duration !== undefined
-      ) {
-        throw new TypeError(
-          "Performance.measure: Can't have both start/end and duration explicitly in options",
-        );
+    let resolvedStartTime: number | void;
+    let resolvedStartMark: string | void;
+    let resolvedEndTime: number | void;
+    let resolvedEndMark: string | void;
+    let resolvedDuration: number | void;
+    let resolvedDetail: mixed;
+
+    if (startMarkOrOptions != null) {
+      switch (typeof startMarkOrOptions) {
+        case 'object': {
+          if (endMark != null) {
+            throw new TypeError(
+              `Failed to execute 'measure' on 'Performance': If a non-empty PerformanceMeasureOptions object was passed, |end_mark| must not be passed.`,
+            );
+          }
+
+          const start = startMarkOrOptions.start;
+          switch (typeof start) {
+            case 'number': {
+              resolvedStartTime = start;
+              break;
+            }
+            case 'string': {
+              resolvedStartMark = start;
+              break;
+            }
+            case 'undefined': {
+              break;
+            }
+            default: {
+              resolvedStartMark = String(start);
+            }
+          }
+
+          const end = startMarkOrOptions.end;
+          switch (typeof end) {
+            case 'number': {
+              resolvedEndTime = end;
+              break;
+            }
+            case 'string': {
+              resolvedEndMark = end;
+              break;
+            }
+            case 'undefined': {
+              break;
+            }
+            default: {
+              resolvedEndMark = String(end);
+            }
+          }
+
+          const duration = startMarkOrOptions.duration;
+          switch (typeof duration) {
+            case 'number': {
+              resolvedDuration = duration;
+              break;
+            }
+            case 'undefined':
+              break;
+            default: {
+              resolvedDuration = Number(duration);
+              if (!Number.isFinite(resolvedDuration)) {
+                throw new TypeError(
+                  `Failed to execute 'measure' on 'Performance': Failed to read the 'duration' property from 'PerformanceMeasureOptions': The provided double value is non-finite.`,
+                );
+              }
+            }
+          }
+
+          if (
+            resolvedDuration != null &&
+            (resolvedEndMark != null || resolvedEndTime != null)
+          ) {
+            throw new TypeError(
+              `Failed to execute 'measure' on 'Performance': If a non-empty PerformanceMeasureOptions object was passed, it must not have all of its 'start', 'duration', and 'end' properties defined`,
+            );
+          }
+
+          const detail = startMarkOrOptions.detail;
+          if (detail != null) {
+            resolvedDetail = structuredClone(detail);
+          }
+
+          break;
+        }
+        case 'string': {
+          resolvedStartMark = startMarkOrOptions;
+
+          if (endMark !== undefined) {
+            resolvedEndMark = String(endMark);
+          }
+          break;
+        }
+        default: {
+          resolvedStartMark = String(startMarkOrOptions);
+        }
       }
-
-      if (typeof options.start === 'number') {
-        startTime = options.start;
-      } else {
-        startMarkName = options.start;
-      }
-
-      if (typeof options.end === 'number') {
-        endTime = options.end;
-      } else {
-        endMarkName = options.end;
-      }
-
-      duration = options.duration ?? duration;
     }
 
-    let computedStartTime = startTime;
-    let computedDuration = duration;
+    let computedStartTime = 0;
+    let computedDuration = 0;
 
-    if (NativePerformance?.measureWithResult) {
+    if (NativePerformance?.measure) {
+      try {
+        [computedStartTime, computedDuration] = NativePerformance.measure(
+          measureName,
+          resolvedStartTime,
+          resolvedEndTime,
+          resolvedDuration,
+          resolvedStartMark,
+          resolvedEndMark,
+        );
+      } catch (error) {
+        throw new DOMException(
+          "Failed to execute 'measure' on 'Performance': " + error.message,
+          'SyntaxError',
+        );
+      }
+    } else if (NativePerformance?.measureWithResult) {
       try {
         [computedStartTime, computedDuration] =
           NativePerformance.measureWithResult(
             measureName,
-            startTime,
-            endTime,
-            duration,
-            startMarkName,
-            endMarkName,
+            resolvedStartTime ?? 0,
+            resolvedEndTime ?? 0,
+            resolvedDuration,
+            resolvedStartMark,
+            resolvedEndMark,
           );
       } catch (error) {
         throw new DOMException(
@@ -216,7 +319,7 @@ export default class Performance {
     const measure = new PerformanceMeasure(measureName, {
       startTime: computedStartTime,
       duration: computedDuration ?? 0,
-      detail: options?.detail,
+      detail: resolvedDetail,
     });
 
     return measure;

package/src/private/webapis/performance/PerformanceEntry.js

@@ -29,10 +29,14 @@ export type PerformanceEntryJSON = {
 };
 
 export class PerformanceEntry {
-  #name: string;
-  #entryType: PerformanceEntryType;
-  #startTime: DOMHighResTimeStamp;
-  #duration: DOMHighResTimeStamp;
+  // We don't use private fields because they're significantly slower to
+  // initialize on construction and to access.
+  // We also need these to be protected so they can be initialized in subclasses
+  // where we avoid calling `super()` for performance reasons.
+  __name: string;
+  __entryType: PerformanceEntryType;
+  __startTime: DOMHighResTimeStamp;
+  __duration: DOMHighResTimeStamp;
 
   constructor(init: {
     name: string,
@@ -40,34 +44,34 @@ export class PerformanceEntry {
     startTime: DOMHighResTimeStamp,
     duration: DOMHighResTimeStamp,
   }) {
-    this.#name = init.name;
-    this.#entryType = init.entryType;
-    this.#startTime = init.startTime;
-    this.#duration = init.duration;
+    this.__name = init.name;
+    this.__entryType = init.entryType;
+    this.__startTime = init.startTime;
+    this.__duration = init.duration;
   }
 
   get name(): string {
-    return this.#name;
+    return this.__name;
   }
 
   get entryType(): PerformanceEntryType {
-    return this.#entryType;
+    return this.__entryType;
   }
 
   get startTime(): DOMHighResTimeStamp {
-    return this.#startTime;
+    return this.__startTime;
   }
 
   get duration(): DOMHighResTimeStamp {
-    return this.#duration;
+    return this.__duration;
   }
 
   toJSON(): PerformanceEntryJSON {
     return {
-      name: this.#name,
-      entryType: this.#entryType,
-      startTime: this.#startTime,
-      duration: this.#duration,
+      name: this.__name,
+      entryType: this.__entryType,
+      startTime: this.__startTime,
+      duration: this.__duration,
     };
   }
 }

package/src/private/webapis/performance/PerformanceObserver.js

@@ -23,6 +23,7 @@ import {
 } from './internals/RawPerformanceEntry';
 import {warnNoNativePerformance} from './internals/Utilities';
 import NativePerformance from './specs/NativePerformance';
+import nullthrows from 'nullthrows';
 
 export {PerformanceEntry} from './PerformanceEntry';
 
@@ -130,14 +131,16 @@ export class PerformanceObserver {
       this.#nativeObserverHandle = this.#createNativeObserver();
     }
 
+    const observerHandle = nullthrows(this.#nativeObserverHandle);
+
     if (options.entryTypes) {
       this.#type = 'multiple';
-      NativePerformance.observe?.(this.#nativeObserverHandle, {
+      NativePerformance.observe?.(observerHandle, {
         entryTypes: options.entryTypes.map(performanceEntryTypeToRaw),
       });
     } else if (options.type) {
       this.#type = 'single';
-      NativePerformance.observe?.(this.#nativeObserverHandle, {
+      NativePerformance.observe?.(observerHandle, {
         type: performanceEntryTypeToRaw(options.type),
         buffered: options.buffered,
         durationThreshold: options.durationThreshold,
@@ -158,37 +161,38 @@ export class PerformanceObserver {
     NativePerformance.disconnect(this.#nativeObserverHandle);
   }
 
-  #createNativeObserver(): OpaqueNativeObserverHandle {
+  #createNativeObserver(): OpaqueNativeObserverHandle | null {
     if (!NativePerformance || !NativePerformance.createObserver) {
       warnNoNativePerformance();
-      return;
+      return null;
     }
 
     this.#calledAtLeastOnce = false;
 
-    return NativePerformance.createObserver(() => {
-      const rawEntries = NativePerformance.takeRecords?.(
-        this.#nativeObserverHandle,
-        true, // sort records
-      );
-      if (!rawEntries) {
-        return;
-      }
-
-      const entries = rawEntries.map(rawToPerformanceEntry);
-      const entryList = new PerformanceObserverEntryList(entries);
-
-      let droppedEntriesCount = 0;
-      if (!this.#calledAtLeastOnce) {
-        droppedEntriesCount =
-          NativePerformance.getDroppedEntriesCount?.(
-            this.#nativeObserverHandle,
-          ) ?? 0;
-        this.#calledAtLeastOnce = true;
-      }
-
-      this.#callback(entryList, this, {droppedEntriesCount});
-    });
+    const observerHandle: OpaqueNativeObserverHandle =
+      NativePerformance.createObserver(() => {
+        const rawEntries = NativePerformance.takeRecords?.(
+          observerHandle,
+          true, // sort records
+        );
+        if (!rawEntries) {
+          return;
+        }
+
+        const entries = rawEntries.map(rawToPerformanceEntry);
+        const entryList = new PerformanceObserverEntryList(entries);
+
+        let droppedEntriesCount = 0;
+        if (!this.#calledAtLeastOnce) {
+          droppedEntriesCount =
+            NativePerformance.getDroppedEntriesCount?.(observerHandle) ?? 0;
+          this.#calledAtLeastOnce = true;
+        }
+
+        this.#callback(entryList, this, {droppedEntriesCount});
+      });
+
+    return observerHandle;
   }
 
   #validateObserveOptions(options: PerformanceObserverInit): void {

package/src/private/webapis/performance/ResourceTiming.js

@@ -0,0 +1,108 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @flow strict
+ */
+
+// flowlint unsafe-getters-setters:off
+
+import type {
+  DOMHighResTimeStamp,
+  PerformanceEntryJSON,
+} from './PerformanceEntry';
+
+import {PerformanceEntry} from './PerformanceEntry';
+
+export type PerformanceResourceTimingJSON = {
+  ...PerformanceEntryJSON,
+  fetchStart: DOMHighResTimeStamp,
+  requestStart: DOMHighResTimeStamp,
+  connectStart: DOMHighResTimeStamp,
+  connectEnd: DOMHighResTimeStamp,
+  responseStart: DOMHighResTimeStamp,
+  responseEnd: DOMHighResTimeStamp,
+  responseStatus: ?number,
+  ...
+};
+
+export class PerformanceResourceTiming extends PerformanceEntry {
+  #fetchStart: DOMHighResTimeStamp;
+  #requestStart: DOMHighResTimeStamp;
+  #connectStart: DOMHighResTimeStamp;
+  #connectEnd: DOMHighResTimeStamp;
+  #responseStart: DOMHighResTimeStamp;
+  #responseEnd: DOMHighResTimeStamp;
+  #responseStatus: ?number;
+
+  constructor(init: {
+    name: string,
+    startTime: DOMHighResTimeStamp,
+    duration: DOMHighResTimeStamp,
+    fetchStart: DOMHighResTimeStamp,
+    requestStart: DOMHighResTimeStamp,
+    connectStart: DOMHighResTimeStamp,
+    connectEnd: DOMHighResTimeStamp,
+    responseStart: DOMHighResTimeStamp,
+    responseEnd: DOMHighResTimeStamp,
+    responseStatus?: number,
+  }) {
+    super({
+      name: init.name,
+      entryType: 'resource',
+      startTime: init.startTime,
+      duration: init.duration,
+    });
+    this.#fetchStart = init.fetchStart;
+    this.#requestStart = init.requestStart;
+    this.#connectStart = init.connectStart;
+    this.#connectEnd = init.connectEnd;
+    this.#responseStart = init.responseStart;
+    this.#responseEnd = init.responseEnd;
+    this.#responseStatus = init.responseStatus;
+  }
+
+  get fetchStart(): DOMHighResTimeStamp {
+    return this.#fetchStart;
+  }
+
+  get requestStart(): DOMHighResTimeStamp {
+    return this.#requestStart;
+  }
+
+  get connectStart(): DOMHighResTimeStamp {
+    return this.#connectStart;
+  }
+
+  get connectEnd(): DOMHighResTimeStamp {
+    return this.#connectEnd;
+  }
+
+  get responseStart(): DOMHighResTimeStamp {
+    return this.#responseStart;
+  }
+
+  get responseEnd(): DOMHighResTimeStamp {
+    return this.#responseEnd;
+  }
+
+  get responseStatus(): ?number {
+    return this.#responseStatus;
+  }
+
+  toJSON(): PerformanceResourceTimingJSON {
+    return {
+      ...super.toJSON(),
+      fetchStart: this.#fetchStart,
+      requestStart: this.#requestStart,
+      connectStart: this.#connectStart,
+      connectEnd: this.#connectEnd,
+      responseStart: this.#responseStart,
+      responseEnd: this.#responseEnd,
+      responseStatus: this.#responseStatus,
+    };
+  }
+}

package/src/private/webapis/performance/UserTiming.js

@@ -29,9 +29,12 @@ export type PerformanceMeasureInit = {
   duration: DOMHighResTimeStamp,
 };
 
-export class PerformanceMark extends PerformanceEntry {
-  #detail: DetailType;
+class PerformanceMarkTemplate extends PerformanceEntry {
+  // We don't use private fields because they're significantly slower to
+  // initialize on construction and to access.
+  _detail: DetailType;
 
+  // This constructor isn't really used. See `PerformanceMark` below.
   constructor(markName: string, markOptions?: PerformanceMarkOptions) {
     super({
       name: markName,
@@ -41,18 +44,46 @@ export class PerformanceMark extends PerformanceEntry {
     });
 
     if (markOptions) {
-      this.#detail = markOptions.detail;
+      this._detail = markOptions.detail;
     }
   }
 
   get detail(): DetailType {
-    return this.#detail;
+    return this._detail;
   }
 }
 
-export class PerformanceMeasure extends PerformanceEntry {
-  #detail: DetailType;
+// This is the real value we're exporting where we define the class a function
+// so we don't need to call `super()` and we can avoid the performance penalty
+// of the current code transpiled with Babel.
+// We should remove this when we have built-in support for classes in the
+// runtime.
+export const PerformanceMark: typeof PerformanceMarkTemplate =
+  // $FlowExpectedError[incompatible-type]
+  function PerformanceMark(
+    this: PerformanceMarkTemplate,
+    markName: string,
+    markOptions?: PerformanceMarkOptions,
+  ) {
+    this.__name = markName;
+    this.__entryType = 'mark';
+    this.__startTime = markOptions?.startTime ?? performance.now();
+    this.__duration = 0;
 
+    if (markOptions) {
+      this._detail = markOptions.detail;
+    }
+  };
+
+// $FlowExpectedError[prop-missing]
+PerformanceMark.prototype = PerformanceMarkTemplate.prototype;
+
+class PerformanceMeasureTemplate extends PerformanceEntry {
+  // We don't use private fields because they're significantly slower to
+  // initialize on construction and to access.
+  _detail: DetailType;
+
+  // This constructor isn't really used. See `PerformanceMeasure` below.
   constructor(measureName: string, measureOptions: PerformanceMeasureInit) {
     super({
       name: measureName,
@@ -62,11 +93,32 @@ export class PerformanceMeasure extends PerformanceEntry {
     });
 
     if (measureOptions) {
-      this.#detail = measureOptions.detail;
+      this._detail = measureOptions.detail;
     }
   }
 
   get detail(): DetailType {
-    return this.#detail;
+    return this._detail;
   }
 }
+
+// We do the same here as we do for `PerformanceMark` for performance reasons.
+export const PerformanceMeasure: typeof PerformanceMeasureTemplate =
+  // $FlowExpectedError[incompatible-type]
+  function PerformanceMeasure(
+    this: PerformanceMeasureTemplate,
+    measureName: string,
+    measureOptions: PerformanceMeasureInit,
+  ) {
+    this.__name = measureName;
+    this.__entryType = 'measure';
+    this.__startTime = measureOptions.startTime;
+    this.__duration = measureOptions.duration;
+
+    if (measureOptions) {
+      this._detail = measureOptions.detail;
+    }
+  };
+
+// $FlowExpectedError[prop-missing]
+PerformanceMeasure.prototype = PerformanceMeasureTemplate.prototype;