Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

stabilize useQuery tests #11890

Merged
merged 13 commits into from
Jul 2, 2024
Merged

stabilize useQuery tests #11890

merged 13 commits into from
Jul 2, 2024

Conversation

phryneas
Copy link
Member

@phryneas phryneas commented Jun 11, 2024

There is a bunch of tests for useQuery that flake out sometimes due to race conditions. This fixes a bunch of them.

All tests I did refactor in this PR did actually fail locally when running the tests in an endless loop, this is not "theoretically flakyness".

Copy link

changeset-bot bot commented Jun 11, 2024

⚠️ No Changeset found

Latest commit: 92246c6

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Copy link
Contributor

github-actions bot commented Jun 11, 2024

size-limit report 📦

Path Size
dist/apollo-client.min.cjs 38.68 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" 47.48 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" (production) 45.05 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" 34.22 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" (production) 32.08 KB (0%)
import { ApolloProvider } from "dist/react/index.js" 1.26 KB (0%)
import { ApolloProvider } from "dist/react/index.js" (production) 1.24 KB (0%)
import { useQuery } from "dist/react/index.js" 5.32 KB (0%)
import { useQuery } from "dist/react/index.js" (production) 4.39 KB (0%)
import { useLazyQuery } from "dist/react/index.js" 5.6 KB (0%)
import { useLazyQuery } from "dist/react/index.js" (production) 4.67 KB (0%)
import { useMutation } from "dist/react/index.js" 3.59 KB (0%)
import { useMutation } from "dist/react/index.js" (production) 2.81 KB (0%)
import { useSubscription } from "dist/react/index.js" 3.23 KB (0%)
import { useSubscription } from "dist/react/index.js" (production) 2.43 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js" 5.47 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js" (production) 4.12 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js" 4.98 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js" (production) 3.63 KB (0%)
import { useLoadableQuery } from "dist/react/index.js" 5.04 KB (0%)
import { useLoadableQuery } from "dist/react/index.js" (production) 3.69 KB (0%)
import { useReadQuery } from "dist/react/index.js" 3.35 KB (0%)
import { useReadQuery } from "dist/react/index.js" (production) 3.3 KB (0%)
import { useFragment } from "dist/react/index.js" 2.32 KB (0%)
import { useFragment } from "dist/react/index.js" (production) 2.27 KB (0%)

Copy link

netlify bot commented Jun 11, 2024

Deploy Preview for apollo-client-docs ready!

Name Link
🔨 Latest commit 92246c6
🔍 Latest deploy log https://app.netlify.com/sites/apollo-client-docs/deploys/668434e7ace601000821d785
😎 Deploy Preview https://deploy-preview-11890--apollo-client-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Comment on lines -3593 to -3599
await waitFor(
() => {
expect(result.current.loading).toBe(false);
},
{ interval: 1 }
);
expect(result.current.data).toBe(undefined);
Copy link
Member Author

@phryneas phryneas Jun 12, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This behaviour is flaky, as it is equal to

       waitFor(
        () => {
          expect(result.current.loading).toBe(false);
        },
        { interval: 1 }
      ).then(() => {
        expect(result.current.error).toBeInstanceOf(ApolloError);
        expect(result.current.error!.message).toBe("error 1");
      })

Which means that there is an asynchronous tick between expect(result.current.loading).toBe(false); and expect(result.current.error).toBeInstanceOf(ApolloError);.

During that time frame, the hook could rerender and reassign result.current with the next result.

@phryneas phryneas marked this pull request as ready for review June 12, 2024 13:52
Copy link
Member

@jerelmiller jerelmiller left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I didn't look through every single line of the useQuery tests as they mostly looked the same, but I trust those tests are pretty 1:1 with the original checks.

Really awesome to see a lot of these switched over to the profiler! It cleans up so much of those tests. Thanks for doing this! I really only had one comment about using our existing helper to disable act warnings, but otherwise this looks good.

@@ -0,0 +1,8 @@
export function skipActWarnings(mockCalls: any[][]) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We already have a disableActWarnings helper that uses the official recommendation for disabling acting warnings. Can we use that instead?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sure! Better to not log any act warnings than to filter them out later :)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

6a0c3a6 - does this work for you? :)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great!

@@ -1992,6 +1968,7 @@ This is pure coincidence though, and the useQuery rewrite that doesn't break the

await expect(ProfiledHook).not.toRerender({ timeout: 50 });

// TODO rarely seeing 3 here (also old `useQuery` implementation)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think I'm a tad confused by the comment. Are you saying that sometimes this flakes because requestSpy is called 3 times instead of 2 so we should investigate further? And at this point we haven't merged in the useQuery refactor correct? What is the "old useQuery implementation" here?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, we see this called 3 times and should keep investigating it separately.
I happens extremely rarely in both implementations, so in the current useQuery implementation, and in the rewrite branch (that already has these tests merged in).
I was writing these tests in both braches in parallel, so the timeline might be confusing here :)

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Got it! Thanks for the context.

FWIW I have seen this flake out a couple times on main since I added this comment, so I can at least understand where this comes from. Thanks!

@phryneas phryneas force-pushed the pr/stabilize-useQuery-tests branch from 9715d86 to 6a0c3a6 Compare July 2, 2024 09:55
Copy link
Member

@jerelmiller jerelmiller left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Love seeing more and more usage of the profiling tools. Thanks for taking this on!

@github-actions github-actions bot added the auto-cleanup 🤖 label Jul 2, 2024
@phryneas phryneas merged commit 1a9c68a into main Jul 2, 2024
35 of 36 checks passed
@phryneas phryneas deleted the pr/stabilize-useQuery-tests branch July 2, 2024 17:17
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 2, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants