graphql-react

Major

• Updated the react-waterfall-render dependency to v5.

Patch

• Updated the extract-files dependency to v13.
• Updated dev dependencies.
• Use the node: URL scheme for Node.js builtin module imports in tests.
• Updated ESLint config.
• Replaced TypeScript Record types with index signatures.
• Added missing readme “Installation” section import map instructions for is-plain-obj.
• Added Browserslist links to the readme.
• Tweaked the readme.
• Fixed broken links in the readme.
• Fixed a broken link in the v13.0.0 changelog entry.

Major

• Updated Node.js support to ^14.17.0 || ^16.0.0 || >= 18.0.0.

Patch

• Updated the react peer dependency to 16.14 - 18.
• Removed the redundant react-dom peer dependency.
• Updated dependencies.
• Removed the @testing-library/react-hooks dev dependency and rewrote React hook tests using react-test-renderer, a new test utility function createReactTestRenderer, and a custom React component ReactHookTest.
• Removed the fetch-blob and formdata-node dev dependencies. Instead, File and FormData are imported from node-fetch.
• Updated jsconfig.json:
  • Set compilerOptions.maxNodeModuleJsDepth to 10.
  • Set compilerOptions.module to nodenext.
• Updated GitHub Actions CI config:
  • Run tests with Node.js v14, v16, v18.
• Removed the now redundant not IE > 0 from the Browserslist query.
• Updated react-dom/server imports in tests to suit React v18.
• Fixed the fetchGraphQL test with the global fetch API unavailable for new versions of Node.js that have the fetch global.
• Use globalThis instead of global in tests.
• Use ReactTestRenderer instead of ReactDOMServer.renderToStaticMarkup in some React context related tests.
• Removed some unnecessary JSDoc comments in tests.
• Fixed some JSDoc links.
• Revamped the readme:
  • Removed the badges.
  • Updated the “Examples” section to reflect the graphql-react examples repo migration from Node.js, Next.js, and Vercel to Deno, Ruck, and Fly.io.
  • Added information about Deno, import maps, TypeScript config, and optimal JavaScript module design.

Major

• Renamed the type FetchGraphQLResultErrors to FetchGraphQLResultError in fetchGraphQL.mjs.

Minor

• Added the new type FetchGraphQLResultErrorLoading to fetchGraphQL.mjs containing the GraphQL result error types related to loading that are generated on the client, not the GraphQL server.

Patch

• Updated dev dependencies.
• Simplified dev dependencies and config for ESLint.
• Updated GitHub Actions CI config.
• Fixed issues with GraphQL result related types from types.mjs.
• Improved various JSDoc descriptions.
• Improved the types relating to the Deferred class used in tests.

Major

• Updated the extract-files dependency.
• Updated the react-waterfall-render dependency.
• Implemented TypeScript types via JSDoc comments, fixing #6.

Patch

• Updated dev dependencies.
• Sorted the contents of the package files and exports fields.
• Removed the jsdoc-md dev dependency and the package docs-update and docs-check scripts, replacing the readme “API” section with a manually written “Exports” section.
• Check TypeScript types via a new package types script.
• Replaced the formdata-node dev dependency with formdata-polyfill and fetch-blob.
• Updated GraphQL spec URLs in JSDoc and regular comments.
• Readme tweaks.
• Added a license.md MIT License file, fixing #54.

Major

• Updated Node.js support to ^12.22.0 || ^14.17.0 || >= 16.0.0.
• Updated dependencies, some of which require newer Node.js versions than previously supported.
• Public modules are now individually listed in the package files and exports fields.
• Removed ./package from the package exports field; the full package.json filename must be used in a require path.
• Removed the package main index module; deep imports must be used.
• Shortened public module deep import paths, removing the /public/.
• The API is now ESM in .mjs files instead of CJS in .js files, accessible via import but not require.
• Switched back to using React.createElement instead of the the new React JSX runtime.

