"Warning: useLayoutEffect does nothing on the server" appeared since updating to @latest version.

*If reverting @apollo/client to @3.3.14, warning disappears I’m extensively using the getStaticProps method by nextJS in my application and everything was running smoothly, but once I did an update of all the packages, I started seeing this annoying warning. I reverted to a previous commit and updated packages one by one, thinking it was a material-ui problem. But the warning appeared only after updating @apollo/client.

Intended outcome: Updating packages, from 3.3.14 to @3.3.16.

Actual outcome: This is the warning I started getting after the update:

And I noticed mismatches started appearing in the console. This is a rehydration problem probably, but it wasn’t there before updating… example mismatch:

My package.json file:

My Apollo Initialization (from zeit/nextjs apollo example) (The APOLLO_STATE_PROP_NAME variable is just a string = “APOLLO_STATE”):

Versions Run the following command in your project directory, and paste its (automatically copied to clipboard) results here:

npx envinfo@latest --preset apollo --clipboard:

All the additional packages are not used, I’m only using @apollo/client at the moment.

[benjamn]

@zakariamofaddel Thanks for reporting this! Assigning to @brainkim since this looks like a consequence of #8022.

[brainkim]

@zakariamofaddel I’m doing some testing and it feels as though the only reason the new useLayoutEffect()-backed useReactiveVar() might be causing client/server mismatches is because you’re calling the reactive var during rendering, which is a React no-no. Of course, I could be wrong about this, but that means that even if we squelch the useLayoutEffect warnings, you might continue to have client/server mismatch errors. We’ll try to have a fix which squashes the warnings soon, but in the meantime, 1. can you make sure you’re not calling reactive variables in the render function? and 2. can you create a small reproduction for the client/server mismatch if this isn’t the case?