fix(thenable): use Object.create() to avoid Promise mutation in headless Chromium

.changeset/fix-promise-mutation-10509.md

@@ -0,0 +1,7 @@
+---
+"@tanstack/query-core": patch
+---
+
+fix(thenable): use Object.create() to avoid Promise mutation in headless Chromium
+
+Resolves issue where useQuery stays pending indefinitely in Puppeteer/Playwright. Headless Chromium enforces stricter Promise semantics, treating internal slots as sealed. The fix wraps the Promise with Object.create() instead of mutating it directly, preserving all Promise behavior while allowing custom properties.

packages/query-core/src/thenable.ts

@@ -45,16 +45,27 @@ export function pendingThenable<T>(): PendingThenable<T> {
   let resolve: Pending<T>['resolve']
   let reject: Pending<T>['reject']
   // this could use `Promise.withResolvers()` in the future
-  const thenable = new Promise((_resolve, _reject) => {
+  const promise = new Promise((_resolve, _reject) => {
     resolve = _resolve
     reject = _reject
-  }) as PendingThenable<T>
+  })
 
-  thenable.status = 'pending'
-  thenable.catch(() => {
+  promise.catch(() => {
     // prevent unhandled rejection errors
   })
 
+  const thenable = Object.create(promise) as PendingThenable<T>
+  thenable.status = 'pending'
+
+  // Bind Promise methods so React's Suspense and other code calling .then()
+  // works correctly. Without binding, the native Promise implementation checks
+  // for internal slots on `this`, which won't exist on the wrapper object.
+  thenable.then = promise.then.bind(promise)
+  thenable.catch = promise.catch.bind(promise)
+  if (promise.finally) {
+    thenable.finally = promise.finally.bind(promise)
+  }
+
   function finalize(data: Fulfilled<T> | Rejected) {
     Object.assign(thenable, data)