apollo-client-devtools icon indicating copy to clipboard operation
apollo-client-devtools copied to clipboard
verified publisher icon apollographql

Extension causes query response handling to fail. Uncaught TypeError: Cannot convert object to primitive value

Open anthonysapien opened this issue 1 year ago • 6 comments

Intended outcome:

Open a page that runs a query that loads a list of projects.

Actual outcome:

I see the following error in the Developer Tools Console. It only occurs on the page load. Subsequent app navigation to run the same query works fine.

Uncaught TypeError: Cannot convert object to primitive value at String () at console.warn () at console.r [as warn] (fs.js:4:15190) at invariant.ts:42:21 at Function.warn (invariantWrappers.ts:17:7) at writeToStore.ts:851:5 at writeToStore.ts:216:15 at Array.forEach () at writeToStore.ts:207:36 at Map.forEach () r @ fs.js:4 (anonymous) @ invariant.ts:42 (anonymous) @ invariantWrappers.ts:17 (anonymous) @ writeToStore.ts:851 (anonymous) @ writeToStore.ts:216 (anonymous) @ writeToStore.ts:207 e.writeToStore @ writeToStore.ts:167 t.write @ inMemoryCache.ts:205 e.writeQuery @ cache.ts:166 (anonymous) @ QueryInfo.ts:399 l @ inMemoryCache.ts:420 t.batch @ inMemoryCache.ts:464 t.performTransaction @ inMemoryCache.ts:507 e.markResult @ QueryInfo.ts:397 (anonymous) @ QueryManager.ts:1172 i @ asyncMap.ts:32 (anonymous) @ asyncMap.ts:17 f @ projects:1 Promise @ projects:1 then @ asyncMap.ts:17 (anonymous) @ asyncMap.ts:34 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 (anonymous) @ iteration.ts:13 li @ iteration.ts:13 next @ Concast.ts:168 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 onNext @ retryLink.ts:130 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 next @ index.ts:55 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 next @ module.js:310 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 f @ projects:1 setTimeout (async) f @ projects:1 Zn @ module.js:61 Ln @ module.js:146 Fn @ module.js:176 t.error @ module.js:229 (anonymous) @ iteration.ts:13 li @ iteration.ts:13 t.reportError @ ObservableQuery.ts:1006 error @ ObservableQuery.ts:911 (anonymous) @ iteration.ts:13 li @ iteration.ts:13 error @ Concast.ts:183 Ln @ module.js:137 Fn @ module.js:176 t.error @ module.js:229 (anonymous) @ asyncMap.ts:36 f @ projects:1 Promise.then (async) a.then @ projects:1 (anonymous) @ asyncMap.ts:34 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 (anonymous) @ iteration.ts:13 li @ iteration.ts:13 next @ Concast.ts:168 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 onNext @ retryLink.ts:130 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 next @ index.ts:55 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 next @ module.js:310 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 Ln @ module.js:132 Fn @ module.js:176 t.next @ module.js:225 f @ projects:1 Promise.then (async) a.then @ projects:1 (anonymous) @ createHttpLink.ts:196 f @ projects:1 Promise.then (async) a.then @ projects:1 (anonymous) @ createHttpLink.ts:189 e @ module.js:190 t.subscribe @ module.js:264 (anonymous) @ index.ts:25 f @ projects:1 Promise.then (async) a.then @ projects:1 (anonymous) @ index.ts:22 e @ module.js:190 t.subscribe @ module.js:264 (anonymous) @ module.js:302 e @ module.js:190 t.subscribe @ module.js:264 (anonymous) @ index.ts:36 e @ module.js:190 t.subscribe @ module.js:264 e.try @ retryLink.ts:119 e.start @ retryLink.ts:102 t.request @ retryLink.ts:198 (anonymous) @ ApolloLink.ts:102 (anonymous) @ ApolloLink.ts:102 (anonymous) @ ApolloLink.ts:102 (anonymous) @ ApolloLink.ts:94 e.execute @ ApolloLink.ts:68 e.getObservableFromLink @ QueryManager.ts:1100 e.getResultsFromLink @ QueryManager.ts:1139 g @ QueryManager.ts:1573 e.fetchQueryByPolicy @ QueryManager.ts:1619 w @ QueryManager.ts:1246 e.fetchConcastWithInfo @ QueryManager.ts:1312 t.fetch @ ObservableQuery.ts:748 t.reobserveAsConcast @ ObservableQuery.ts:900 t.reobserve @ ObservableQuery.ts:941 (anonymous) @ ObservableQuery.ts:144 e @ module.js:190 t.subscribe @ module.js:264 (anonymous) @ useQuery.ts:235 Da @ react-dom.production.min.js:174 ol @ react-dom.production.min.js:244 Cc @ react-dom.production.min.js:286 (anonymous) @ react-dom.production.min.js:283 Sc @ react-dom.production.min.js:281 cc @ react-dom.production.min.js:273 Ho @ react-dom.production.min.js:127 (anonymous) @ react-dom.production.min.js:267 Show 125 more frames Show less

