facebook/react · error · Error

438

438

Error message

An unsupported type was passed to use(): 

What it means

use() accepts exactly three kinds of values: a thenable (Promise), a React Context (REACT_CONTEXT_TYPE), or a recoverable error value (REACT_RECOVERABLE_TYPE). Anything else — primitives, plain objects, undefined — falls through the checks and throws this error, with the offending value stringified into the message.

Source

Thrown at packages/react-reconciler/src/ReactFiberHooks.js:1178

  // $FlowFixMe[invalid-compare]
  if (usable !== null && typeof usable === 'object') {
    // $FlowFixMe[method-unbinding]
    if (typeof usable.then === 'function') {
      // This is a thenable.
      const thenable: Thenable<T> = usable as any;
      return useThenable(thenable);
    } else if (usable.$$typeof === REACT_RECOVERABLE_TYPE) {
      // Fiber is the final renderer, so there is no downstream host that
      // needs to recover this subtree. Continue rendering through it.
      return undefined as any;
    } else if (usable.$$typeof === REACT_CONTEXT_TYPE) {
      const context: ReactContext<T> = usable as any;
      return readContext(context);
    }
  }

  // eslint-disable-next-line react-internal/safe-string-coercion
  throw new Error('An unsupported type was passed to use(): ' + String(usable));
}

function useMemoCache(size: number): Array<mixed> {
  let memoCache = null;
  // Fast-path, load memo cache from wip fiber if already prepared
  let updateQueue: FunctionComponentUpdateQueue | null =
    currentlyRenderingFiber.updateQueue as any;
  if (updateQueue !== null) {
    memoCache = updateQueue.memoCache;
  }
  // Otherwise clone from the current fiber
  if (memoCache == null) {
    const current: Fiber | null = currentlyRenderingFiber.alternate;
    if (current !== null) {
      const currentUpdateQueue: FunctionComponentUpdateQueue | null =
        current.updateQueue as any;
      if (currentUpdateQueue !== null) {
        const currentMemoCache: ?MemoCache = currentUpdateQueue.memoCache;

View on GitHub (pinned to eafeac097b)

Solutions

1. Pass the Promise itself (not its resolved value) or the context object created by createContext.
2. Narrow before calling: check `isThenable` (typeof value?.then === 'function') or `$$typeof` for contexts when the value's shape is uncertain.
3. If a mock/polyfill promise fails the thenable check, use a real Promise (Promise.resolve()) in tests.

Example fix

// before
const data = use(fetchData());       // fetchData returns a plain value
const theme = use(ThemeContext.Provider); // provider, not context

// after
const data = use(fetchDataPromise()); // the Promise itself
const theme = use(ThemeContext);       // the context object

// Validate the argument before calling use()
function isThenable(v) {
  return v !== null && typeof v === 'object' && typeof v.then === 'function';
}
const value = isThenable(maybePromise)
  ? use(maybePromise)
  : maybePromise; // already-resolved value or safe default

const REACT_CONTEXT = Symbol.for('react.context');
function isUsable(v) {
  if (v == null) return false;
  if (typeof v === 'object' && typeof v.then === 'function') return true;
  return typeof v === 'object' && v.$$typeof === REACT_CONTEXT;
}

// Wrap risky use() calls during data-layer migrations
try {
  value = use(maybeResource);
} catch (err) {
  if (/unsupported type was passed to use/.test(err.message)) {
    return fallbackValue; // and log the String(usable) the message includes
  }
  throw err;
}

When it happens

Trigger: Calling use() with a non-promise variable (a value that was already awaited, a plain object, a number/boolean/undefined), or a Promise polyfill/mock whose `then` isn't a function so the thenable check misses.

Common situations: Typos like use(promiseResults) instead of the promise itself; passing a context provider instead of the context; libraries handing use() a lookalike thenable; unwrapping optional values (`use(context?.something)`).

Related errors

• 467
• Hooks are not supported inside an async component. This erro
• react-cache: read and preload may only be called from within
• An unsupported type was passed to use(): ${String(usable)}
• Unknown Fiber. Needs to be a function component to inspect h

AI-assisted analysis of facebook/react@eafeac097b (2026-08-21). Data as JSON: /api/errors/6c67aba2eeacff90. Report an issue: GitHub.