react-apollo swallows render errors of wrapped components

[bessey]

Steps to Reproduce

My case is produced as follows:

• Have a component that will raise an error in its render(), when a query is complete e.g.

render () {
  let {loading} = this.props.data 
  return (
    { loading ? null : <RealComponent blah={this.thisMethodIsntReal()} /> }
  )
}

• Wrap it with the graphql HOC (import { graphql } from 'react-apollo')

Note that I haven't tried simplifying this test case and its possible less setup is required.

Buggy Behavior

Rather than raising this.thisMethodIsntReal is not a function, Apollo catches the error, and passes it into the component as data, wiping out the actual data returned from the query. In doing so it (likely) causes a different obscure error in your component, because the component depended on the now missing data.

Here's my example with a debugger in render() to show the contents of this.props.data

Expected Behavior

Apollo should not catch errors it did not cause, this error should propagate to the console and so the second state, with no data, should never be reached.

Version

• [email protected]
• [email protected]

[tmeasday]

Thanks @bessey. This is an issue a few have run into, thanks for the simple repro.

[bessey]

This is my current workaround, which may be helpful to others. I wrap components in a HOC that doesn't swallow the error so its apollo(throwApolloError(component))

https://gist.github.com/bessey/926cdb3e383b406e7f546c6f4dd55a8a

[tmeasday]

I think this should be fixed by [email protected]. Can you give it a try and let me know?

[bessey]

It is indeed. Thanks!

…

On Thu, 1 Dec 2016 at 19:02 Tom Coleman ***@***.***> wrote: I think this should be fixed by ***@***.*** Can you give it a try and let me know? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#347 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AArOaHGLr40CPCi2wOUnXYBCqM88P4eoks5rD4pZgaJpZM4K_feH> .