How to convert RelayJS connection to plain array?

Question

There is a component UserListWidget with following container definition:

fragments: {
  users: () => Relay.QL`
    fragment on User @relay(plural: true) {
        id
        displayName
    }
  `
}

There is also parent component that needs to render connection of users as plain list. But following won't work:

<UserListWidget users={userConnection.edges.map(edge => edge.node)} />

It fails with error:

Invariant Violation: RelayContainer: Invalid prop `users` supplied to `UserListWidget`, expected element at index 0 to have query data.

Changing UserListWidget to accept userConnection instead of plain list of users is not an option, because it is a generic component and other parent components will only provide lists of users, not connections.

So I guess there should be a way to treat connection as plain list of nodes somehow?

Answer 1

This error can occur if the parent component doesn't include the child fragment. Does the parent include userConnection(...) { edges { node { ${UserListWidget.getFragment('users')} } } }?