Version Packages

[github-actions]

This PR was opened by the Changesets release GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated.

Releases

@apollo/client@3.8.0

Minor Changes

• #10895 e187866fd Thanks @(author)! - Add generic type parameter for the entity modified in cache.modify. Improves
  TypeScript type inference for that type's fields and values of those fields.

  Example:

  cache.modify<Book>({
    id: cache.identify(someBook),
    fields: {
      title: (title) => {
        // title has type `string`.
        // It used to be `any`.
      },
   => {
        // author has type `Reference | Book["author"]`.
        // It used to be `any`.
      },
    },
  });

• #10895 e187866fd Thanks @Gelio! - Use unique opaque types for the DELETE and INVALIDATE Apollo cache modifiers.

  This increases type safety, since these 2 modifiers no longer have the any type.
  Moreover, it no longer triggers the @typescript-eslint/no-unsafe-return
  rule.

• #11112 b4aefcfe9 Thanks @jerelmiller! - Adds support for a skipToken sentinel that can be used as options in useSuspenseQuery and useBackgroundQuery to skip execution of a query. This works identically to the skip option but is more type-safe and as such, becomes the recommended way to skip query execution. As such, the skip option has been deprecated in favor of skipToken.

  We are considering the removal of the skip option from useSuspenseQuery and useBackgroundQuery in the next major. We are releasing with it now to make migration from useQuery easier and make skipToken more discoverable.

  import { skipToken } from "@apollo/client";
  
  const id: number | undefined;
  
  const { data } = useSuspenseQuery(
    query,
    id ? { variables: { id } } : skipToken
  );

  Breaking change

  Previously useBackgroundQuery would always return a queryRef whenever query execution was skipped. This behavior been updated to return a queryRef only when query execution is enabled. If initializing the hook with it skipped, queryRef is now returned as undefined.

  To migrate, conditionally render the component that accepts the queryRef as props.

  Before

  function Parent() {
    const [queryRef] = useBackgroundQuery(query, skip ? skipToken : undefined);
    //      ^? QueryReference<TData | undefined>
  
    return <Child queryRef={queryRef} />;
  }
  
  function Child({
    queryRef,
  }: {
    queryRef: QueryReference<TData | undefined>;
  }) {
    const { data } = useReadQuery(queryRef);
  }

  After

  function Parent() {
    const [queryRef] = useBackgroundQuery(query, skip ? skipToken : undefined);
    //      ^? QueryReference<TData> | undefined
  
    return queryRef ? <Child queryRef={queryRef} /> : null;
  }
  
  function Child({ queryRef }: { queryRef: QueryReference<TData> }) {
    const { data } = useReadQuery(queryRef);
  }

• #10527 0cc7e2e19 Thanks @phryneas! - Remove the query/mutation/subscription option from hooks that already take that value as their first argument.

• #10887 f8c0b965d Thanks @phryneas! - Add a new mechanism for Error Extraction to reduce bundle size by including
  error message texts on an opt-in basis.
  By default, errors will link to an error page with the entire error message.
  This replaces "development" and "production" errors and works without
  additional bundler configuration.
  Bundling the text of error messages and development warnings can be enabled by

  import { loadErrorMessages, loadDevMessages } from "@apollo/client/dev";
  if (process.env.NODE_ENV !== "production") {
    loadErrorMessages();
    loadDevMessages();
  }

• #10506 2dc2e1d4f Thanks @phryneas! - prevent accidental widening of inferred TData and TVariables generics for query hook option arguments

• #10521 fbf729414 Thanks @benjamn! - Simplify __DEV__ polyfill to use imports instead of global scope

• #10994 2ebbd3abb Thanks @phryneas! - Add .js file extensions to imports in src and dist/*/.d.ts

• #10722 c7e60f83d Thanks @benjamn! - Implement a @nonreactive directive for selectively skipping reactive comparisons of query result subtrees

• #11045 9c1d4a104 Thanks @jerelmiller! - When changing variables back to a previously used set of variables, do not automatically cache the result as part of the query reference. Instead, dispose of the query reference so that the InMemoryCache can determine the cached behavior. This means that fetch policies that would guarantee a network request are now honored when switching back to previously used variables.

• #11058 89bf33c42 Thanks @phryneas! - (Batch)HttpLink: Propagate AbortErrors to the user when a user-provided signal is passed to the link. Previously, these links would swallow all AbortErrors, potentially causing queries and mutations to never resolve. As a result of this change, users are now expected to handle AbortErrors when passing in a user-provided signal.

• #10346 3bcfc42d3 Thanks @jerelmiller! - Add the ability to allow @client fields to be sent to the link chain.

