Relay Modern - How to use fetchQuery without fragmentContainer

Question

so I am working on relay for react application with server side rendering. I'm trying to use relay to get data from graphql endpoint.

I was kinda following this, using fetchQuery to get data by making request from compiled graphql by relay-compiler.

e.g.

import { graphql, fetchQuery } from 'react-relay'

const query = graphql`
   query SomeQuery($id: ID) {
      author(id: $id) {
         name
         ...SomeFragment_authorData
      }
   }
`

const variables = { "id" : "1f" };

fetchQuery(env, query, variables)
   .then((jsonData) => { console.log(jsonData); })

when it finishes running, it gives me some sort of this object:

{
  author: {
    __fragment: { ... }
    ...
  }
}

Which I assume will be used by children components wrapped with createFragmentContainer() to get the real data.

Since I'm not using createFragmentContainer(), I'm not sure how to get the data properly, is there any way to transform above response into the real data? any help would be appreciated!

Note:

At the moment this is what I do to get the data: env._network.fetch(query(), variables). It is working, but it doesn't seem right that I need to dig into private variable, in order to get the fetch that I provided to Network object.

Answer 1

You need to add a relay directive to your fragment spread: ...SomeFragment_authorData @relay(mask: false)

Answer 2

you can use relay environment and relay-runtime utils.

import {
  createOperationDescriptor,
  getRequest,
} from 'relay-runtime';


const request = getRequest(query);
const operation = createOperationDescriptor(request, variables);
environment.execute({ operation }).toPromise();