Skip to content

useQuery from @sanity/react-loader throws TypeError with React 19, Next.js 16.0.0 (Pages Router): "Cannot read properties of undefined (reading 'push')" #3285

@Aleksandr-Tyagun

Description

@Aleksandr-Tyagun

Description

When using useQuery from @sanity/react-loader v1.11.22 with React 19.2.0 and Next.js 16.0.0, a runtime TypeError is thrown during the effect subscription phase. The error occurs in the internal store listener setup, where it attempts to call .push() on an undefined object.

To Reproduce

Prerequisites

  • Next.js 16.0.0 (Pages Router)
  • React 19.2.0
  • React DOM 19.2.0
  • @sanity/react-loader 1.11.22
  • @sanity/core-loader 1.8.21

Steps to reproduce:

  1. Create a Next.js page component using the Pages Router with getStaticProps
  2. Import and use useQuery from @sanity/react-loader:
import { useQuery } from '@sanity/react-loader';
import { loadQuery } from '@/sanity/ssr';

const MainPage = ({ initial }) => {
  const pageQuery = `*[_id == $id][0]`;
  const queryParams = { id: 'some-id' };

  const { data: pageData } = useQuery(pageQuery, queryParams, { initial });

  return <div>{/* render content */}</div>;
};

export const getStaticProps = async () => {
  const initial = await loadQuery(pageQuery, queryParams, { perspective: 'published' });

  return {
    props: { initial },
    revalidate: 10,
  };
};
  1. Start the Next.js development server with npm run dev
  2. Navigate to http://localhost:3000 in Chrome
  3. Open Chrome DevTools Console
  4. Observe the error

Expected Behavior

The useQuery hook should successfully subscribe to the Sanity store and return the initial data without throwing any errors. The page should render normally with the data provided from getStaticProps.

Actual Behavior

A TypeError is thrown immediately when the component mounts:

TypeError: Cannot read properties of undefined (reading 'push')
    at originListen (node_modules_e644bd57._.js:3412:43)
    at object.events.<computed>.reduceRight.shared (node_modules_e644bd57._.js:3403:58)
    at Array.reduceRight (<anonymous>)
    at node_modules_e644bd57._.js:3403:33
    at $store.listen (node_modules_e644bd57._.js:3415:90)
    at Object.subscribe (node_modules_e644bd57._.js:3392:32)
    at defineUseQuery.useEffect (node_modules_e644bd57._.js:3954:90)

The error originates from within the useEffect hook in the useQuery implementation when it attempts to subscribe to the store. The full stack trace shows it occurs during React's passive effect mount phase (commitPassiveMountOnFiber).

Screenshot

Image

The Next.js development overlay displays:

  • Runtime TypeError
  • Cannot read properties of undefined (reading 'push')
  • Call Stack with 50 frames

Environment

Sanity Versions

@sanity/core-loader          1.8.21 (up to date)
@sanity/react-loader        1.11.22 (up to date)
sanity                       4.11.0 (up to date)

Operating System

macOS 15.0.0 (darwin 25.0.0)

Node.js / npm Versions

npm: 10.9.3
node: v22.20.0

Key Dependencies

{
  "next": "16.0.0",
  "react": "19.2.0",
  "react-dom": "19.2.0",
  "@sanity/react-loader": "^1.11.22",
  "@sanity/core-loader": "^1.8.21",
  "next-sanity": "^11.5.6"
}

Metadata

Metadata

Assignees

Labels

bugSomething isn't working

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions