watchQuery causes TypeError: Cannot assign to read only property 'data' of object

I don’t know if I’m encountering a bug or if I’m doing something wrong. Every first time (after page load) my GQL query is executed, I get:

TypeError: Cannot assign to read only property ‘data’ of object

Subsequent queries (until the page is reloaded) are working correctly! My code doesn’t try to alter the received data, the error occurs while fetching the data, after a succesful reply of the server.

Here is the stack trace:

TypeError: Cannot assign to read only property ‘data’ of object at QueryInfo.js:210 at perform (inMemoryCache.js:197) at InMemoryCache.push.kifG.InMemoryCache.performTransaction (inMemoryCache.js:214) at QueryInfo.push.FmZO.QueryInfo.markResult (QueryInfo.js:180) at QueryManager.js:520 at asyncMap.js:11 at new ZoneAwarePromise (zone-evergreen.js:960) at Object.next (asyncMap.js:11) at notifySubscription (Observable.js:135) at onNotify (Observable.js:179)

This is my code:

    const query = gql`
      query identify($number: String!) {
        identify(number: $number) {
          number
          lastName
        }
      }
    `;
    subscription = this.apollo
      .watchQuery<IdentifyResult>({
        query,
        variables: {
          number
        }
      })
      .valueChanges.subscribe(
        queryResult => {
          console.log('queryResult', queryResult);
        },
        error => {
          console.error(error);
        }
      );

In the AppModule I don’t do anything special, I just add this provider:

    {
      provide: APOLLO_OPTIONS,
      useFactory: (httpLink: HttpLink) => {
        return {
          cache: new InMemoryCache(),
          link: httpLink.create({
            uri: 'http://localhost:60798/graphql/'
          })
        };
      },
      deps: [HttpLink]
    }

The error does not occur when I disable caching.

          .watchQuery<Citizen>({
            query: this.myQuery,
            variables: {
              nationalNumber: action.nationalNumber
            },
            fetchPolicy: 'no-cache'
          })

I am using these libraries:

“@apollo/client”: “^3.3.6”, “apollo-angular”: “^2.1.0”, “graphql”: “^15.4.0”,

Your help is much appreciated!

[JohanHeyvaert]

I don’t know which update/version I have to be thankful for, but in the current version (3.3.16) the error on longer occurs. It wasn’t working in 3.3.9 but it’s been a while since we updated our packages. So good news!

[intellix]

Related from the past: https://github.com/apollographql/apollo-client/issues/1909 This is stinging me again badly. Migrated to ApolloClient 3 and now getting alsorts of these errors throughout at runtime. Life is pain.

Can we not just opt into disabling freezing entirely? I’d prefer to have bugs due to mutating state than a readonly error being thrown at runtime in production personally. Still finding them in odd places.