Patch

• Also run GitHub Actions CI with Node.js v17.
• Simplified package scripts.
• Removed the isobject dependency.
• Refactored the useCacheEntryPrunePrevention React hook to avoid the React.useCallback React hook.
• Avoid named imports from react and react-dom as they’re not proper Node.js ESM.
• Removed conditionality on the Node.js global process.env.NODE_ENV.
• Configured polyfilled globals in ESLint config for eslint-plugin-compat.
• Fixed JSDoc grammar typos.
• Reorganized the test file structure.
• Corrected a test name.
• Test the bundle sizes for public modules individually.
• Use a new assertBundleSize function to assert module bundle size in tests:
  • Failure message contains details about the bundle size and how much the limit was exceeded.
  • Errors when the surplus is greater than 25% of the limit, suggesting the limit should be reduced.
  • Resolves the minified bundle and its gzipped size for debugging in tests.
• Configured Prettier option singleQuote to the default, false.
• Documentation tweaks.

Major

• Updated the extract-files dependency to v11. This dependency is used by the function fetchOptionsGraphQL.

Patch

• Updated dev dependencies.
• Renamed imports in the test index module.
• Amended the changelog entries for v11.0.0, v11.0.2, and v14.0.0.

Major

• Updated Node.js support to ^12.20 || >= 14.13.
• Updated dependencies, some of which require newer Node.js versions than were previously supported.
• Replaced the the package.json exports field public subpath folder mapping (deprecated by Node.js) with a subpath pattern. Deep require paths within graphql-react/public/ must now include the .js file extension.
• The tests are now ESM in .mjs files instead of CJS in .js files.

Patch

• Updated GitHub Actions CI config to run tests with Node.js v12, v14, v16.
• Simplified JSDoc related package scripts now that jsdoc-md v10+ automatically generates a Prettier formatted readme.
• Added a package test:jsdoc script that checks the readme API docs are up to date with the source JSDoc.
• Test the bundle size using esbuild instead of webpack and disposable-directory.
• Increased the documented bundle size to “< 4 kB” to match that of esbuild instead of webpack.
• Use the correct kB symbol instead of KB wherever bundle size is mentioned in the package description and readme.
• Don’t destructure require from react to slightly improve the esbuild bundle size.
• Use the .js file extension in internal require paths.
• Updated the example Next.js app URL in the readme.
• Readme tweaks.
• The file changelog.md is no longer published.

Major

• Updated Node.js version support to ^12.0.0 || >= 13.7.0.

• Stopped supporting Internet Explorer.

• Updated the react and react-dom peer dependencies to 16.14 - 17.

• Use the new JSX runtime.

