universal-test-renderer 0.3.0-react19.0 → 0.4.0

package/README.md

@@ -24,10 +24,10 @@ Note: this package is now compatible with React 18.3. In the near future I will
 
 ```tsx
 import { act } from "react";
-import { createRenderer } from "universal-test-renderer";
+import { createRoot } from "universal-test-renderer";
 
 test("basic renderer usage", () => {
-  const renderer = createRenderer();
+  const renderer = createRoot();
   act(() => {
     renderer.render(<div>Hello!</div>);
   });

package/dist/index.cjs

@@ -60,7 +60,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var src_exports = {};
 __export(src_exports, {
   CONTAINER_TYPE: () => CONTAINER_TYPE,
-  createRenderer: () => createRenderer
+  createRoot: () => createRoot
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -85,10 +85,8 @@ function formatComponentList(names) {
 }
 
 // src/reconciler.ts
-var NoEventPriority = 0;
-var UPDATE_SIGNAL = {};
 var nodeToInstanceMap = /* @__PURE__ */ new WeakMap();
-var currentUpdatePriority = NoEventPriority;
+var currentUpdatePriority = import_constants.NoEventPriority;
 var hostConfig = {
   /**
    * The reconciler has two modes: mutation mode and persistent mode. You must specify one of them.
@@ -129,6 +127,8 @@ var hostConfig = {
    */
   supportsPersistence: false,
   /**
+   * #### `createInstance(type, props, rootContainer, hostContext, internalHandle)`
+   *
    * This method should return a newly created node. For example, the DOM renderer would call
    * `document.createElement(type)` here and then set the properties from `props`.
    *
@@ -161,14 +161,16 @@ var hostConfig = {
     };
   },
   /**
+   * #### `createTextInstance(text, rootContainer, hostContext, internalHandle)`
+   *
    * Same as `createInstance`, but for text nodes. If your renderer doesn't support text nodes, you can
    * throw here.
    */
   createTextInstance(text, rootContainer, hostContext, _internalHandle) {
-    if (rootContainer.textComponents && !hostContext.isInsideText) {
+    if (rootContainer.config.textComponents && !hostContext.isInsideText) {
       throw new Error(
         `Invariant Violation: Text strings must be rendered within a ${formatComponentList(
-          rootContainer.textComponents
+          rootContainer.config.textComponents
         )} component. Detected attempt to render "${text}" string within a <${hostContext.type}> component.`
       );
     }
@@ -179,8 +181,20 @@ var hostConfig = {
       isHidden: false
     };
   },
+  /**
+   * #### `appendInitialChild(parentInstance, child)`
+   *
+   * This method should mutate the `parentInstance` and add the child to its list of children.
+   * For example, in the DOM this would translate to a `parentInstance.appendChild(child)` call.
+   *
+   * This method happens **in the render phase**. It can mutate `parentInstance` and `child`, but it
+   * must not modify any other nodes. It's called while the tree is still being built up and not connected
+   * to the actual tree on the screen.
+   */
   appendInitialChild: appendChild,
   /**
+   * #### `finalizeInitialChildren(instance, type, props, rootContainer, hostContext)`
+   *
    * In this method, you can perform some final mutations on the `instance`. Unlike with `createInstance`,
    * by the time `finalizeInitialChildren` is called, all the initial children have already been added to
    * the `instance`, but the instance itself has not yet been connected to the tree on the screen.
@@ -198,22 +212,8 @@ var hostConfig = {
     return false;
   },
   /**
-   * React calls this method so that you can compare the previous and the next props, and decide whether you
-   * need to update the underlying instance or not. If you don't need to update it, return `null`. If you
-   * need to update it, you can return an arbitrary object representing the changes that need to happen.
-   * Then in `commitUpdate` you would need to apply those changes to the instance.
-   *
-   * This method happens **in the render phase**. It should only *calculate* the update — but not apply it!
-   * For example, the DOM renderer returns an array that looks like `[prop1, value1, prop2, value2, ...]`
-   * for all props that have actually changed. And only in `commitUpdate` it applies those changes. You should
-   * calculate as much as you can in `prepareUpdate` so that `commitUpdate` can be very fast and straightforward.
+   * #### `shouldSetTextContent(type, props)`
    *
-   * See the meaning of `rootContainer` and `hostContext` in the `createInstance` documentation.
-   */
-  prepareUpdate(_instance, _type, _oldProps, _newProps, _rootContainer, _hostContext) {
-    return UPDATE_SIGNAL;
-  },
-  /**
    * Some target platforms support setting an instance's text content without manually creating a text node.
    * For example, in the DOM, you can set `node.textContent` instead of creating a text node and appending it.
    *
@@ -229,7 +229,21 @@ var hostConfig = {
   shouldSetTextContent(_type, _props) {
     return false;
   },
+  setCurrentUpdatePriority(newPriority) {
+    currentUpdatePriority = newPriority;
+  },
+  getCurrentUpdatePriority() {
+    return currentUpdatePriority;
+  },
+  resolveUpdatePriority() {
+    return currentUpdatePriority || import_constants.DefaultEventPriority;
+  },
+  shouldAttemptEagerTransition() {
+    return false;
+  },
   /**
+   * #### `getRootHostContext(rootContainer)`
+   *
    * This method lets you return the initial host context from the root of the tree. See `getChildHostContext`
    * for the explanation of host context.
    *
@@ -239,11 +253,13 @@ var hostConfig = {
   getRootHostContext(rootContainer) {
     return {
       type: "ROOT",
-      isInsideText: false,
-      textComponents: rootContainer.textComponents
+      config: rootContainer.config,
+      isInsideText: false
     };
   },
   /**
+   * #### `getChildHostContext(parentHostContext, type, rootContainer)`
+   *
    * Host context lets you track some information about where you are in the tree so that it's available
    * inside `createInstance` as the `hostContext` parameter. For example, the DOM renderer uses it to track
    * whether it's inside an HTML or an SVG tree, because `createInstance` implementation needs to be
@@ -260,11 +276,13 @@ var hostConfig = {
   getChildHostContext(parentHostContext, type) {
     var _a;
     const isInsideText = Boolean(
-      (_a = parentHostContext.textComponents) == null ? void 0 : _a.includes(type)
+      (_a = parentHostContext.config.textComponents) == null ? void 0 : _a.includes(type)
     );
     return __spreadProps(__spreadValues({}, parentHostContext), { type, isInsideText });
   },
   /**
+   * #### `getPublicInstance(instance)`
+   *
    * Determines what object gets exposed as a ref. You'll likely want to return the `instance` itself. But
    * in some cases it might make sense to only expose some part of it.
    *
@@ -273,7 +291,7 @@ var hostConfig = {
   getPublicInstance(instance) {
     switch (instance.tag) {
       case "INSTANCE": {
-        const createNodeMock = instance.rootContainer.createNodeMock;
+        const createNodeMock = instance.rootContainer.config.createNodeMock;
         const mockNode = createNodeMock({
           type: instance.type,
           props: instance.props,
@@ -287,6 +305,8 @@ var hostConfig = {
     }
   },
   /**
+   * #### `prepareForCommit(containerInfo)`
+   *
    * This method lets you store some information before React starts making changes to the tree on
    * the screen. For example, the DOM renderer stores the current text selection so that it can later
    * restore it. This method is mirrored by `resetAfterCommit`.
@@ -297,6 +317,8 @@ var hostConfig = {
     return null;
   },
   /**
+   * #### `resetAfterCommit(containerInfo)`
+   *
    * This method is called right after React has performed the tree mutations. You can use it to restore
    * something you've stored in `prepareForCommit` — for example, text selection.
    *
@@ -305,21 +327,34 @@ var hostConfig = {
   resetAfterCommit(_containerInfo) {
   },
   /**
+   * #### `preparePortalMount(containerInfo)`
+   *
    * This method is called for a container that's used as a portal target. Usually you can leave it empty.
    */
   preparePortalMount(_containerInfo) {
   },
   /**
+   * #### `scheduleTimeout(fn, delay)`
+   *
    * You can proxy this to `setTimeout` or its equivalent in your environment.
    */
   scheduleTimeout: setTimeout,
+  /**
+   * #### `cancelTimeout(id)`
+   *
+   * You can proxy this to `clearTimeout` or its equivalent in your environment.
+   */
   cancelTimeout: clearTimeout,
   /**
+   * #### `noTimeout`
+   *
    * This is a property (not a function) that should be set to something that can never be a valid timeout ID.
    * For example, you can set it to `-1`.
    */
   noTimeout: -1,
   /**
+   * #### `supportsMicrotasks`
+   *
    * Set this to `true` to indicate that your renderer supports `scheduleMicrotask`. We use microtasks as part
    * of our discrete event implementation in React DOM. If you're not sure if your renderer should support this,
    * you probably should. The option to not implement `scheduleMicrotask` exists so that platforms with more control
@@ -327,10 +362,14 @@ var hostConfig = {
    */
   supportsMicrotasks: true,
   /**
+   * #### `scheduleMicrotask(fn)`
+   *
    * Optional. You can proxy this to `queueMicrotask` or its equivalent in your environment.
    */
   scheduleMicrotask: queueMicrotask,
   /**
+   * #### `isPrimaryRenderer`
+   *
    * This is a property (not a function) that should be set to `true` if your renderer is the main one on the
    * page. For example, if you're writing a renderer for the Terminal, it makes sense to set it to `true`, but
    * if your renderer is used *on top of* React DOM or some other existing renderer, set it to `false`.
@@ -340,47 +379,6 @@ var hostConfig = {
    * Whether the renderer shouldn't trigger missing `act()` warnings
    */
   warnsIfNotActing: true,
-  /**
-   * To implement this method, you'll need some constants available on the special `react-reconciler/constants` entry point:
-   *
-   * ```
-   * import {
-   *   DiscreteEventPriority,
-   *   ContinuousEventPriority,
-   *   DefaultEventPriority,
-   * } from 'react-reconciler/constants';
-   *
-   * const HostConfig = {
-   *   // ...
-   *   getCurrentEventPriority() {
-   *     return DefaultEventPriority;
-   *   },
-   *   // ...
-   * }
-   *
-   * const MyRenderer = Reconciler(HostConfig);
-   * ```
-   *
-   * The constant you return depends on which event, if any, is being handled right now. (In the browser, you can
-   * check this using `window.event && window.event.type`).
-   *
-   * - **Discrete events**: If the active event is directly caused by the user (such as mouse and keyboard events)
-   *   and each event in a sequence is intentional (e.g. click), return DiscreteEventPriority. This tells React that
-   *   they should interrupt any background work and cannot be batched across time.
-   *
-   * - **Continuous events**: If the active event is directly caused by the user but the user can't distinguish between
-   *   individual events in a sequence (e.g. mouseover), return ContinuousEventPriority. This tells React they
-   *   should interrupt any background work but can be batched across time.
-   *
-   * - **Other events / No active event**: In all other cases, return DefaultEventPriority. This tells React that
-   *   this event is considered background work, and interactive events will be prioritized over it.
-   *
-   * You can consult the `getCurrentEventPriority()` implementation in `ReactDOMHostConfig.js` for a reference implementation.
-   */
-  // Removed in React 19
-  // getCurrentEventPriority() {
-  //   return DefaultEventPriority;
-  // },
   getInstanceFromNode(node) {
     const instance = nodeToInstanceMap.get(node);
     if (instance !== void 0) {
@@ -402,6 +400,8 @@ var hostConfig = {
   detachDeletedInstance(_node) {
   },
   /**
+   * #### `appendChild(parentInstance, child)`
+   *
    * This method should mutate the `parentInstance` and add the child to its list of children. For example,
    * in the DOM this would translate to a `parentInstance.appendChild(child)` call.
    *
@@ -410,12 +410,16 @@ var hostConfig = {
    */
   appendChild,
   /**
+   * #### `appendChildToContainer(container, child)`
+   *
    * Same as `appendChild`, but for when a node is attached to the root container. This is useful if attaching
    * to the root has a slightly different implementation, or if the root container nodes are of a different
    * type than the rest of the tree.
    */
   appendChildToContainer: appendChild,
   /**
+   * #### `insertBefore(parentInstance, child, beforeChild)`
+   *
    * This method should mutate the `parentInstance` and place the `child` before `beforeChild` in the list of
    * its children. For example, in the DOM this would translate to a `parentInstance.insertBefore(child, beforeChild)` call.
    *
@@ -424,12 +428,16 @@ var hostConfig = {
    */
   insertBefore,
   /**
+   * #### `insertInContainerBefore(container, child, beforeChild)
+   *
    * Same as `insertBefore`, but for when a node is attached to the root container. This is useful if attaching
    * to the root has a slightly different implementation, or if the root container nodes are of a different type
    * than the rest of the tree.
    */
   insertInContainerBefore: insertBefore,
   /**
+   * #### `removeChild(parentInstance, child)`
+   *
    * This method should mutate the `parentInstance` to remove the `child` from the list of its children.
    *
    * React will only call it for the top-level node that is being removed. It is expected that garbage collection
@@ -437,12 +445,16 @@ var hostConfig = {
    */
   removeChild,
   /**
+   * #### `removeChildFromContainer(container, child)`
+   *
    * Same as `removeChild`, but for when a node is detached from the root container. This is useful if attaching
    * to the root has a slightly different implementation, or if the root container nodes are of a different type
    * than the rest of the tree.
    */
   removeChildFromContainer: removeChild,
   /**
+   * #### `resetTextContent(instance)`
+   *
    * If you returned `true` from `shouldSetTextContent` for the previous props, but returned `false` from
    * `shouldSetTextContent` for the next props, React will call this method so that you can clear the text
    * content you were managing manually. For example, in the DOM you could set `node.textContent = ''`.
@@ -452,6 +464,8 @@ var hostConfig = {
   resetTextContent(_instance) {
   },
   /**
+   * #### `commitTextUpdate(textInstance, prevText, nextText)`
+   *
    * This method should mutate the `textInstance` and update its text content to `nextText`.
    *
    * Here, `textInstance` is a node created by `createTextInstance`.
@@ -460,6 +474,8 @@ var hostConfig = {
     textInstance.text = newText;
   },
   /**
+   * #### `commitMount(instance, type, props, internalHandle)`
+   *
    * This method is only called if you returned `true` from `finalizeInitialChildren` for this instance.
    *
    * It lets you do some additional work after the node is actually attached to the tree on the screen for
@@ -479,6 +495,8 @@ var hostConfig = {
   commitMount(_instance, _type, _props, _internalHandle) {
   },
   /**
+   * #### `commitUpdate(instance, type, prevProps, nextProps, internalHandle)`
+   *
    * This method should mutate the `instance` according to the set of changes in `updatePayload`. Here, `updatePayload`
    *  is the object that you've returned from `prepareUpdate` and has an arbitrary structure that makes sense for your
    * renderer. For example, the DOM renderer returns an update payload like `[prop1, value1, prop2, value2, ...]` from
@@ -489,12 +507,15 @@ var hostConfig = {
    *  be aware that it may change significantly between versions. You're taking on additional maintenance risk by
    * reading from it, and giving up all guarantees if you write something to it.
    */
