Corrected ApolloClient.queryManager typing as it may be undefined

packages/apollo-client/CHANGELOG.md

@@ -9,7 +9,9 @@ the top level [`CHANGELOG.md`](https://github.com/apollographql/apollo-client/bl
 
 ### vNext
 
-- Updated `graphql` `peerDependencies` to handle 14.x versions.
+- Corrected `ApolloClient.queryManager` typing as it may be undefined.
+  [PR #3661](https://github.com/apollographql/apollo-client/pull/3661)
+- Updated `graphql` `peerDependencies` to handle 14.x versions.  
   [PR #3598](https://github.com/apollographql/apollo-client/pull/3598)
 - Document `setVariables` internal API status.
   [PR #3692](https://github.com/apollographql/apollo-client/pull/3692)

packages/apollo-client/src/ApolloClient.ts

@@ -68,7 +68,7 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
   public link: ApolloLink;
   public store: DataStore<TCacheShape>;
   public cache: ApolloCache<TCacheShape>;
-  public queryManager: QueryManager<TCacheShape>;
+  public queryManager: QueryManager<TCacheShape> | undefined;
   public disableNetworkFetches: boolean;
   public version: string;
   public queryDeduplication: boolean;
@@ -207,8 +207,6 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
   public watchQuery<T, TVariables = OperationVariables>(
     options: WatchQueryOptions<TVariables>,
   ): ObservableQuery<T> {
-    this.initQueryManager();
-
     if (this.defaultOptions.watchQuery) {
       options = {
         ...this.defaultOptions.watchQuery,
@@ -225,7 +223,7 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
       options = { ...options, fetchPolicy: 'cache-first' };
     }
 
-    return this.queryManager.watchQuery<T>(options);
+    return this.initQueryManager().watchQuery<T>(options);
   }
 
   /**
@@ -240,8 +238,6 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
   public query<T, TVariables = OperationVariables>(
     options: QueryOptions<TVariables>,
   ): Promise<ApolloQueryResult<T>> {
-    this.initQueryManager();
-
     if (this.defaultOptions.query) {
       options = { ...this.defaultOptions.query, ...options } as QueryOptions<
         TVariables
@@ -260,7 +256,7 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
       options = { ...options, fetchPolicy: 'cache-first' };
     }
 
-    return this.queryManager.query<T>(options);
+    return this.initQueryManager().query<T>(options);
   }
 
   /**
@@ -273,16 +269,14 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
   public mutate<T, TVariables = OperationVariables>(
     options: MutationOptions<T, TVariables>,
   ): Promise<FetchResult<T>> {
-    this.initQueryManager();
-
     if (this.defaultOptions.mutate) {
       options = {
         ...this.defaultOptions.mutate,
         ...options,
       } as MutationOptions<T, TVariables>;
     }
 
-    return this.queryManager.mutate<T>(options);
+    return this.initQueryManager().mutate<T>(options);
   }
 
   /**
@@ -292,9 +286,7 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
   public subscribe<T = any, TVariables = OperationVariables>(
     options: SubscriptionOptions<TVariables>,
   ): Observable<T> {
-    this.initQueryManager();
-
-    return this.queryManager.startGraphQLSubscription(options);
+    return this.initQueryManager().startGraphQLSubscription(options);
   }
 
   /**
@@ -335,7 +327,7 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
     options: DataProxy.WriteQueryOptions<TData, TVariables>,
   ): void {
     const result = this.initProxy().writeQuery(options);
-    this.queryManager.broadcastQueries();
+    this.initQueryManager().broadcastQueries();
     return result;
   }
 
@@ -354,7 +346,7 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
     options: DataProxy.WriteFragmentOptions<TData, TVariables>,
   ): void {
     const result = this.initProxy().writeFragment(options);
-    this.queryManager.broadcastQueries();
+    this.initQueryManager().broadcastQueries();
     return result;
   }
 
@@ -372,7 +364,7 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
     options: DataProxy.WriteDataOptions<TData>,
   ): void {
     const result = this.initProxy().writeData(options);
-    this.queryManager.broadcastQueries();
+    this.initQueryManager().broadcastQueries();
     return result;
   }
 
@@ -387,27 +379,32 @@ export default class ApolloClient<TCacheShape> implements DataProxy {
   /**
    * This initializes the query manager that tracks queries and the cache
    */
-  public initQueryManager() {
-    if (this.queryManager) return;
-
-    this.queryManager = new QueryManager({
-      link: this.link,
-      store: this.store,
-      queryDeduplication: this.queryDeduplication,
-      ssrMode: this.ssrMode,
-      onBroadcast: () => {
-        if (this.devToolsHookCb) {
-          this.devToolsHookCb({
-            action: {},
-            state: {
-              queries: this.queryManager.queryStore.getStore(),
-              mutations: this.queryManager.mutationStore.getStore(),
-            },
-            dataWithOptimisticResults: this.cache.extract(true),
-          });
-        }
-      },
-    });
+  public initQueryManager(): QueryManager<TCacheShape> {
+    if (!this.queryManager) {
+      this.queryManager = new QueryManager({
+        link: this.link,
+        store: this.store,
+        queryDeduplication: this.queryDeduplication,
+        ssrMode: this.ssrMode,
+        onBroadcast: () => {
+          if (this.devToolsHookCb) {
+            this.devToolsHookCb({
+              action: {},
+              state: {
+                queries: this.queryManager
+                  ? this.queryManager.queryStore.getStore()
+                  : {},
+                mutations: this.queryManager
+                  ? this.queryManager.mutationStore.getStore()
+                  : {},
+              },
+              dataWithOptimisticResults: this.cache.extract(true),
+            });
+          }
+        },
+      });
+    }
+    return this.queryManager;
   }
 
   /**