apollographql / apollo-client-devtools

Apollo Client browser developer tools.
https://apollographql.com/docs/react/development-testing/developer-tooling/#apollo-client-devtools
MIT License
1.5k stars 166 forks source link

When executing a @client query, result is not filtered to the selection set #477

Open vigie opened 3 years ago

vigie commented 3 years ago

Intended outcome: Execute a @client query against local resolvers from GraphiQL and see in the result only the fields asked for in the query.

Actual outcome: The entire object as returned by the local resolver is displayed

How to reproduce the issue:

Create a local resolver to implement

type Query {
   foo: Bar
}

type Bar {
   a: int
   b: int
}

Execute query in GraphiQL

query {
   foo {
      a
   }
}

You will see both a and b fields returned in the result pane, instead of just a.

Note that the Apollo client itself does not suffer from this problem - that is, in code the result emitted by the observable will be correctly filtered based on the selection set.

This issue makes giving demos/trainings to show the flexible nature of GQL particularly frustrating.

Desktop (please complete the following information):

hwillson commented 3 years ago

Thanks @vigie - any chance you could put together a small runnable reproduction that demonstrates this?

hwillson commented 3 years ago

We haven't heard back about a reproduction, so I'll close this for now (happy to re-open if anyone can provide a small runnable repro). Thanks!

vigie commented 3 years ago

Sorry for the delay, I was on parental leave.

Here is a simple repo https://github.com/vigie/react-apollo-error-template

Let me know if you need more context. From the commit message of the above fork:

In Apollo dev tools, notice that the result of executing the following query includes people id, even though it was not asked for

query AllPeople {
  people @client {
    name
  }
}

However, put a breakpoint on line 19 of App.js and notice that the apollo client itself is correctly filtering out data not requested before returning it to the caller.

Apollo dev tools should do the same in its GraphiQL tab.

vigie commented 3 years ago

Here is a screenshot of the problem as I see it, using the above repo:

Screen Shot 2021-05-03 at 5 47 44 PM

@hwillson can this be reopened for investigation now?

vigie commented 3 years ago

Compare the above with the correct behavior of Apollo Client as inspected by Chrome debugger:

Screen Shot 2021-05-03 at 5 53 39 PM

vigie commented 3 years ago

Now that I've added the required info, can this at least be re-opened for tracking purposes @hwillson ?

hwillson commented 3 years ago

@vigie sorry about that, re-opening. Thanks for the repro!

vigie commented 2 years ago

I'd like to have a go at fixing this, @hwillson if you have any suspicions about the cause please let me know, thanks

MrDoomBringer commented 2 years ago

Hi @vigie ! From my local testing, it's looking like this issue has been resolved with the Apollo Studio integration introduced in DevTools 4.0.0. Are you still experiencing the issue? If not, I'll be happy to close this within a few days.

All the best, Emmanuel :-)

image Now matches the data result in the Chrome Debugger image

vigie commented 2 years ago

Hi @MrDoomBringer

If you uncheck the "load from cache" option, you'll find that the issue still exists. Thanks for investigating.