chore: update with 19 stable

Author: CodyJasonBennett

.github/workflows/CI.yml

@@ -6,7 +6,7 @@ on:
     branches: [master]
 
 jobs:
-  build-test-lint:
+  build-lint-test:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v2
@@ -22,4 +22,4 @@ jobs:
         run: yarn lint
 
       - name: Run tests
-        run: yarn test --silent
+        run: yarn test

README.md

@@ -42,11 +42,19 @@ We can take this further by rendering made-up elements that get returned as a re
 
 You can take a snapshot for testing via `React.act` which will wait for effects and suspense to finish.
 
-```jsx
+```tsx
 import { useState, useEffect, act } from 'react'
 import { render } from 'react-nil'
 
-function Test(props) {
+declare module 'react' {
+  namespace JSX {
+    interface IntrinsicElements {
+      timestamp: Record<string, unknown>
+    }
+  }
+}
+
+function Test() {
   const [value, setValue] = useState(-1)
   useEffect(() => setValue(Date.now()), [])
   return <timestamp value={value} />

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-nil",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "A react custom renderer that renders nothing but logical components",
   "keywords": [
     "react",
@@ -38,27 +38,19 @@
   },
   "sideEffects": false,
   "devDependencies": {
-    "@types/node": "^20.12.12",
-    "@types/react": "npm:types-react@beta",
-    "@vitejs/plugin-react": "^4.2.1",
-    "react": "19.0.0-rc-915b914b3a-20240515",
-    "suspend-react": "^0.1.3",
-    "typescript": "^5.4.5",
-    "vite": "^5.2.11",
-    "vitest": "^1.6.0"
+    "@types/node": "^22.10.6",
+    "@types/react": "^19.0.0",
+    "react": "^19.0.0",
+    "typescript": "^5.7.3",
+    "vite": "^6.0.7",
+    "vitest": "^2.1.8"
   },
   "dependencies": {
-    "@types/react-reconciler": "^0.28.8",
-    "react-reconciler": "0.31.0-rc-915b914b3a-20240515"
+    "@types/react-reconciler": "^0.28.9",
+    "react-reconciler": "^0.31.0"
   },
   "peerDependencies": {
-    "react": ">=19.0"
-  },
-  "overrides": {
-    "@types/react": "npm:types-react@beta"
-  },
-  "resolutions": {
-    "@types/react": "npm:types-react@beta"
+    "react": "^19.0.0"
   },
   "scripts": {
     "build": "vite build",

src/index.test.tsx

@@ -1,25 +1,12 @@
 import * as React from 'react'
-import { suspend } from 'suspend-react'
-import { vi, it, expect } from 'vitest'
-import { render, createPortal, type HostContainer } from './index.js'
-import type {} from 'react'
-import type {} from 'react/jsx-runtime'
-import type {} from 'react/jsx-dev-runtime'
-
-// Elevate React warnings
-console.warn = console.error = (message: string) => {
-  throw new Error(message)
-}
+import { it, expect } from 'vitest'
+import { render, createPortal, type HostContainer } from './index'
 
+// Let React know that we'll be testing effectful components
 declare global {
   var IS_REACT_ACT_ENVIRONMENT: boolean
 }
-
-// Let React know that we'll be testing effectful components
-global.IS_REACT_ACT_ENVIRONMENT = true
-
-// Mock scheduler to test React features
-vi.mock('scheduler', () => require('scheduler/unstable_mock'))
+globalThis.IS_REACT_ACT_ENVIRONMENT = true
 
 interface ReactProps<T> {
   key?: React.Key
@@ -35,31 +22,12 @@ declare module 'react' {
   }
 }
 
-declare module 'react/jsx-runtime' {
-  namespace JSX {
-    interface IntrinsicElements {
-      element: ReactProps<null> & Record<string, unknown>
-    }
-  }
-}
-
-declare module 'react/jsx-dev-runtime' {
-  namespace JSX {
-    interface IntrinsicElements {
-      element: ReactProps<null> & Record<string, unknown>
-    }
-  }
-}
-
 it('should go through lifecycle', async () => {
   const lifecycle: string[] = []
 
   function Test() {
     lifecycle.push('render')
-    React.useImperativeHandle(React.useRef(null), () => {
-      lifecycle.push('ref')
-      return null
-    })
+    React.useImperativeHandle(React.useRef(undefined), () => void lifecycle.push('ref'))
     React.useInsertionEffect(() => void lifecycle.push('useInsertionEffect'), [])
     React.useLayoutEffect(() => void lifecycle.push('useLayoutEffect'), [])
     React.useEffect(() => void lifecycle.push('useEffect'), [])
@@ -109,7 +77,8 @@ it('should render JSX', async () => {
   expect(container.head).toBe(null)
 
   // Suspense
-  const Test = () => (suspend(async () => null, []), (<element bar />))
+  const promise = Promise.resolve(null)
+  const Test = () => (React.use(promise), (<element bar />))
   await React.act(async () => (container = render(<Test />)))
   expect(container.head).toStrictEqual({ type: 'element', props: { bar: true }, children: [] })
 
@@ -140,7 +109,8 @@ it('should render text', async () => {
   expect(container.head).toBe(null)
 
   // Suspense
-  const Test = () => (suspend(async () => null, []), (<>three</>))
+  const promise = Promise.resolve(null)
+  const Test = () => (React.use(promise), (<>three</>))
   await React.act(async () => (container = render(<Test />)))
   expect(container.head).toStrictEqual({ type: 'text', props: { value: 'three' }, children: [] })
 

src/index.tsx

@@ -1,12 +1,21 @@
-import { version, type ReactNode, type JSX } from 'react'
+import * as React from 'react'
 import Reconciler from 'react-reconciler'
-import { NoEventPriority, DefaultEventPriority, ConcurrentRoot } from 'react-reconciler/constants.js'
+import {
+  // NoEventPriority,
+  ContinuousEventPriority,
+  DiscreteEventPriority,
+  DefaultEventPriority,
+  ConcurrentRoot,
+} from 'react-reconciler/constants.js'
+
+// @ts-ignore
+const __DEV__ = /* @__PURE__ */ (() => typeof process !== 'undefined' && process.env.NODE_ENV !== 'production')()
 
 // TODO: upstream to DefinitelyTyped for React 19
 // https://github.com/facebook/react/issues/28956
 type EventPriority = number
 
-const createReconciler = Reconciler as unknown as <
+function createReconciler<
   Type,
   Props,
   Container,
@@ -56,6 +65,7 @@ const createReconciler = Reconciler as unknown as <
     // Undocumented
     // https://github.com/facebook/react/pull/26722
     NotPendingTransition: TransitionStatus | null
+    HostTransitionContext: React.Context<TransitionStatus>
     // https://github.com/facebook/react/pull/28751
     setCurrentUpdatePriority(newPriority: EventPriority): void
     getCurrentUpdatePriority(): EventPriority
@@ -66,6 +76,11 @@ const createReconciler = Reconciler as unknown as <
     requestPostPaintCallback(callback: (time: number) => void): void
     // https://github.com/facebook/react/pull/26025
     shouldAttemptEagerTransition(): boolean
+    // https://github.com/facebook/react/pull/31528
+    trackSchedulerEvent(): void
+    // https://github.com/facebook/react/pull/31008
+    resolveEventType(): null | string
+    resolveEventTimeStamp(): number
 
     /**
      * 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.
@@ -93,12 +108,20 @@ const createReconciler = Reconciler as unknown as <
      */
     waitForCommitToBeReady(): ((initiateCommit: Function) => Function) | null
   },
-) => Reconciler.Reconciler<Container, Instance, TextInstance, SuspenseInstance, PublicInstance>
+): Reconciler.Reconciler<Container, Instance, TextInstance, SuspenseInstance, PublicInstance> {
+  const reconciler = Reconciler(config as any)
+
+  reconciler.injectIntoDevTools({
+    bundleType: __DEV__ ? 1 : 0,
+    rendererPackageName: 'react-nil',
+    version: React.version,
+  })
 
-declare module 'react-reconciler/constants.js' {
-  const NoEventPriority = 0
+  return reconciler as any
 }
 
+const NoEventPriority = 0
+
 export interface NilNode<P = Record<string, unknown>> {
   type: string
   props: P
@@ -117,8 +140,8 @@ interface HostConfig {
   textInstance: NilNode
   suspenseInstance: NilNode
   hydratableInstance: never
-  formInstance: never
   publicInstance: null
+  formInstance: never
   hostContext: {}
   childSet: never
   timeoutHandle: number
@@ -142,7 +165,7 @@ const NO_CONTEXT: HostConfig['hostContext'] = {}
 
 let currentUpdatePriority: number = NoEventPriority
 
-const reconciler = createReconciler<
+const reconciler = /* @__PURE__ */ createReconciler<
   HostConfig['type'],
   HostConfig['props'],
   HostConfig['container'],
@@ -159,6 +182,7 @@ const reconciler = createReconciler<
   HostConfig['TransitionStatus']
 >({
   isPrimaryRenderer: false,
+  warnsIfNotActing: false,
   supportsMutation: true,
   supportsPersistence: false,
   supportsHydration: false,
@@ -182,70 +206,104 @@ const reconciler = createReconciler<
   getChildHostContext: () => NO_CONTEXT,
   shouldSetTextContent: () => false,
   finalizeInitialChildren: () => false,
-  commitUpdate: (instance, _, __, props) => (instance.props = getInstanceProps(props)),
+  commitUpdate: (instance, _type, _prevProps, nextProps) => (instance.props = getInstanceProps(nextProps)),
   commitTextUpdate: (instance, _, value) => (instance.props.value = value),
   prepareForCommit: () => null,
   resetAfterCommit() {},
   preparePortalMount() {},
   clearContainer: (container) => (container.head = null),
-  warnsIfNotActing: false,
   getInstanceFromNode: () => null,
   beforeActiveInstanceBlur() {},
   afterActiveInstanceBlur() {},
   detachDeletedInstance() {},
   prepareScopeUpdate() {},
   getInstanceFromScope: () => null,
-  setCurrentUpdatePriority(newPriority) {
+  shouldAttemptEagerTransition: () => false,
+  trackSchedulerEvent: () => {},
+  resolveEventType: () => null,
+  resolveEventTimeStamp: () => -1.1,
+  requestPostPaintCallback() {},
+  maySuspendCommit: () => false,
+  preloadInstance: () => true, // true indicates already loaded
+  startSuspendingCommit() {},
+  suspendInstance() {},
+  waitForCommitToBeReady: () => null,
+  NotPendingTransition: null,
+  HostTransitionContext: /* @__PURE__ */ React.createContext<HostConfig['TransitionStatus']>(null),
+  setCurrentUpdatePriority(newPriority: number) {
     currentUpdatePriority = newPriority
   },
   getCurrentUpdatePriority() {
     return currentUpdatePriority
   },
   resolveUpdatePriority() {
-    return currentUpdatePriority || DefaultEventPriority
-  },
-  shouldAttemptEagerTransition() {
-    return false
-  },
-  requestPostPaintCallback() {},
-  maySuspendCommit() {
-    return false
-  },
-  preloadInstance() {
-    return true // true indicates already loaded
-  },
-  startSuspendingCommit() {},
-  suspendInstance() {},
-  waitForCommitToBeReady() {
-    return null
+    if (currentUpdatePriority !== NoEventPriority) return currentUpdatePriority
+
+    switch (typeof window !== 'undefined' && window.event?.type) {
+      case 'click':
+      case 'contextmenu':
+      case 'dblclick':
+      case 'pointercancel':
+      case 'pointerdown':
+      case 'pointerup':
+        return DiscreteEventPriority
+      case 'pointermove':
+      case 'pointerout':
+      case 'pointerover':
+      case 'pointerenter':
+      case 'pointerleave':
+      case 'wheel':
+        return ContinuousEventPriority
+      default:
+        return DefaultEventPriority
+    }
   },
-  NotPendingTransition: null,
   resetFormInstance() {},
 })
 
-// Inject renderer meta into devtools
-const isProd = typeof process === 'undefined' || process.env?.['NODE_ENV'] === 'production'
-reconciler.injectIntoDevTools({
-  findFiberByHostInstance: () => null,
-  bundleType: isProd ? 0 : 1,
-  version,
-  rendererPackageName: 'react-nil',
-})
+/**
+ * Force React to flush any updates inside the provided callback synchronously and immediately.
+ */
+export function flushSync<R>(fn: () => R): R {
+  return reconciler.flushSync(fn)
+}
+
+// Report when an error was detected in a previous render
+// https://github.com/facebook/react/pull/23207
+const logRecoverableError = /* @__PURE__ */ (() =>
+  typeof reportError === 'function'
+    ? // In modern browsers, reportError will dispatch an error event,
+      // emulating an uncaught JavaScript error.
+      reportError
+    : // In older browsers and test environments, fallback to console.error.
+      console.error)()
 
 const container: HostContainer = { head: null }
-const root = reconciler.createContainer(container, ConcurrentRoot, null, false, null, '', console.error, null)
+const root = /* @__PURE__ */ (reconciler as any).createContainer(
+  container, // containerInfo
+  ConcurrentRoot, // tag
+  null, // hydrationCallbacks
+  false, // isStrictMode
+  null, // concurrentUpdatesByDefaultOverride
+  '', // identifierPrefix
+  logRecoverableError, // onUncaughtError
+  logRecoverableError, // onCaughtError
+  logRecoverableError, // onRecoverableError
+  null, // transitionCallbacks
+)
 
 /**
  * Renders a React element into a `null` root.
  */
-export function render(element: ReactNode): HostContainer {
+export function render(element: React.ReactNode): HostContainer {
   reconciler.updateContainer(element, root, null, undefined)
   return container
 }
 
 /**
  * Renders a React element into a foreign {@link HostContainer}.
  */
-export function createPortal(element: ReactNode, container: HostContainer): JSX.Element {
+export function createPortal(element: React.ReactNode, container: HostContainer): React.JSX.Element {
+  // @ts-expect-error
   return <>{reconciler.createPortal(element, container, null, null)}</>
 }