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

add ignoreResults option to useSubscription #11921

Merged
merged 11 commits into from
Jul 8, 2024

Conversation

phryneas
Copy link
Member

@phryneas phryneas commented Jul 3, 2024

Resolves #10216

Copy link

changeset-bot bot commented Jul 3, 2024

🦋 Changeset detected

Latest commit: 03c9739

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@apollo/client Patch

Not sure what this means? Click here to learn what changesets are.

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

Copy link
Contributor

github-actions bot commented Jul 3, 2024

size-limit report 📦

Path Size
dist/apollo-client.min.cjs 39.08 KB (+0.12% 🔺)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" 47.77 KB (+0.09% 🔺)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" (production) 45.33 KB (+0.1% 🔺)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" 34.27 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" (production) 32.13 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.23 KB (0%)
import { useQuery } from "dist/react/index.js" (production) 4.31 KB (0%)
import { useLazyQuery } from "dist/react/index.js" 5.71 KB (0%)
import { useLazyQuery } from "dist/react/index.js" (production) 4.79 KB (0%)
import { useMutation } from "dist/react/index.js" 3.62 KB (0%)
import { useMutation } from "dist/react/index.js" (production) 2.84 KB (0%)
import { useSubscription } from "dist/react/index.js" 3.77 KB (+1.05% 🔺)
import { useSubscription } from "dist/react/index.js" (production) 2.91 KB (+1.23% 🔺)
import { useSuspenseQuery } from "dist/react/index.js" 5.49 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js" (production) 4.15 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js" 4.99 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js" (production) 3.64 KB (0%)
import { useLoadableQuery } from "dist/react/index.js" 5.07 KB (0%)
import { useLoadableQuery } from "dist/react/index.js" (production) 3.72 KB (0%)
import { useReadQuery } from "dist/react/index.js" 3.39 KB (0%)
import { useReadQuery } from "dist/react/index.js" (production) 3.33 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 Jul 3, 2024

Deploy Preview for apollo-client-docs ready!

Name Link
🔨 Latest commit 03c9739
🔍 Latest deploy log https://app.netlify.com/sites/apollo-client-docs/deploys/668bc4523ae2670008ec2c5f
😎 Deploy Preview https://deploy-preview-11921--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.

@phryneas phryneas added this to the 3.11.0 milestone Jul 4, 2024
@phryneas phryneas linked an issue Jul 4, 2024 that may be closed by this pull request
@phryneas phryneas self-assigned this Jul 4, 2024
@phryneas phryneas marked this pull request as ready for review July 4, 2024 10:22
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 had some minor feedback on some of the test structure, but nothing blocking. Thanks for adding this!

src/react/types/types.documentation.ts Outdated Show resolved Hide resolved
Comment on lines +1145 to +1149
const onData = jest.fn((() => {}) as SubscriptionHookOptions["onData"]);
const onError = jest.fn((() => {}) as SubscriptionHookOptions["onError"]);
const onComplete = jest.fn(
(() => {}) as SubscriptionHookOptions["onComplete"]
);
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
const onData = jest.fn((() => {}) as SubscriptionHookOptions["onData"]);
const onError = jest.fn((() => {}) as SubscriptionHookOptions["onError"]);
const onComplete = jest.fn(
(() => {}) as SubscriptionHookOptions["onComplete"]
);
const onData = jest.fn();
const onError = jest.fn();
const onComplete = jest.fn();

Out of curiosity, are these casts needed? I'm able to remove this entirely and see no type errors. If you're using this to convey intent, feel free to ignore this comment.

(this suggestion applies to any place with these mocks, but I'll avoid adding this comment to the other locations)

Copy link
Member Author

@phryneas phryneas Jul 8, 2024

Choose a reason for hiding this comment

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

It's for test-writing DX. If you hover onData further down in the test to get a feeling what you should assert on, you either get any, or with this the right type.

Comment on lines 1175 to 1180
expect(onData.mock.lastCall?.[0].data).toStrictEqual({
data: results[0].result.data,
error: undefined,
loading: false,
variables: undefined,
});
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
expect(onData.mock.lastCall?.[0].data).toStrictEqual({
data: results[0].result.data,
error: undefined,
loading: false,
variables: undefined,
});
expect(onData).toHaveBeenLastCalledWith(
expect.objectContaining({
data: {
data: results[0].result.data,
error: undefined,
loading: false,
variables: undefined,
},
})
);

[nit] As a readability thing, it would be great if we could structure this using the expect helpers (toHaveBeenLastCalledWith) rather than trying to directly read from mock directly. I think you were looking to avoid checking against every property passed to that first argument, so perhaps using expect.objectContaining can also get around that. I'm able to get the test to pass the same structuring it this way. This also makes it clear to the reader that there are more properties passed to this argument that we aren't checking as a part of this test 🙂

(this suggestion applies to any location with .mocks.lastCall, so I'll avoid adding this to each place)

Copy link
Member Author

Choose a reason for hiding this comment

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

Fair enough - I think I had tried that before, but probably missed something :)

Copy link
Member Author

Choose a reason for hiding this comment

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

variables: undefined,
});
// `onData` should not be called again for the same result
expect(onData).toHaveBeenCalledTimes(1);
Copy link
Member

Choose a reason for hiding this comment

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

Could you perhaps add one this assertion before the rerender call as well? This confused me at first because the last time you assert on the number of calls, its checking against 0, so it sort of looks like this function was called after you switch from ignoreResults true -> false. Adding the assertion before rerender makes this obvious that this count didn't increase as a result of rerendering the component and changing the ignoreResults option.

Copy link
Member Author

Choose a reason for hiding this comment

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

expect(onData).toHaveBeenCalledTimes(2);
}
// a second subscription should not have been started
expect(subscriptionCreated).toHaveBeenCalledTimes(1);
Copy link
Member

Choose a reason for hiding this comment

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

👨‍🍳 💋

loading: false,
error: undefined,
// switching back to the default `ignoreResults: true` return value
data: undefined,
Copy link
Member

Choose a reason for hiding this comment

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

If we return undefined when switching to ignoreResults: true rather than returning the result up to this point, we might want to make this clear in the docs somehow so that someone doesn't expect to continue getting a value here.

FWIW I think this is reasonable behavior since ignoreResults: true is a signifier that you don't care about the value returned from the hook, but I just think adding the extra clarification will help avoid confusion.

Copy link
Member Author

@phryneas phryneas Jul 8, 2024

Choose a reason for hiding this comment

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

@phryneas phryneas force-pushed the pr/useSubscription-ignoreResults branch from d82c489 to cc41b89 Compare July 8, 2024 10:33
@phryneas phryneas merged commit 70406bf into release-3.11 Jul 8, 2024
42 checks passed
@phryneas phryneas deleted the pr/useSubscription-ignoreResults branch July 8, 2024 11:04
@github-actions github-actions bot mentioned this pull request Jul 9, 2024
@github-actions github-actions bot mentioned this pull request Jul 22, 2024
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 8, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add an ignoreResults option to the useSubscription API
2 participants