relay: [Modern] ConnectionHandler can't get connection
Hi folks, yesterday I noticed a strange behavior in my project: somehow my removal mutations stopped working. I couldn’t identify the reason of this, neither did any changes in this part of the project.
Here’s my mutation:
import { commitMutation, graphql } from 'react-relay'
import { ConnectionHandler } from 'relay-runtime'
const mutation = graphql`
mutation UserRemoveMutation($input: UserRemoveInput!) {
UserRemove(input: $input) {
deletedID
error
}
}
`
function sharedUpdater (store, viewer, deletedID) {
const viewerProxy = store.get(viewer.id)
const conn = ConnectionHandler.getConnection(
viewerProxy,
'list_users'
)
ConnectionHandler.deleteNode(
conn,
deletedID
)
}
function commit (environment, user, viewer, config) {
return commitMutation(
environment,
{
mutation,
variables: {
input: {
id: user.id
}
},
updater: (store) => {
const payload = store.getRootField('UserRemove')
const deletedID = payload.getValue('deletedID')
sharedUpdater(store, viewer, deletedID)
},
optimisticUpdater: (store) => {
sharedUpdater(store, viewer, user.id)
},
onCompleted: config.onCompleted,
onError: config.onError
}
)
}
export default {commit}
And here’s the error:

If I console.log
the const conn
, it returns me null
. I’ve checked my fragment and the @connection
is correct:
viewer: graphql`
fragment users_list_datatalist_viewer on Viewer {
id
users(first: $first, search: $search) @connection(key: "list_users") {
edges {
node {
id
name
email
}
}
pageInfo {
hasNextPage
}
}
}
`
Am I doing something wrong?
Thanks!
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Reactions: 2
- Comments: 20 (8 by maintainers)
My guess is that you should do one of these:
or:
Just a note:
@connection(key: "list_users", filters: [])
means: store the data regardless of the value ofsearch
– this could cause a potential problem if there are two components/views sharing the same connection and when the second view fetches the connection withsearch: "foo"
, it will overwrite the data fetched withsearch: bar
in the first view.const storeRoot = store.getRoot(); const connection = ConnectionHandler.getConnection(storeRoot, ‘Comments_results’);
I think you need to use your storeRoot, instead of this.props.viewerId