rename some instances of profiler to renderStream

Author: phryneas

src/index.ts

@@ -2,6 +2,7 @@ export type {
   NextRenderOptions,
   RenderStream,
   RenderStreamWithRenderFn,
+  RenderStreamOptions,
 } from "./profile/profile.js";
 export {
   createRenderStream,
@@ -12,6 +13,8 @@ export {
 export type { SyncScreen } from "./profile/Render.js";
 
 export { renderToRenderStream } from "./renderToRenderStream.js";
+export type { RenderStreamWithRenderResult } from "./renderToRenderStream.js";
 export { renderHookToSnapshotStream } from "./renderHookToSnapshotStream.js";
+export type { SnapshotStream } from "./renderHookToSnapshotStream.js";
 
 export type { Assertable } from "./assertable.js";

src/jest/ProfiledComponent.ts

@@ -11,13 +11,13 @@ import { assertableSymbol } from "../assertable.js";
 
 export const toRerender: MatcherFunction<[options?: NextRenderOptions]> =
   async function (actual, options) {
-    const _profiler = actual as RenderStream<any> | Assertable;
-    const profiler =
-      assertableSymbol in _profiler ? _profiler[assertableSymbol] : _profiler;
+    const _stream = actual as RenderStream<any> | Assertable;
+    const stream =
+      assertableSymbol in _stream ? _stream[assertableSymbol] : _stream;
     const hint = this.utils.matcherHint("toRerender", "ProfiledComponent", "");
     let pass = true;
     try {
-      await profiler.peekRender({ timeout: 100, ...options });
+      await stream.peekRender({ timeout: 100, ...options });
     } catch (e) {
       if (e instanceof WaitForRenderTimeoutError) {
         pass = false;
@@ -44,26 +44,26 @@ const failed = {};
 export const toRenderExactlyTimes: MatcherFunction<
   [times: number, options?: NextRenderOptions]
 > = async function (actual, times, optionsPerRender) {
-  const _profiler = actual as RenderStream<any> | Assertable;
-  const profiler =
-    assertableSymbol in _profiler ? _profiler[assertableSymbol] : _profiler;
+  const _stream = actual as RenderStream<any> | Assertable;
+  const stream =
+    assertableSymbol in _stream ? _stream[assertableSymbol] : _stream;
   const options = { timeout: 100, ...optionsPerRender };
   const hint = this.utils.matcherHint("toRenderExactlyTimes");
   let pass = true;
   try {
-    if (profiler.totalRenderCount() > times) {
+    if (stream.totalRenderCount() > times) {
       throw failed;
     }
     try {
-      while (profiler.totalRenderCount() < times) {
-        await profiler.waitForNextRender(options);
+      while (stream.totalRenderCount() < times) {
+        await stream.waitForNextRender(options);
       }
     } catch (e) {
       // timeouts here should just fail the test, rethrow other errors
       throw e instanceof WaitForRenderTimeoutError ? failed : e;
     }
     try {
-      await profiler.waitForNextRender(options);
+      await stream.waitForNextRender(options);
     } catch (e) {
       // we are expecting a timeout here, so swallow that error, rethrow others
       if (!(e instanceof WaitForRenderTimeoutError)) {
@@ -83,7 +83,7 @@ export const toRenderExactlyTimes: MatcherFunction<
       return (
         hint +
         ` Expected component to${pass ? " not" : ""} render exactly ${times}.` +
-        ` It rendered ${profiler.totalRenderCount()} times.`
+        ` It rendered ${stream.totalRenderCount()} times.`
       );
     },
   };

src/profile/context.tsx

@@ -1,33 +1,33 @@
 import * as React from "rehackt";
 
-export interface ProfilerContextValue {
+export interface RenderStreamContextValue {
   renderedComponents: Array<React.ComponentType | string>;
 }
 
-const ProfilerContext = React.createContext<ProfilerContextValue | undefined>(
-  undefined
-);
+const RenderStreamContext = React.createContext<
+  RenderStreamContextValue | undefined
+>(undefined);
 
-export function ProfilerContextProvider({
+export function RenderStreamContextProvider({
   children,
   value,
 }: {
   children: React.ReactNode;
-  value: ProfilerContextValue;
+  value: RenderStreamContextValue;
 }) {
-  const parentContext = useProfilerContext();
+  const parentContext = useRenderStreamContext();
 
   if (parentContext) {
-    throw new Error("Profilers should not be nested in the same tree");
+    throw new Error("Render streams should not be nested in the same tree");
   }
 
   return (
-    <ProfilerContext.Provider value={value}>
+    <RenderStreamContext.Provider value={value}>
       {children}
-    </ProfilerContext.Provider>
+    </RenderStreamContext.Provider>
   );
 }
 
-export function useProfilerContext() {
-  return React.useContext(ProfilerContext);
+export function useRenderStreamContext() {
+  return React.useContext(RenderStreamContext);
 }

src/profile/profile.tsx

@@ -3,8 +3,11 @@ import * as React from "rehackt";
 import type { Render, BaseRender } from "./Render.js";
 import { RenderInstance } from "./Render.js";
 import { applyStackTrace, captureStackTrace } from "./traces.js";
-import type { ProfilerContextValue } from "./context.js";
-import { ProfilerContextProvider, useProfilerContext } from "./context.js";
+import type { RenderStreamContextValue } from "./context.js";
+import {
+  RenderStreamContextProvider,
+  useRenderStreamContext,
+} from "./context.js";
 import { disableActWarnings } from "./disableActWarnings.js";
 import { render as baseRender, RenderOptions } from "@testing-library/react";
 import { Assertable, markAssertable } from "../assertable.js";
@@ -87,7 +90,7 @@ export interface RenderStreamWithRenderFn<Snapshot extends ValidSnapshot>
   render: typeof baseRender;
 }
 
-export type ProfilerOptions<Snapshot extends ValidSnapshot> = {
+export type RenderStreamOptions<Snapshot extends ValidSnapshot> = {
   onRender?: (
     info: BaseRender & {
       snapshot: Snapshot;
@@ -109,7 +112,7 @@ export function createRenderStream<Snapshot extends ValidSnapshot = void>({
   snapshotDOM = false,
   initialSnapshot,
   skipNonTrackingRenders,
-}: ProfilerOptions<Snapshot> = {}): RenderStreamWithRenderFn<Snapshot> {
+}: RenderStreamOptions<Snapshot> = {}): RenderStreamWithRenderFn<Snapshot> {
   let nextRender: Promise<Render<Snapshot>> | undefined;
   let resolveNextRender: ((render: Render<Snapshot>) => void) | undefined;
   let rejectNextRender: ((error: unknown) => void) | undefined;
@@ -144,7 +147,7 @@ export function createRenderStream<Snapshot extends ValidSnapshot = void>({
     }));
   };
 
-  const profilerContext: ProfilerContextValue = {
+  const profilerContext: RenderStreamContextValue = {
     renderedComponents: [],
   };
 
@@ -214,11 +217,11 @@ export function createRenderStream<Snapshot extends ValidSnapshot = void>({
   let iteratorPosition = 0;
   function Wrapper({ children }: { children: React.ReactNode }) {
     return (
-      <ProfilerContextProvider value={profilerContext}>
+      <RenderStreamContextProvider value={profilerContext}>
         <React.Profiler id="test" onRender={profilerOnRender}>
           {children}
         </React.Profiler>
-      </ProfilerContextProvider>
+      </RenderStreamContextProvider>
     );
   }
 
@@ -376,7 +379,7 @@ export function useTrackRenders({ name }: { name?: string } = {}) {
     );
   }
 
-  const ctx = useProfilerContext();
+  const ctx = useRenderStreamContext();
 
   if (!ctx) {
     throw new Error(

src/renderHookToSnapshotStream.ts

@@ -8,7 +8,7 @@ import { Render } from "./profile/Render.js";
 import { createElement } from "react";
 import { Assertable, assertableSymbol, markAssertable } from "./assertable.js";
 
-export interface ProfiledHook<Snapshot extends ValidSnapshot>
+export interface SnapshotStream<Snapshot extends ValidSnapshot, Props>
   extends Assertable {
   /**
    * An array of all renders that have happened so far.
@@ -44,11 +44,6 @@ export interface ProfiledHook<Snapshot extends ValidSnapshot>
    * Does not advance the render iterator.
    */
   waitForNextSnapshot(options?: NextRenderOptions): Promise<Snapshot>;
-}
-
-interface HookSnapshotStream<Props, ReturnValue extends ValidSnapshot>
-  extends ProfiledHook<ReturnValue>,
-    Assertable {
   rerender: (rerenderCallbackProps: Props) => void;
   unmount: () => void;
 }
@@ -59,7 +54,7 @@ export function renderHookToSnapshotStream<
 >(
   renderCallback: (props: Props) => ReturnValue,
   { initialProps, ...options }: RenderHookOptions<Props> = {}
-): HookSnapshotStream<Props, ReturnValue> {
+): SnapshotStream<ReturnValue, Props> {
   const { render, ...stream } = createRenderStream<ReturnValue>();
 
   const ProfiledHook: React.FC<Props> = (props) => {

src/renderToRenderStream.ts

@@ -4,20 +4,19 @@ import {
 } from "@testing-library/react";
 import {
   createRenderStream,
-  ProfiledComponentFields,
-  ProfiledComponentOnlyFields,
-  ProfilerOptions,
+  RenderStreamOptions,
+  RenderStream,
   ValidSnapshot,
 } from "./profile/profile.js";
 
 type RenderOptions<Snapshot extends ValidSnapshot = void> = BaseOptions &
-  ProfilerOptions<Snapshot>;
+  RenderStreamOptions<Snapshot>;
 
-type RenderResult<Snapshot extends ValidSnapshot = void> =
-  ProfiledComponentFields<Snapshot> &
-    ProfiledComponentOnlyFields<Snapshot> & {
-      renderResultPromise: Promise<BaseResult>;
-    };
+export interface RenderStreamWithRenderResult<
+  Snapshot extends ValidSnapshot = void,
+> extends RenderStream<Snapshot> {
+  renderResultPromise: Promise<BaseResult>;
+}
 
 /**
  * Render into a container which is appended to document.body. It should be used with cleanup.
@@ -32,13 +31,16 @@ export function renderToRenderStream<Snapshot extends ValidSnapshot = void>(
     skipNonTrackingRenders,
     ...options
   }: RenderOptions<Snapshot> = {}
-): RenderResult<Snapshot> {
+): RenderStreamWithRenderResult<Snapshot> {
   const { render, ...stream } = createRenderStream<Snapshot>({
     onRender,
     snapshotDOM,
     initialSnapshot,
     skipNonTrackingRenders,
   });
+  // `render` needs to be called asynchronously here, because the definition of `ui`
+  // might contain components that reference the return value of `renderToRenderStream`
+  // itself, e.g. `replaceSnapshot` or `mergeSnapshot`.
   const renderResultPromise = Promise.resolve().then(() => render(ui, options));
   return { ...stream, renderResultPromise };
 }