-  commitUpdate(instance, _updatePayload, type, _prevProps, nextProps, internalHandle) {
+  // @ts-expect-error types are not updated
+  commitUpdate(instance, type, _prevProps, nextProps, internalHandle) {
     instance.type = type;
     instance.props = nextProps;
     instance.internalHandle = internalHandle;
   },
   /**
+   * #### `hideInstance(instance)`
+   *
    * This method should make the `instance` invisible without removing it from the tree. For example, it can apply
    * visual styling to hide it. It is used by Suspense to hide the tree while the fallback is visible.
    */
@@ -502,24 +523,32 @@ var hostConfig = {
     instance.isHidden = true;
   },
   /**
+   * #### `hideTextInstance(textInstance)`
+   *
    * Same as `hideInstance`, but for nodes created by `createTextInstance`.
    */
   hideTextInstance(textInstance) {
     textInstance.isHidden = true;
   },
   /**
+   * #### `unhideInstance(instance, props)`
+   *
    * This method should make the `instance` visible, undoing what `hideInstance` did.
    */
   unhideInstance(instance, _props) {
     instance.isHidden = false;
   },
   /**
+   * #### `unhideTextInstance(textInstance, text)`
+   *
    * Same as `unhideInstance`, but for nodes created by `createTextInstance`.
    */
   unhideTextInstance(textInstance, _text) {
     textInstance.isHidden = false;
   },
   /**
+   * #### `clearContainer(container)`
+   *
    * This method should mutate the `container` root node and remove all children from it.
    */
   clearContainer(container) {
@@ -528,62 +557,68 @@ var hostConfig = {
     });
     container.children.splice(0);
   },