• Reorganized the file structure and replaced the entire API:

  • Removed all of the previous public exports for the old API:
    • GraphQL
    • GraphQLContext
    • GraphQLProvider
    • hashObject
    • reportCacheErrors
    • useGraphQL
    • ssr
  • Added public exports for the new API, available as named imports from the index and as deep imports from graphql-react/public/ .js CJS modules:
    • Cache
    • CacheContext
    • HYDRATION_TIME_MS
    • HydrationTimeStampContext
    • Loading
    • LoadingCacheValue
    • LoadingContext
    • Provider
    • cacheDelete
    • cacheEntryDelete
    • cacheEntryPrune
    • cacheEntrySet
    • cacheEntryStale
    • cachePrune
    • cacheStale
    • fetchGraphQL
    • fetchOptionsGraphQL
    • useAutoAbortLoad
    • useAutoLoad
    • useCache
    • useCacheEntry
    • useCacheEntryPrunePrevention
    • useLoadGraphQL
    • useLoadOnDelete
    • useLoadOnMount
    • useLoadOnStale
    • useLoading
    • useLoadingEntry
    • useWaterfallLoad
  • The function waterfallRender from react-waterfall-render should now be used for server side rendering, fixing #57.
  • In addition to the previously required globals, consider polyfilling:
    • AbortController
    • CustomEvent
    • Event
    • EventTarget
    • performance

  The API for the cache (centered around a Cache instance provided in the CacheContext React context) is separated from the API for loading (centered around a Loading instance provided in the LoadingContext React context). Although the new loading system should work well for everyone, it could be totally avoided in an app that implements a custom alternative.

  Instead of using the old mitt dependency for events, the Cache and Loading classes extend the native EventTarget global available in modern browsers and Node.js; a powerful and familiar event system with zero bundle size cost.

  The new API avoids class methods that add to bundle size regardless if they are used, in favor of focused functions that can be imported to process instances as arguments. For example, one route in your app may only render a cache entry, while another may have a form that makes the global cache stale. If the functionality to make the cache stale was a Cache instance method, it would increase the bundle size for the entire app, whereas a function imported in the second route will only grow the bundle size for that route. Features can be added to the API over time without growing everyone’s bundles.

  There are now functions that can be imported to directly manipulate the cache. The functions cacheEntrySet and cacheEntryDelete update a particular entry, and cacheDelete deletes all cache.

  There is a new approach for dealing with stale cache. The function cacheEntryStale signals a single entry is stale, and cacheStale does the same for all entries (useful after a mutation). These functions don’t actually update cache entries; they simply dispatch cache entry stale events and it’s up to components to listen for this event and reload the cache entry in response, typically via the useLoadOnStale React hook.

  Cache entries that are not relevant to the current view can now be pruned on demand using the functions cacheEntryPrune for a single entry, or cachePrune for all entries, fixing #55. These functions work by dispatching cache entry prune events on the Cache instance, and for each event not cancelled by a listener with event.preventDefault(), the cache entry is deleted. The useCacheEntryPrunePrevention React hook can be used to automatically cancel pruning of a cache entry used in a component.

  Cache keys are now manually defined instead of automatically derived from fetch options hashes, fixing #56. This is easier to understand, is faster to render, and results in a smaller bundle size without the old fnv1a dependency for hashing.

  Instead of one useGraphQL React hook with complex options that all add to a component’s bundle size regardless if they are used, there are now several more focused React hooks that can be composed to do exactly the work required, fixing #53.

  The React hooks can be composed with custom ones to load and cache any type of data, not just GraphQL, using any method, not just fetch.

  The new loading system provides the ability to abort loading at any time, implemented using the native AbortController global available in modern browsers and Node.js, fixing #24. Many of the new React hooks leverage this for features such as automatically aborting loading a cache entry when the component loading it unmounts. The new API makes it trivially easy to build features as auto-suggest search inputs that abort the last loading on new input, or page queries that abort loading if the user abandons the route.

  While the new API may seem to have an intimidating number of public exports, the average Next.js app that queries and renders data from a GraphQL API will only use a few. For inspiration, see the readme “Examples” section.

• Published modules now contain JSDoc comments, which might affect TypeScript projects.

Patch

• Updated dependencies.
• Removed Babel and related dependencies and config.
• Updated GitHub Actions CI config:
  • Updated actions/checkout to v2.
  • Updated actions/setup-node to v2.
  • Don’t specify the CI environment variable as it’s set by default.
• Stop using hard-rejection to detect unhandled Promise rejections in tests, as Node.js v15+ does this natively.
• Test the bundle size manually using webpack v5, and remove size-limit related dev dependencies, config, and scripts.
• Tweaked the package description.
• Readme edits, including:
  • Updated the Relay and Apollo URLs.
  • Mention polyfilling any required globals in the “Setup” section.
  • Removed the “Usage” section.
  • Tweaked links in the “Support” section.
  • Removed the “Apollo comparison” section.

Patch

• Updated the react and react-dom peer dependencies to 16.8 - 17.
• Updated dependencies.
• Also run GitHub Actions with Node.js v15.

Major

• Concurrent GraphQL operations with the same cache key no longer share the first request.

