facebook / facebook/relay

Hooks - Suspended `useFragment` component not throwing underlying fetchQuery error

Open
#3,418 9 comments 5 reactions 0 assignees View on GitHub
Dominant language
Rust
Stars
19k
Forks
1.9k
PR merge metrics
No merged PRs in 30d

Description

Say I have a container component which just spreads fragments (i.e., does not suspend):

```js
function Container() {
const data = useLazyLoadQuery(graphql`
query ContainerQuery {
...Component_data
}
`);
return ;
}
```

And then a fragment component:

```js
function Component(props) {
const {viewer} = useFragment(
graphql`
fragment Component_data on Query {
viewer { id }
}
`,
props.data
);
return viewer.id;
}
```

When `Component` is rendered, it suspends correctly, however if the `fetchQuery` promise for `ContainerQuery` rejects with an error, instead of that error being propagated from the `useFragment` callsite, the `useFragment` returns an empty dataset (e.g. `viewer` is `undefined` above).

There are two issues here:
- The `fetchQuery` error is silently ignored.
- The return value of `useFragment` does not match its flow type (`viewer` is not nullable).

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.