-  // -------------------
-  // Hydration Methods
-  //    (optional)
-  // You can optionally implement hydration to "attach" to the existing tree during the initial render instead
-  // of creating it from scratch. For example, the DOM renderer uses this to attach to an HTML markup.
-  //
-  // To support hydration, you need to declare `supportsHydration: true` and then implement the methods in
-  // the "Hydration" section [listed in this file](https://github.com/facebook/react/blob/master/packages/react-reconciler/src/forks/ReactFiberHostConfig.custom.js).
-  // File an issue if you need help.
-  // -------------------
-  supportsHydration: false,
-  // React 19
-  // @ts-expect-error missing types
-  setCurrentUpdatePriority(newPriority) {
-    currentUpdatePriority = newPriority;
-  },
-  getCurrentUpdatePriority() {
-    return currentUpdatePriority;
-  },
-  resolveUpdatePriority() {
-    return currentUpdatePriority || import_constants.DefaultEventPriority;
-  },
-  shouldAttemptEagerTransition() {
-    return false;
-  },
-  // #### `maySuspendCommit(type, props)`
-  // This method is called during render to determine if the Host Component type and props require
-  // some kind of loading process to complete before committing an update.
-  maySuspendCommit() {
+  /**
+   * #### `maySuspendCommit(type, props)`
+   *
+   * This method is called during render to determine if the Host Component type and props require
+   * some kind of loading process to complete before committing an update.
+   */
+  maySuspendCommit(_type, _props) {
     return false;
   },
-  // #### `preloadInstance(type, props)`
-  // This method may be called during render if the Host Component type and props might suspend a commit.
-  // It can be used to initiate any work that might shorten the duration of a suspended commit.
-  preloadInstance() {
+  /**
+   * #### `preloadInstance(type, props)`
+   *
+   * This method may be called during render if the Host Component type and props might suspend a commit.
+   * It can be used to initiate any work that might shorten the duration of a suspended commit.
+   */
+  preloadInstance(_type, _props) {
     return true;
   },
-  // #### `startSuspendingCommit()`
-  // This method is called just before the commit phase. Use it to set up any necessary state while any Host
-  // Components that might suspend this commit are evaluated to determine if the commit must be suspended.
+  /**
+   * #### `startSuspendingCommit()`
+   *
+   * This method is called just before the commit phase. Use it to set up any necessary state while any Host
+   * Components that might suspend this commit are evaluated to determine if the commit must be suspended.
+   */
   startSuspendingCommit() {
   },
-  // #### `suspendInstance(type, props)`
-  // This method is called after `startSuspendingCommit` for each Host Component that indicated it might
-  // suspend a commit.
+  /**
+   * #### `suspendInstance(type, props)`
+   *
+   * This method is called after `startSuspendingCommit` for each Host Component that indicated it might
+   * suspend a commit.
+   */
   suspendInstance() {
   },
-  // #### `waitForCommitToBeReady()`
-  // This method is called after all `suspendInstance` calls are complete.
+  /**
+   * #### `waitForCommitToBeReady()`
+   *
+   * This method is called after all `suspendInstance` calls are complete.
+   *
+   * Return `null` if the commit can happen immediately.
+   * Return `(initiateCommit: Function) => Function` if the commit must be suspended. The argument to this
+   * callback will initiate the commit when called. The return value is a cancellation function that the
+   * Reconciler can use to abort the commit.
+   */
   waitForCommitToBeReady() {
     return null;
   },
+  // -------------------
+  // Hydration Methods
+  //    (optional)
+  // You can optionally implement hydration to "attach" to the existing tree during the initial render instead
+  // of creating it from scratch. For example, the DOM renderer uses this to attach to an HTML markup.
+  //
+  // To support hydration, you need to declare `supportsHydration: true` and then implement the methods in
+  // the "Hydration" section [listed in this file](https://github.com/facebook/react/blob/master/packages/react-reconciler/src/forks/ReactFiberHostConfig.custom.js).
+  // File an issue if you need help.
+  // -------------------
+  supportsHydration: false,
   NotPendingTransition: null,
-  resetFormInstance() {
+  resetFormInstance(_form) {
   },
-  requestPostPaintCallback() {
+  requestPostPaintCallback(_callback) {
   }
 };
 var TestReconciler = (0, import_react_reconciler.default)(hostConfig);
@@ -743,14 +778,16 @@ var HostElement = class _HostElement {
 
 // src/renderer.ts
 var import_constants4 = require("react-reconciler/constants");
-function createRenderer(options) {
+function createRoot(options) {
   var _a;
   let container = {
     tag: "CONTAINER",
     children: [],
     parent: null,
-    textComponents: options == null ? void 0 : options.textComponents,
-    createNodeMock: (_a = options == null ? void 0 : options.createNodeMock) != null ? _a : () => ({})
+    config: {
+      textComponents: options == null ? void 0 : options.textComponents,
+      createNodeMock: (_a = options == null ? void 0 : options.createNodeMock) != null ? _a : () => ({})
+    }
   };
   let containerFiber = TestReconciler.createContainer(
     container,
@@ -814,6 +851,6 @@ function createRenderer(options) {
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   CONTAINER_TYPE,
-  createRenderer
+  createRoot
 });
 //# sourceMappingURL=index.cjs.map