How to reproduce the issue:

My app is unfortunately not public, and I don't know how to reproduce this. It doesn't occur on all of my pages, just certain ones. When I disable the extension, everything works fine. When I reenable it, I see the error again. It occurs on every full page reload.

It looks like this is happening to others as well as I discovered that it might be the extension from this review: https://chromewebstore.google.com/detail/apollo-client-devtools/jdkknkkbebbapilgoeccciglkfbmbnfm?pli=1

Thanks for looking into it. Let me know if I can provider further information.

Desktop (please complete the following information):

  • OS: Mac
  • Browser: Chrome
  • Browser version 123.0.6312.107 (Official Build) (arm64)
  • Extension version 4.11.2

anthonysapien avatar Apr 13 '24 16:04 anthonysapien

Hey @anthonysapien 👋

Thanks for pointing this out and sorry for the issue! We added the ability for the devtools to decode error messages from the client, but there was a bug with the client messages in a couple patch versions. We will see if we can make this more gracefully degrade with those versions.

Do you mind replying with the client version you're using?

jerelmiller avatar Apr 13 '24 16:04 jerelmiller

FYI I think its related to these issues in the client. The devtools just amplifies this problem:

  • https://github.com/apollographql/apollo-client/issues/11639
  • https://github.com/apollographql/apollo-client/issues/11482

jerelmiller avatar Apr 13 '24 16:04 jerelmiller

Hi Jerel, sure. I'm using version 3.9.9 of the client. I'm going to update to the latest now and report back.

On Sat, Apr 13, 2024 at 12:39 PM, Jerel Miller @.***> wrote:

FYI I think its related to these issues in the client. The devtools just amplifies this problem:

— Reply to this email directly, view it on GitHub https://github.com/apollographql/apollo-client-devtools/issues/1328#issuecomment-2053696925, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAJ7OMTU3QPIE5DXDL7IMDY5FNU7AVCNFSM6AAAAABGFSIGV6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDANJTGY4TMOJSGU . You are receiving this because you were mentioned.Message ID: @.***>

anthonysapien avatar Apr 14 '24 18:04 anthonysapien

Updated to 3.9.11, and the issue is resolved. Thanks for your help!

On Sun, Apr 14, 2024 at 2:22 PM, Anthony Yam @.***> wrote:

Hi Jerel, sure. I'm using version 3.9.9 of the client. I'm going to update to the latest now and report back.

On Sat, Apr 13, 2024 at 12:39 PM, Jerel Miller @.***> wrote:

FYI I think its related to these issues in the client. The devtools just amplifies this problem:

— Reply to this email directly, view it on GitHub https://github.com/apollographql/apollo-client-devtools/issues/1328#issuecomment-2053696925, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAJ7OMTU3QPIE5DXDL7IMDY5FNU7AVCNFSM6AAAAABGFSIGV6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDANJTGY4TMOJSGU . You are receiving this because you were mentioned.Message ID: @.***>

anthonysapien avatar Apr 14 '24 18:04 anthonysapien

Glad to hear it! I'll leave this open for now to see if there is anything else we can do in the devtools for the client versions that have this bug.

jerelmiller avatar Apr 15 '24 01:04 jerelmiller

If this happens again, I hope that the CodeSandbox I created over in this issue can be a starting point to help debugging:

https://github.com/apollographql/apollo-client/issues/11639#issuecomment-2058663217

Load the Sandbox first:

codesandbox.io/p/sandbox/trigger-cache-warning-cltdvn

Then visit the standalone Sandbox:

cltdvn.csb.app

Scenarios to check:

  • Browser window with DevTools enabled - you should get three warnings, the first a link and the two other "spelled out"
  • Browser window with DevTools disabled - you should get three warnings, the first two should be links and the last one "spelled out"

phryneas avatar Apr 16 '24 09:04 phryneas