• #10755 e3c676deb Thanks @alessbell! - Feature: adds useBackgroundQuery and useReadQuery hooks

• #10853 300957960 Thanks @jerelmiller! - Introduce the new removeTypenameFromVariables link. This link will automatically remove __typename fields from variables for all operations. This link can be configured to exclude JSON-scalars for scalars that utilize __typename.

  This change undoes some work from Automatically strip __typename for input data in variables #10724 where __typename was automatically stripped for all operations with no configuration. This was determined to be a breaking change and therefore moved into this link.

• #10323 64cb88a4b Thanks @jerelmiller! - Add support for React suspense with a new useSuspenseQuery hook.

• #10567 c2ce6496c Thanks @benjamn! - Allow ApolloCache implementations to specify default value for assumeImmutableResults client option, improving performance for applications currently using InMemoryCache without configuring new ApolloClient({ assumeImmutableResults: true })

• #11040 125ef5b2a Thanks @phryneas! - HttpLink/BatchHttpLink: Abort the AbortController signal more granularly.
  Before this change, when HttpLink/BatchHttpLink created an AbortController
  internally, the signal would always be .aborted after the request was completed. This could cause issues with Sentry Session Replay and Next.js App Router Cache invalidations, which just replayed the fetch with the same options - including the cancelled AbortSignal.

  With this change, the AbortController will only be .abort()ed by outside events,
  not as a consequence of the request completing.

• #10915 3a62d8228 Thanks @phryneas! - Changes how development-only code is bundled in the library to more reliably enable consuming bundlers to reduce production bundle sizes while keeping compatibility with non-node environments.

• #10509 79df2c7ba Thanks @jerelmiller! - Add the ability to specify custom GraphQL document transforms. These transforms are run before reading data from the cache, before local state is resolved, and before the query document is sent through the link chain.

  To register a custom document transform, create a transform using the DocumentTransform class and pass it to the documentTransform option on ApolloClient.

  import { DocumentTransform } from "@apollo/client";
  
  const documentTransform = new DocumentTransform((document) => {
    // do something with `document`
    return transformedDocument;
  });
  
  const client = new ApolloClient({ documentTransform: documentTransform });

  For additional documentation on the behavior and API of DocumentTransform, see the pull request.

Patch Changes

• #11086 0264fee06 Thanks @jerelmiller! - Fix an issue where a call to refetch, fetchMore, or changing skip to false that returned a result deeply equal to data in the cache would get stuck in a pending state and never resolve.

• #11053 c0ca70720 Thanks @phryneas! - Add SuspenseCache as a lazy hidden property on ApolloClient.
  This means that SuspenseCache is now an implementation details of Apollo Client
  and you no longer need to manually instantiate it and no longer need to pass it
  into ApolloProvider.
  Trying to instantiate a SuspenseCache instance in your code will now throw an
  error.

  Migration:

  -import { SuspenseCache } from '@apollo/client';
  
  -const suspenseCache = new SuspenseCache();
  
  -<ApolloProvider client={client} suspenseCache={suspenseCache} />;
  +<ApolloProvider client={client} />;

• #11115 78739e3ef Thanks @phryneas! - Enforce export type for all type-level exports.

• #11027 e47cfd04e Thanks @phryneas! - Prevents the DevTool installation warning to be turned into a documentation link.

• #10594 f221b5e8f Thanks @phryneas! - Add a suspenseCache option to useSuspenseQuery

• #10700 12e37f46f Thanks @jerelmiller! - Add a queryKey option to useSuspenseQuery that allows the hook to create a unique subscription instance.

• #10724 e285dfd00 Thanks @jerelmiller! - Automatically strips __typename fields from variables sent to the server when using HttpLink, BatchHttpLink, or GraphQLWsLink. This allows GraphQL data returned from a query to be used as an argument to a subsequent GraphQL operation without the need to strip the __typename in user-space.

• #10957 445164d21 Thanks @phryneas! - Use React.version as key for shared Contexts.

• #10635 7df51ee19 Thanks @jerelmiller! - Fix an issue where cache updates would not propagate to useSuspenseQuery while in strict mode.

• #11013 5ed2cfdaf Thanks @alessbell! - Make private fields inFlightLinkObservables and fetchCancelFns protected in QueryManager in order to make types available in @apollo/experimental-nextjs-app-support package when extending the ApolloClient class.

• #10869 ba1d06166 Thanks @phryneas! - Ensure Context value stability when rerendering ApolloProvider with the same client and/or suspenseCache prop

• #10340 4f73c5ca1 Thanks @alessbell! - Avoid calling useQuery onCompleted for cache writes

• #11103 e3d611daf Thanks @caylahamann! - Fixes a bug in useMutation so that onError is called when an error is returned from the request with errorPolicy set to 'all' .