• The GraphQL instance property operations type has changed:

  - object<GraphQLCacheKey, Promise<GraphQLCacheValue>>
  + object<GraphQLCacheKey, Array<Promise<GraphQLCacheValue>>>
  

Patch

• Updated dev dependencies.
• Improved the test utility promisifyEvent function.
• Test the the GraphQL instance method operate option reloadOnLoad in isolation.
• Test better the order of the GraphQL instance method operate triggered events.
• Refactored the GraphQL instance method operate to eliminate the GraphQL private instance method fetch and reduce the chance of race conditions in consumer code.
• Reduced the number of promises created by the GraphQL instance method operate when the reloadOnLoad and reloadOnLoad options are false.
• Added a code example for how to await all loading GraphQL operations.
• Used consistent JSDoc types for promises that resolve void.
• Tweaked JSDoc.
• Tweaked changelog entries.

Minor

• Added a new cacheKeyCreator option to the GraphQL instance method operate and the useGraphQL React hook.
• The previously private hashObject function is now publicly exported.

Patch

• Replaced Node.js deprecated notEqual assertions with notStrictEqual in tests.
• Use the TypeError class instead of Error for relevant errors.

Minor

• Allow React component displayName and propTypes to be removed in production builds, fixing #51.
• Refactored the useGraphQL React hook to do less work for following renders if the operation and fetchOptionsOverride options are defined outside the component or memoized using the React.useMemo hook.
• Memoize what the useGraphQL React hook returns for more efficient hook composition.
• Added a new loadedCacheValue property to the GraphQL operation status object returned by the useGraphQL React hook. This allows cache for an earlier operation to be rendered while loading changes to the query, variables, or fetch options.

Patch

• Updated dependencies.
• Use coverage-node to enforce 100% code coverage for tests.
• Increased the universal API size-limit from 3 KB to 3.5 KB.
• Updated the useGraphQL React hook examples to use the GitHub GraphQL API.
• Improved the useGraphQL React hook tests.
• Improved documentation.

Patch

• Clearly documented ways to import and require the package exports.

Patch

• Updated the extract-files dependency to v9.0.0, and used its new deep require path.
• Updated dev dependencies.
• No longer test Node.js v13 in GitHub Actions CI.
• Corrected the Browserslist query in the Babel config for the server API.
• Write tests as CJS and no longer separately build and test ESM and CJS to simplify package scripts, Babel and ESLint config.
• Removed the @babel/plugin-proposal-class-properties dev dependency and config, as @babel/preset-env has handed this via it’s shippedProposals options since v7.10.0.
• Removed unnecessary .js file extensions from require paths.
• Improved polyfilling globals in tests:
  • Use revertable-globals to define globals per-test.
  • Use node-fetch v3 instead of cross-fetch.
• Removed a no longer necessary formdata-node workaround in graphqlFetchOptions tests.
• Removed npm-debug.log from the .gitignore file as npm v4.2.0+ doesn’t create it in the current working directory.

Patch

• Updated dependencies.
• Simplified the GitHub Actions CI config with the npm install-test command.
• Use Babel config overrides to ensure .js files are parsed as scripts, eliminating Babel interopRequireDefault helpers from transpilation output.
• Updated Zeit/Vercel related URLs in documentation.
• Updated the readme “Apollo comparison” section.

Patch

• Updated Node.js support to ^10.17.0 || ^12.0.0 || >= 13.7.0. This is only a correction; the dependency updates with breaking changes happened in previous versions.
• Updated dependencies.
• Simplified JSX boolean props in tests.
• Improved event documentation.
• Fixed an incorrect reportCacheErrors JSDoc parameter type.
• Updated EditorConfig.

Major

• Added a package exports field to support native ESM in Node.js.
• Some source and published files are now .js (CJS) instead of .mjs (ESM), so undocumented deep imports may no longer work. This approach avoids the dual package hazard.
• Updated Node.js support from v10+ to 10 - 12 || >= 13.7 to reflect the package exports related breaking changes.

