Skip to content

Commit

Permalink
remove R19 exception from test, chores
Browse files Browse the repository at this point in the history
  • Loading branch information
phryneas committed Jul 3, 2024
1 parent fed117b commit a69327c
Show file tree
Hide file tree
Showing 3 changed files with 8 additions and 30 deletions.
5 changes: 5 additions & 0 deletions .changeset/nasty-olives-act.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@apollo/client": minor
---

Rewrite big parts of `useQuery` and `useLazyQuery` to be more compliant with the Rules of React and React Compiler
4 changes: 2 additions & 2 deletions .size-limits.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
{
"dist/apollo-client.min.cjs": 39604,
"import { ApolloClient, InMemoryCache, HttpLink } from \"dist/index.js\" (production)": 32852
"dist/apollo-client.min.cjs": 39808,
"import { ApolloClient, InMemoryCache, HttpLink } from \"dist/index.js\" (production)": 32851
}
29 changes: 1 addition & 28 deletions src/react/hooks/__tests__/useQuery.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,6 @@ import { useApolloClient } from "../useApolloClient";
import { useLazyQuery } from "../useLazyQuery";

const IS_REACT_17 = React.version.startsWith("17");
const IS_REACT_19 = React.version.startsWith("19");

describe("useQuery Hook", () => {
describe("General use", () => {
Expand Down Expand Up @@ -1536,33 +1535,7 @@ describe("useQuery Hook", () => {

function checkObservableQueries(expectedLinkCount: number) {
const obsQueries = client.getObservableQueries("all");
/*
This is due to a timing change in React 19
In React 18, you observe this pattern:
1. render
2. useState initializer
3. component continues to render with first state
4. strictMode: render again
5. strictMode: call useState initializer again
6. component continues to render with second state
now, in React 19 it looks like this:
1. render
2. useState initializer
3. strictMode: call useState initializer again
4. component continues to render with one of these two states
5. strictMode: render again
6. component continues to render with the same state as during the first render
Since useQuery breaks the rules of React and mutably creates an ObservableQuery on the state during render if none is present, React 18 did create two, while React 19 only creates one.
This is pure coincidence though, and the useQuery rewrite that doesn't break the rules of hooks as much and creates the ObservableQuery as part of the state initializer will end up with behaviour closer to the old React 18 behaviour again.
*/
expect(obsQueries.size).toBe(IS_REACT_19 ? 1 : 2);
expect(obsQueries.size).toBe(2);

const activeSet = new Set<typeof result.current.observable>();
const inactiveSet = new Set<typeof result.current.observable>();
Expand Down

0 comments on commit a69327c

Please sign in to comment.