• #10657 db305a800 Thanks @jerelmiller! - Return networkStatus in the useSuspenseQuery result.

• #10937 eea44eb87 Thanks @jerelmiller! - Moves DocumentTransform to the utilities sub-package to avoid a circular dependency between the core and cache sub-packages.

• #10951 2e833b2ca Thanks @alessbell! - Improve useBackgroundQuery type interface

• #10651 8355d0e1e Thanks @jerelmiller! - Fixes an issue where useSuspenseQuery would not respond to cache updates when using a cache-first fetchPolicy after the hook was mounted with data already in the cache.

• #10765 35f36c5aa Thanks @phryneas! - More robust types for the data property on UseFragmentResult. When a partial result is given, the type is now correctly set to Partial<TData>.

• #11083 f766e8305 Thanks @phryneas! - Adjust the rerender timing of useQuery to more closely align with useFragment. This means that cache updates delivered to both hooks should trigger renders at relatively the same time. Previously, the useFragment might rerender much faster leading to some confusion.

• #11026 b8d405eee Thanks @phryneas! - Store React.Context instance mapped by React.createContext instance, not React.version.
  Using React.version can cause problems with preact, as multiple versions of preact will all identify themselves as React 17.0.2.

• #11000 1d43ab616 Thanks @phryneas! - Use import * as React everywhere. This prevents an error when importing @apollo/client in a React Server component. (see #10974)

• #10852 27fbdb3f9 Thanks @phryneas! - Chore: Add ESLint rule for consistent type imports, apply autofix

• #10999 c1904a78a Thanks @phryneas! - Fix a bug in QueryReference where this.resolve or this.reject might be executed even if undefined.

• #10940 1d38f128f Thanks @jerelmiller! - Add support for the skip option in useBackgroundQuery and useSuspenseQuery. Setting this option to true will avoid a network request.

• #10672 932252b0c Thanks @jerelmiller! - Fix the compatibility between useSuspenseQuery and React's useDeferredValue and startTransition APIs to allow React to show stale UI while the changes to the variable cause the component to suspend.

  Breaking change

  nextFetchPolicy support has been removed from useSuspenseQuery. If you are using this option, remove it, otherwise it will be ignored.

• #10916 ea75e18de Thanks @alessbell! - Remove experimental labels from hooks, move to beta.

• #10964 f33171506 Thanks @alessbell! - Fixes a bug in BatchHttpLink that removed variables from all requests by default.

• #10633 90a06eeeb Thanks @benjamn! - Fix type policy inheritance involving fuzzy possibleTypes

• #10754 64b304862 Thanks @sincraianul! - Fix includeUnusedVariables option not working with BatchHttpLink

• #11018 5618953f3 Thanks @jerelmiller! - useBackgroundQuery now uses its own options type called BackgroundQueryHookOptions rather than reusing SuspenseQueryHookOptions.

• #11035 a3ab7456d Thanks @jerelmiller! - Incrementally re-render deferred queries after calling refetch or setting skip to false to match the behavior of the initial fetch. Previously, the hook would not re-render until the entire result had finished loading in these cases.

• #10399 652a1ae08 Thanks @alessbell! - Silence useLayoutEffect warning when useSuspenseQuery runs on server

• #10919 f796ce1ac Thanks @jerelmiller! - Fix an issue when using a link that relied on operation.getContext and operation.setContext would error out when it was declared after the removeTypenameFromVariables link.

• #10968 b102390b2 Thanks @phryneas! - Use printed query for query deduplication. Cache print calls for GraphQL documents to speed up repeated operations.

• #11071 4473e925a Thanks @jerelmiller! - #10509 introduced some helpers for determining the type of operation for a GraphQL query. This imported the OperationTypeNode from graphql-js which is not available in GraphQL 14. To maintain compatibility with graphql-js v14, this has been reverted to use plain strings.

• #10766 ffb179e55 Thanks @jerelmiller! - More robust typings for the data property returned from useSuspenseQuery when using returnPartialData: true or an errorPolicy of all or ignore. TData now defaults to unknown instead of any.

• #10401 3e5b41a75 Thanks @jerelmiller! - Always throw network errors in useSuspenseQuery regardless of the set errorPolicy.

• #10877 f40248598 Thanks @phryneas! - Change an import in useQuery and useMutation that added an unnecessary runtime dependency on @apollo/client/core. This drastically reduces the bundle size of each the hooks.

• #10836 6794893c2 Thanks @phryneas! - Remove the deprecated returnPartialData option from useFragment hook.

• #10656 54c4d2f3c Thanks @jerelmiller! - Ensure refetch, fetchMore, and subscribeToMore functions returned by useSuspenseQuery are referentially stable between renders, even as data is updated.

