Using refetchQueries with variables causes "Unhandled Rejection (Error): Response not successful: Received status code 500"

[SubZane]

So when adding a new user I need to refetcha query, and that query requires a variable called productteam_id.

When running it the mutate call works but the refetchQueries crashes.
Running the queries and mutate calls in the playground works just fine. Also, adding a different query for the refetchQueries that doesn't require variables, works fine as well. But as soon as I add variables it crashes.

The errors

POST http://localhost:4000/ 500 (Internal Server Error)
createHttpLink.ts:146


Unhandled Rejection (Error): Response not successful: Received status code 500
index.ts:49 Uncaught (in promise) Error: Response not successful: Received status code 500
    at new ApolloError (index.ts:49)
    at QueryManager.ts:893
    at asyncMap.ts:22
    at new Promise (<anonymous>)
    at Object.error (asyncMap.ts:22)
    at notifySubscription (Observable.js:140)
    at onNotify (Observable.js:179)
    at SubscriptionObserver.error (Observable.js:240)
    at iteration.ts:13
    at Array.forEach (<anonymous>)
    at iterateObserversSafely (iteration.ts:13)
    at Object.error (Concast.ts:185)
    at notifySubscription (Observable.js:140)
    at onNotify (Observable.js:179)
    at SubscriptionObserver.error (Observable.js:240)
    at notifySubscription (Observable.js:140)
    at onNotify (Observable.js:179)
    at SubscriptionObserver.error (Observable.js:240)
    at createHttpLink.ts:196

My mutate call

const { mutate: AddUserToProductTeam, error: addUserError, data: addUserConnection, loading: addUserIsLoading } = useAddUserToProductTeam(product_id)

AddUserToProductTeam({ variables: { productteam_id: payload.product_id, user_id: payload.user_id, role_id: payload.role_id } })

My file handling the assUser method

export const ADD_USER = gql`
	mutation AddUser($productteam_id: Int!, $user_id: Int!, $role_id: Int!) {
		addUserToProductTeam(productteam_id: $productteam_id, user_id: $user_id, role_id: $role_id) {
			success
			productteam_relation_id
		}
	}
`

export function useAddUserToProductTeam(productteam_id: string) {
	const [mutate, { data, error, loading }] = useMutation<AddUser, AddUserVariables>(ADD_USER, {
		refetchQueries: [{ query: GET_USERS_IN_PRODUCTTEAM, variables: { productteam_id: productteam_id } }],
	})
	return { mutate, data, error, loading }
}

export const GET_USERS_IN_PRODUCTTEAM = gql`
	query GetUsersInProductTeam($productteam_id: Int!) {
		Users(productteam_id: $productteam_id) {
			id
			username
			first_name
			last_name
			email
			product_teams {
				productteam_relation_id
				role {
					id
					name
				}
			}
		}
	}
`

Versions

  System:
    OS: macOS 11.1
  Binaries:
    Node: 12.20.1 - ~/.nvm/versions/node/v12.20.1/bin/node
    Yarn: 1.22.5 - /usr/local/bin/yarn
    npm: 6.14.11 - ~/.nvm/versions/node/v12.20.1/bin/npm
  Browsers:
    Chrome: 88.0.4324.192
    Firefox: 83.0
    Safari: 14.0.2
  npmPackages:
    @apollo/client: 3.3.x => 3.3.11 

[SubZane]

Ok, kinda silly but anyway.

JUST after I posted this I decided to try replacing the variables with hard coded numbers and strings and discovered that the error I got was the result of the code expecting a number but receiving a string...

So my bug report here is more that maybe the application shouldn't crash but instead return an error that can be handled...?

[benjamn]

@SubZane I think this might be a bug in the asyncMap function we use internally: #7818. Does that seem plausible?

[SubZane]

Hi, no I currently can't do that. but if that might be the issue then maybe the next release will fix the issues with the error-reporting?

[hwillson]

Let us know if this is still a concern with @apollo/client@latest - thanks!