Throwing ClientResponseError with Google Auth

[SinaBYR]

I'm trying to authenticate users with their Google accounts. The authentication process is working pretty well. The Google pop up window shows up, and users are able to select their desired google account, and it is also inserting users' info to the "users" table, but the problem is that I'm getting a "ClientResponseError: 0" error thrown in the console. It's not interfering with the authentication process but I have no idea what's up with it.

index.tsx

import { useEffect } from "react"
import PocketBase from "pocketbase"

export default function Page() {
  const pb = new PocketBase('https://url-for-pocketbase.com')
  pb.autoCancellation(false)
  
  useEffect(() => {
    async function signUp() {
      const authData = await pb.collection('users').authWithOAuth2({ provider: 'google' })
      console.log(authData)  // valid google user account information is present
    }

    signUp()
  }, [])


  return (
    <div>
      <h1>Hello</h1>
    </div>
  )
}

package.json

"dependencies": {
    "next": "13.3.0",
    "pocketbase": "^0.15.3",
    "react": "18.2.0",
    "react-dom": "18.2.0",
  },
  "devDependencies": {
    "@types/react": "18.0.35",
    "@types/react-dom": "18.0.11",
    "eslint": "8.38.0",
    "eslint-config-next": "13.3.0",
  }

[ganigeorgiev]

0 status code usually means some client-side error. It could be a result from auto cancellation (this is probably not your case since you have disabled it) or some other JS issue.

To find more details about the error, you can try to wrap the await call with try/catch and inspect the error object (and more specifically, err.originalError).

[SinaBYR]

Thank you for replying!
I did wrap the await call with try/catch as you told me to, and was able to inspect the error object (err.originalError).

{
  name: 'NS_ERROR_ABORT',
  message: '',
  result: 2147500036,
  filename: 'webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs',
  lineNumber: 25,
  columnNumber: 0,
  data: null,
  stack: 
    'f</RecordService.prototype._defaultUrlCallback@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:30107\n' +
    'f</RecordService.prototype.authWithOAuth2/</</</</<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:26607\n' +
    'step@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:2109\n' +
    'verb/<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:2214\n' +
    'fulfilled@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:857\n' +
    'f</RecordService.prototype._defaultUrlCallback@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:30107\n' +
    'f</RecordService.prototype.authWithOAuth2/</</</</<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:26607\n' +
    'step@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:2109\n' +
    'verb/<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:2214\n' +
    'fulfilled@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:857\n' +
    'promise callback*step@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:1052\n' +
    '__awaiter/<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:1081\n' +
    '__awaiter@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:789\n' +
    'f</RecordService.prototype.authWithOAuth2/</</<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:25711\n' +
    'f</RecordService.prototype.authWithOAuth2/</<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:25677\n' +
    'step@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:2109\n' +
    'verb/<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:2214\n' +
    'fulfilled@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:857\n' +
    'promise callback*step@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:1052\n' +
    '__awaiter/<@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:1081\n' +
    '__awaiter@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:789\n' +
    'f</RecordService.prototype.authWithOAuth2@webpack-internal:///./node_modules/pocketbase/dist/pocketbase.es.mjs:25:24738\n' +
    'signUp@webpack-internal:///./pages/pocket/index.tsx:22:63\n' +
    'Page/<@webpack-internal:///./pages/pocket/index.tsx:40:9\n' +
    'commitHookEffectListMount@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:23145:26\n' +
    'commitPassiveMountOnFiber@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:24921:38\n' +
    'commitPassiveMountEffects_complete@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:24886:34\n' +
    'commitPassiveMountEffects_begin@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:24873:41\n' +
    'commitPassiveMountEffects@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:24861:34\n' +
    'flushPassiveEffectsImpl@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:27034:28\n' +
    'flushPassiveEffects@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:26979:14\n' 
    'commitRootImpl/<@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:26764:9\n' +
    'workLoop@webpack-internal:///./node_modules/react-dom/node_modules/scheduler/cjs/scheduler.development.js:266:42\n' +
    'flushWork@webpack-internal:///./node_modules/react-dom/node_modules/scheduler/cjs/scheduler.development.js:239:14\n' +
    'performWorkUntilDeadline@webpack-internal:///./node_modules/react-dom/node_modules/scheduler/cjs/scheduler.development.js:533:21\n' +
    'EventHandlerNonNull*@webpack-internal:///./node_modules/react-dom/node_modules/scheduler/cjs/scheduler.development.js:571:3\n' +
    '@webpack-internal:///./node_modules/react-dom/node_modules/scheduler/cjs/scheduler.development.js:633:5\n' +
    './node_modules/react-dom/node_modules/scheduler/cjs/scheduler.development.js@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:1078:1\n' +
    'options.factory@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:661:31\n' +
    '__webpack_require__@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:37:33\n' +
    'fn@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:316:21\n' +
    '@webpack-internal:///./node_modules/react-dom/node_modules/scheduler/index.js:4:20\n' +
    './node_modules/react-dom/node_modules/scheduler/index.js@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:1089:1\n' +
    'options.factory@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:661:31\n' +
    '__webpack_require__@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:37:33\n' +
    'fn@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:316:21\n' +
    '@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:27:36\n' +
    '@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:29862:5\n' +
    './node_modules/react-dom/cjs/react-dom.development.js@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:1045:1\n' +
    'options.factory@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:661:31\n' +
    '__webpack_require__@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:37:33\n' +
    'fn@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:316:21\n' +
    '@webpack-internal:///./node_modules/react-dom/index.js:32:20\n' +
    './node_modules/react-dom/index.js@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:1067:1\n' +
    'options.factory@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:661:31\n' +
    '__webpack_require__@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:37:33\n' +
    'fn@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:316:21\n' +
    '@webpack-internal:///./node_modules/react-dom/client.js:3:28\n' +
    './node_modules/react-dom/client.js@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:1056:1\n' +
    'options.factory@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:661:31\n' +
    '__webpack_require__@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:37:33\n' +
    'fn@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:316:21\n' +
    '@webpack-internal:///./node_modules/next/dist/client/index.js:19:40\n' +
    './node_modules/next/dist/client/index.js@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:225:1\n' +
    'options.factory@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:661:31\n' +
    '__webpack_require__@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:37:33\n' +
    'fn@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:316:21\n' +
    '@webpack-internal:///./node_modules/next/dist/client/next-dev.js:3:28\n' +
    './node_modules/next/dist/client/next-dev.js@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:236:1\n' +
    'options.factory@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:661:31\n' +
    '__webpack_require__@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:37:33\n' +
    '__webpack_exec__@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:1127:61\n' +
    '@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:1128:53\n' +
    'webpackJsonpCallback@http://localhost:3000/_next/static/chunks/webpack.js?ts=1689685566894:1209:46\n' +
    '@http://localhost:3000/_next/static/chunks/main.js?ts=1689685566894:9:61\n' +
    ''
}

[ganigeorgiev]

Searching for the error code I've stumbled on similar issue from the same ns in another repository microsoft/playwright#20749, where some of the users suggest that this could happen if a navigation is interrupted.

In any case I don't think that it is related to the JS SDK and that there is anything we can do on our end.

If you think otherwise, please create a minimal reproducible repo and I'll investigate it further.