Unable to handle errors in local state management

Intended outcome:

The following @client only query:

const GET_COUNT = gql`
  query GetCount {
    count @client
  }
`;

<Query query={GET_COUNT}>
  {({ loading, error, data }) => {
    if (loading) {
      return <p>Loading GET_COUNT query</p>;
    }
    if (error) {
      return <p>An error ocurred: {error.message}</p>;
    }
    return <p>Page ready</p>
  }}
</Query>

Should be capable of handling an error returned by the resolver:

const resolvers = {
  Query: {
    count() {
      throw new Error('Oh no!')
    }
  }
};

Actual outcome:

The query renders again with error set with the thrown error, but it renders again immediately after with error as undefined, so It’s not possible to actually handle the error.

How to reproduce the issue:

I created a repo showing the error, which also shows a error with apollo dev tools: https://github.com/lfades/apollo-state-issue. It’s important to notice that I’m not using a GraphQL backend and just using local state management.

Versions

Check the versions in the repo 🙏

Thank you.

[ryaninvents]

I’m encountering the same issue. If I understand correctly, the fix would be to add a catch to this promise continuation. Let me know if a PR would be welcome on this; I’d be happy to contribute.

If there were a documented method for writing errors directly to the cache, that could be a feasible short-term workaround.

[boennemann]

Hey all,

For any production application missing error handling is a total blocker. With the present behavior it’s impossible to use local state management at all.

Is there any update, or a work around for this? Or maybe a pointer on where one would start working on a fix?

Thanks, Stephan

Edit: For anyone else coming here: Moving back to https://github.com/apollographql/apollo-link-state works.