graphql-request icon indicating copy to clipboard operation
graphql-request copied to clipboard

Response Middleware Issue in Recent Feature Addition

Open minhazfm opened this issue 3 years ago • 1 comments

Hey everyone, not sure if this is something I'm doing, but I am trying to use the latest middleware features referenced here (https://github.com/prisma-labs/graphql-request/pull/170), and not able to trigger the responseMiddleware function (requestMiddleware seems to work fine though). Here's the basic setup of my code:

GraphQL Request Service Hook

export const useGraphQLClient = (): GraphQLClient => {
  const {user} = useAuth();

  const graphQLClient = new GraphQLClient(GRAPHQL_ENDPOINT_AUTH, {
    errorPolicy: 'all',
    requestMiddleware: request => {
      console.log(`Request: ${JSON.stringify(request)}\n`);

      return user && user.isSignedIn && user.credentials.accessToken
        ? {
            ...request,
            headers: {
              ...request.headers,
              authorization: `Bearer ${user.credentials.accessToken}`,
            },
          }
        : request;
    },
    responseMiddleware: response => {
      console.log(`Response: ${JSON.stringify(response)}\n`);
      if (response.errors) {
        console.log(`Errors: ${JSON.stringify(response.errors)}\n`);
      }
    },
  });

  return graphQLClient;
};

Test Query Hook

export const useTestAuth = () => {
  const client = useGraphQLClient();

  return useQuery(
    'test-auth',
    async () => {
      const payload = await client.rawRequest<TestAuthResponse>(
        TEST_AUTH_QUERY,
      );
      return payload.data;
    },
    {enabled: false},
  );
};

As you can see I also set the errorPolicy: "all" and also switched to a rawRequest to see if that would help, but still don't get any of the console logs under the responseMiddleware. Any guidance or help would be very much appreciated here, thank you in advance!

minhazfm avatar Jul 22 '22 03:07 minhazfm

@minhazfm have you tested it with successful queries, or only with queries that failed? I found a section of code that might be missing in the index file to capture the error responses. A quick fix could be to add catches in the following lines, I leave it as a recommendation but I'm not sure if it will be the best solution, because I could be omitting some detail of the intended use of this feature.

.catch((error) => { if (responseMiddleware) { responseMiddleware(error.response) } throw error })

index: line 253 https://github.com/prisma-labs/graphql-request/blob/fec536bee66b370843af6861556908bd07f3a932/src/index.ts#L253 index: line 298 https://github.com/prisma-labs/graphql-request/blob/fec536bee66b370843af6861556908bd07f3a932/src/index.ts#L298 index: line 344 https://github.com/prisma-labs/graphql-request/blob/fec536bee66b370843af6861556908bd07f3a932/src/index.ts#L344

GuidoTapia avatar Aug 02 '22 06:08 GuidoTapia