Is @defer supported on non root field with schema stitching?

[tandrup]

I'm struggling to make @defer work together with schema stitching.

I did this simple server to show the issue:

import { createYoga } from 'graphql-yoga';
import { useDeferStream } from '@graphql-yoga/plugin-defer-stream';
import { stitchSchemas } from '@graphql-tools/stitch'
import { makeExecutableSchema } from '@graphql-tools/schema'

const typeDefs = /* GraphQL */ `
  type Query {
    fastField: String!
    slowField: String
    something: Something
  }

  type Something {
    fastField: String!
    slowField: String
  }
`;

const resolvers = {
  Query: {
    fastField: () => 'I am speed',
    slowField: () => new Promise(resolve => setTimeout(() => resolve('I am slow'), 2000)),
    something: () => ({}),
  },
  Something: {
    fastField: () => 'I am speed',
    slowField: () => new Promise(resolve => setTimeout(() => resolve('I am slow'), 2000)),
  },
};

const schema1 = makeExecutableSchema({typeDefs, resolvers});

const gatewaySchema = stitchSchemas({
  subschemas: [schema1]
})

export const yoga = createYoga({
  schema: gatewaySchema,
  plugins: [useDeferStream()],
});

When I query root fields like:

query {
  fastField
  ... @defer {
    slowField
  }
}

Then it works fine. I get the fast field first and a bit later the slow field. But when I try the same on a nested field:

query {
  something {
    fastField
    ... @defer {
      slowField
    }
  }
}

It waits for the slowField to finish before it returns data. Looking at the traffic it does multiple parts. But they are all send at the same time:

---
Content-Type: application/json; charset=utf-8
Content-Length: 64

{"data":{"something":{"fastField":"I am speed"}},"hasNext":true}
---
Content-Type: application/json; charset=utf-8
Content-Length: 89

{"incremental":[{"data":{"slowField":"I am slow"},"path":["something"]}],"hasNext":false}
-----

Is that expected or am I doing something wrong?

[ardatan]

@defer is not forwarded to the services. So only if the field is fetched from another service, it will be deferred.

[tandrup]

Thanks for clarifying @ardatan. Makes sense. Unfortunately when I try to split the fast and slow fields in two subschemas like this:

import { createYoga } from 'graphql-yoga';
import { makeExecutableSchema } from '@graphql-tools/schema';
import { stitchSchemas } from '@graphql-tools/stitch';
import { useDeferStream } from '@graphql-yoga/plugin-defer-stream';

const fastSchema = makeExecutableSchema({
  typeDefs: /* GraphQL */ `
    type Query {
      fastField: String!
      something: Something
    }

    type Something {
      id: ID!
      fastField: String!
    }
  `,
  resolvers: {
    Query: {
      fastField: () => 'I am speed',
      something: () => ({ id: '1' }),
    },
    Something: {
      fastField: () => 'I am speed',
    },
  },
});

const slowSchema = makeExecutableSchema({
  typeDefs: /* GraphQL */ `
    type Query {
      slowField: String
      slowSomethingById(id: ID!): Something
    }

    type Something {
      slowField: String
    }
  `,
  resolvers: {
    Query: {
      slowField: () => new Promise(resolve => setTimeout(() => resolve('I am slow'), 2000)),
      slowSomethingById: () => ({}),
    },
    Something: {
      slowField: () => new Promise(resolve => setTimeout(() => resolve('I am slow'), 2000)),
    },
  },
});

const gatewaySchema = stitchSchemas({
  subschemas: [
    fastSchema,
    {
      schema: slowSchema,
      merge: {
        Something: {
          fieldName: 'slowSomethingById',
          selectionSet: '{ id }',
          args: originalObject => ({ id: originalObject.id }),
        },
      },
    },
  ],
});

export const yoga = createYoga({
  schema: gatewaySchema,
  plugins: [useDeferStream()],
});

I still need to wait for the slow subschema to return before I get any data.

Is there a different way I can stitch the subschemas together so it will return data from the fast subschema first?

[ardatan]

I can't say much without a reproduction on CodeSandbox.

[tandrup]

@ardatan Tried to do a reproduce here: https://codesandbox.io/p/sandbox/defer-schema-stitching-zmpl86