• #10324 95eb228be Thanks @jerelmiller! - Add @defer support to useSuspenseQuery.

• #10888 1562a2f5a Thanks @alessbell! - Updates dependency versions in package.json by bumping:

  • @wry/context to ^0.7.3
  • @wry/equality to ^0.5.6
  • @wry/trie to ^0.4.3
  • optimism to ^0.17.4

  to 1. fix sourcemap warnings and 2. a Codesandbox sandpack (in-browser) bundler transpilation bug with an upstream optimism workaround.

• #11010 1051a9c88 Thanks @alessbell! - Hide queryRef in a Symbol in useBackgroundQuerys return value.

• #10758 9def7421f Thanks @phryneas! - use React.use where available

• #11032 6a4da900a Thanks @jerelmiller! - Throw errors in useSuspenseQuery for errors returned in incremental chunks when errorPolicy is none. This provides a more consistent behavior of the errorPolicy in the hook.

  Potentially breaking change

  Previously, if you issued a query with @defer and relied on errorPolicy: 'none' to set the error property returned from useSuspenseQuery when the error was returned in an incremental chunk, this error is now thrown. Switch the errorPolicy to all to avoid throwing the error and instead return it in the error property.

• #10960 ee407ef97 Thanks @alessbell! - Adds support for returnPartialData and refetchWritePolicy options in useBackgroundQuery hook.

• #10809 49d28f764 Thanks @jerelmiller! - Fixed the ability to use refetch and fetchMore with React's startTransition. The hook will now behave correctly by allowing React to avoid showing the Suspense fallback when these functions are wrapped by startTransition. This change deprecates the suspensePolicy option in favor of startTransition.

• #11082 0f1cde3a2 Thanks @phryneas! - Restore Apollo Client 3.7 getApolloContext behaviour

• #10969 525a9317a Thanks @phryneas! - Slightly decrease bundle size and memory footprint of SuspenseCache by changing how cache entries are stored internally.

• #11025 6092b6edf Thanks @jerelmiller! - useSuspenseQuery and useBackgroundQuery will now properly apply changes to its options between renders.

• #10872 96b4f8837 Thanks @phryneas! - The "per-React-Version-Singleton" ApolloContext is now stored on globalThis, not React.createContext, and throws an error message when accessed from React Server Components.

• #10450 f8bc33387 Thanks @jerelmiller! - Add support for the subscribeToMore and client fields returned in the useSuspenseQuery result.

[github-actions]

size-limit report 📦

Path	Size
dist/apollo-client.min.cjs	37.16 KB (-0.01% 🔽)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs"	43.69 KB (-0.01% 🔽)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" (production)	42.29 KB (-0.01% 🔽)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js"	32.39 KB (-0.01% 🔽)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" (production)	31.22 KB (-0.01% 🔽)
import { ApolloProvider } from "dist/react/index.js"	1.21 KB (-0.09% 🔽)
import { ApolloProvider } from "dist/react/index.js" (production)	1.2 KB (-0.09% 🔽)
import { useQuery } from "dist/react/index.js"	4.29 KB (-0.05% 🔽)
import { useQuery } from "dist/react/index.js" (production)	4.1 KB (-0.1% 🔽)
import { useLazyQuery } from "dist/react/index.js"	4.59 KB (-0.03% 🔽)
import { useLazyQuery } from "dist/react/index.js" (production)	4.41 KB (0%)
import { useMutation } from "dist/react/index.js"	2.52 KB (-0.04% 🔽)
import { useMutation } from "dist/react/index.js" (production)	2.5 KB (-0.08% 🔽)
import { useSubscription } from "dist/react/index.js"	2.23 KB (-0.05% 🔽)
import { useSubscription } from "dist/react/index.js" (production)	2.19 KB (-0.09% 🔽)
import { useSuspenseQuery } from "dist/react/index.js"	4.73 KB (-0.03% 🔽)
import { useSuspenseQuery } from "dist/react/index.js" (production)	4.16 KB (-0.03% 🔽)
import { useBackgroundQuery } from "dist/react/index.js"	4.25 KB (-0.03% 🔽)
import { useBackgroundQuery } from "dist/react/index.js" (production)	3.67 KB (-0.06% 🔽)
import { useReadQuery } from "dist/react/index.js"	2.94 KB (-0.04% 🔽)
import { useReadQuery } from "dist/react/index.js" (production)	2.88 KB (-0.04% 🔽)
import { useFragment } from "dist/react/index.js"	2.07 KB (-0.05% 🔽)
import { useFragment } from "dist/react/index.js" (production)	2.02 KB (0%)