Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

8.1.0 Context.Consumer value is undefined

See original GitHub issue

Bug report

Describe the bug

In Next.js 8.1.0 React Context.Consumer receives value of undefined

Only on server side

UPDATE: Only in production, not in npm run dev

To Reproduce

Reproduce repository - link

const MyContext = React.createContext();

function Home() {

    return <MyContext.Provider value={{ x: "123" }}>
        <MyContext.Consumer>
            {value => value.x}
        </MyContext.Consumer>
    </MyContext.Provider>
}

export default Home;

Expected behavior

MyContext.Consumer value should receive object from MyContext.Provider

System information

Version of Next.js: 8.1.0

Additional context

Also an issue for many Antd components

Issue Analytics

State:
Created 4 years ago
Reactions:12
Comments:8 (6 by maintainers)

Top GitHub Comments

5reactions

oliviertassinaricommented, Apr 27, 2019

Same issue with Material-UI: https://github.com/mui-org/material-ui/issues/15505. The problems seem to be coming from: https://github.com/zeit/next.js/compare/v8.0.5-canary.10..v8.0.5-canary.11.

2reactions

ThomasK33commented, Apr 29, 2019

Same issue occurs using rbx with 8.1.0.

Downgrading to 8.0.4 helped, as the production build and serving do not throw the described error.

Top Results From Across the Web

Context API Consumer value is undefined - Stack Overflow

Context API Consumer value is undefined · Probably in component C the Context is not imported correctly. · Actually is does imported correctly....

cannot read properties of undefined (reading 'context')

There are 3 main reasons the "Cannot read properties of undefined" error occurs: Accessing a property on a variable that stores an undefined...

Typing React Context to avoid an undefined default value

The main problem caused by this approach is we will have to check for undefined every time we will try to consume our...

Firebase JavaScript SDK Release Notes - Google

Fixed an issue in @firebase/auth-compat where the SDK tried to access fields from a undefined variable. Version 9.1.1 - September 30, 2021. Authentication....

useContext - React Docs

My component doesn't see the value from my provider; I am always getting undefined from my context although the default value is different ......