Relay and ReactJS give an error when connecting to Github's GraphQL

Question

Using a Relay Container and Github's GraphQL API if I have fragment on User { id } it successfully loads my github account id . However if I try fragment on Repository {} it says "GraphQL unknown type".

What is the best way to reliably query fragments from GitHub's API using Relay?

Answer 1

I was getting the error because graphQL has specific properties accessible to the client. Trying to fetch an erroneous fragment (or in my case incorrectly nested fragment names) results in "GraphQL unknown type". The solution is to use Github's GraphQL root node called relay which re-exposes all root queries such as repository see the docs for more details. Here is my parent query:

import Relay from 'react-relay'

export default {
  relay : Component => Relay.QL `
    query {
      relay {
        ${Component.getFragment('relay')}
      }
    }
  `
};

and here is my container component

import Relay from 'react-relay'
import App from './AppComponent'

export default Relay.createContainer(App, {
  initialVariables: {
    owner: "rails",
    name: "rails",
    count: 10
  },
  fragments: {
    relay: () => Relay.QL `
      fragment on Query {
        repository(owner: $owner, name: $name) {
          name
          owner
          description
          issues(first: 20) {
            edges {
              node {
                title
              }
            }
          }
        }
      }`
  }
});