Patch

• Updated dependencies.
• Added a new babel-plugin-transform-runtime-file-extensions dev dependency to simplify Babel config.
• Improved the package prepare:prettier and test:prettier scripts.
• Reordered the package test:eslint script args for consistency with test:prettier.
• Configured Prettier option semi to the default, true.
• Reconfigured size-limit:
  • Separately test the universal and server only exports, without using unpublished size limit entry files that bloat the measured sizes.
  • Separately test the ESM and CJS exports.
  • Separately limit tests, with the universal ESM and CJS set to a 3 KB maximum size.
• Removed redundant ESLint disable comments.
• Also run GitHub Actions with Node.js v14.
• Updated readme content.
• Updated JSDoc code examples:
  • Prettier formatting.
  • Import React in examples containing JSX.
  • Use Node.js ESM compatible import specifiers.

Major

• Updated Node.js support from v8.10+ to v10+.
• Updated dependencies, some of which require Node.js v10+.
• Replaced the tap dev dependency with test-director and hard-rejection, and refactored tests accordingly. This improves the dev experience and reduced the dev install size by ~75.5 MB.
• Use ReactDOM.unstable_batchedUpdates in the useGraphQL React hook to reduce the number of renders when loading completes, fixing #38 via #42. Although react-dom was already a peer dependency, this is the first time it's being used in the client API; potentially a breaking change for atypical projects.

Patch

• Updated tests for compatibility with updated dependencies.
• Removed the object-assign dependency and several Babel dev dependencies after simplifying the Babel config.
• Added a new babel-plugin-transform-require-extensions dev dependency and ensured ESM import specifiers in both source and published .mjs files contain file names with extensions, which are mandatory in the final Node.js ESM implementation. Published CJS .js files now also have file extensions in require paths.
• Stop using husky and lint-staged.
• Lint fixes for prettier v2.
• Tidied Babel configs.
• Ensure GitHub Actions run on pull request.
• Use strict mode for scripts.
• Readme “Apollo comparison” section corrections and tweaks.

Minor

• Setup GitHub Sponsors funding:
  • Added .github/funding.yml to display a sponsor button in GitHub.
  • Added a package.json funding field to enable npm CLI funding features.

Patch

• Updated dev dependencies.

Major

• Updated Node.js support from v8.5+ to v8.10+, to match what the eslint dev dependency now supports. This is unlikely to be a breaking change for the published package.
• The useGraphQL React hook loadOnMount, loadOnReload, and loadOnReset options now default to false instead of true. The loading related options are now all opt-in, which is easier to remember and simpler to configure for situations that previously required manual reversal of certain option defaults. It's also safer when working with mutations you don't want to accidentally load.

Patch

• Updated dependencies.
• Replaced the size-limit dev dependency with @size-limit/preset-small-lib.
• Fixed the useGraphQL enabled option loadOnReload causing a load when the global GraphQL cache is reloaded even if there was no previously cached data to reload.
• Tweaked the useGraphQL option loadOnReset documentation.
• Removed package-lock.json from .gitignore and .prettierignore as it’s disabled in .npmrc anyway.
• Removed redundant ESLint ignore comments.
• Use GitHub Actions instead of Travis for CI.
• Minor simplification in useGraphQL tests.
• Documentation improvements, fixing #35:
  • Updated the project description with better phrasing that includes the bundle size.
  • Moved the readme “Apollo comparison” section to the end, and updated the “Bundle impact” subsection for the new Apollo React hooks API.
  • Added a basic example of the core API features working together to the “Examples” section, with tips commented.
  • Clarified that Opera Mini isn’t supported in the Browserslist queries and readme “Support” section.
  • Cleaner readme “API” section table of contents with “See” and “Examples” headings excluded, thanks to jsdoc-md v3.1.0.