reduxjs/react-redux · error
You must pass a valid React context consumer as `props.conte
Error message
You must pass a valid React context consumer as `props.context`
What it means
When connect is given props.context, that value must be a React context object created by React.createContext — connect verifies it renders a valid context Consumer. Any other value (undefined, plain object, string) throws this error.
Source
Thrown at src/components/connect.tsx:735
// Distinguish between actual "data" props that were passed to the wrapper component,
// and values needed to control behavior (forwarded refs, alternate context instances).
// To maintain the wrapperProps object reference, memoize this destructuring.
const { reactReduxForwardedRef, ...wrapperProps } = props
return [props.context, reactReduxForwardedRef, wrapperProps]
}, [props])
const ContextToUse: ReactReduxContextInstance = React.useMemo(() => {
// Users may optionally pass in a custom context instance to use instead of our ReactReduxContext.
// Memoize the check that determines which context instance we should use.
let ResultContext = Context
if (propsContext?.Consumer) {
if (process.env.NODE_ENV !== 'production') {
const isValid = /*#__PURE__*/ isContextConsumer(
// @ts-ignore
<propsContext.Consumer />,
)
if (!isValid) {
throw new Error(
'You must pass a valid React context consumer as `props.context`',
)
}
ResultContext = propsContext
}
}
return ResultContext
}, [propsContext, Context])
// Retrieve the store and ancestor subscription via context, if available
const contextValue = React.useContext(ContextToUse)
// The store _must_ exist as either a prop or in context.
// We'll check to see if it _looks_ like a Redux store first.
// This allows us to pass through a `store` prop that is just a plain value.
const didStoreComeFromProps =
Boolean(props.store) &&
Boolean(props.store!.getState) &&View on GitHub (pinned to 16f1a91eb2)
Solutions
- Create the context with React.createContext and pass the context object: <Connected context={MyContext} />
- Do not pass MyContext.Consumer or MyContext.Provider
- Fix duplicate React installations (npm ls react) so isContextConsumer recognizes the context
- If you don't need a custom context, omit the context prop entirely
Example fix
// before
<Connected context={MyContext.Consumer} />
// after
<Connected context={MyContext} /> Defensive patterns
Strategy: validation
Validate before calling
import React from 'react'
const MyContext = React.createContext<Store | null>(null)
// before passing:
if (!MyContext || !(MyContext as any).$$typeof) {
throw new TypeError('props.context must be a React.createContext() result')
} Type guard
function isReactContext(v: unknown): v is React.Context<unknown> {
return !!v && typeof v === 'object' && (v as any).Provider !== undefined && (v as any).Consumer !== undefined;
} Try / catch
try {
render(<Connected context={MyContext} />)
} catch (e) {
if (e.message.includes('valid React context consumer')) {
console.error('Pass the context object itself, not .Consumer/.Provider')
}
throw e
} Prevention
- Always pass the object returned by React.createContext, never .Consumer or .Provider
- Deduplicate React in monorepos so context objects share one React copy
- Only set the context prop when you intentionally use multiple stores; otherwise omit it
When it happens
Trigger: Passing an arbitrary object as the context prop to a connected component, passing the context's Consumer instead of the context object itself, or passing a context created by a different React copy.
Common situations: Multiple React copies in a monorepo (context instanceof check / isContextConsumer fails), typos like context={MyContext.Consumer}, or passing an undefined context prop that the code then forwards.
Related errors
- You must pass a component to the function returned by connec
- Invalid value of type ${typeof arg} for ${name} argument whe
- Unexpected value for ${methodName} in connect.
- could not find react-redux context value; please ensure the
- You must pass a selector to useSelector
AI-assisted analysis of reduxjs/react-redux@16f1a91eb2 (2026-08-31).
Data as JSON: /api/errors/d1356b6f854eb651.
Report an issue: GitHub.