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

A reactive object inside a context of useLazyQuery — looped queries #1497

Open
demershov opened this issue Aug 10, 2023 · 0 comments
Open

Comments

@demershov
Copy link

demershov commented Aug 10, 2023

Describe the bug
If you specify a reactive object for the useLazyQuery context, then if the context changes (prop of reactive object) inside the ApolloLink (specifically inside the forward function), the request will be sent again and again until the reactive data will be the same as the previous request.
It seems to me that this is erroneous behavior, because it's not variables for a graphql query.

To Reproduce
There is no simple solution to measuring the time of all graphql operations (Maybe there is, but I haven't found it).
The most trivial way to do this is to add await load() to useLazyQuery and measure time before and after its call. But i decided to use ApolloLink instead.

Steps to reproduce the behavior:

  1. In a vue component
const time = reactive({ start: 0, end: 0 });

const { load } = useLazyQuery(
    GET_SEARCH_RESULTS,
    null,
    {
        context: {
            time,
        },
    }
);
  1. In the ApolloLink
const timeLink = new ApolloLink((operation, forward) => {
    operation.setContext((prevContext) => {
        prevContext.time.start = performance.now();

        console.log(prevContext);
        return prevContext;
    });

    return forward(operation).map((data) => {
        operation.setContext((prevContext) => {
            // After this line, requests will be constantly sent
            prevContext.time.end = performance.now();

            console.log(operation.getContext());
            return prevContext;
        });

        return data;
    });
});
  1. call load function of useLazyQuery

Expected behavior
I expected that changing the reactive context would not result in new and new queries if it is changed.

Versions
vue: 3.3.4
@vue/apollo-composable: 4.0.0-beta.8
@apollo/client: 3.8.0

Additional context
Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant