Resolving the "Abstract type N must be an Object type at runtime" error in GraphQL Server Union Types

Question

Resolving the "Abstract type N must be an Object type at runtime" error in GraphQL Server Union Types

Given a unique GraphQL union return type:

union GetUserProfileOrDatabaseInfo = UserProfile | DatabaseInfo

meant to be returned by a specific resolver:

type Query {
  getUserData: GetUserProfileOrDatabaseInfo!
}

I am encountering warnings and errors related to the __resolveType or __isTypeOf function:

The abstract type M must resolve to an Object type at runtime for field Query.getUserData with value { ..., __isTypeOf: [function __isTypeOf] }, received "undefined". Either the M type should provide a "resolveType" function or each possible type should provide an "isTypeOf" function.'

After extensive research on GitHub issues and Stack Overflow questions, I have yet to find a solution to fix this error.

Implementing __resolveType or __isTypeOf in my resolvers has been unsuccessful:

export const Query = {
  getUserData: (parent, args, context: IContext, info) => {
    return {
      __isTypeOf(obj) { // OR __resolveType, none of them work
        return `UserProfile`;
      },
      data: []
    };
  },
};

typescript graphql

Answer 1

Answer №1

After struggling with implementing __resolveType or __isTypeOf in my resolvers, I finally found a solution by directly adding the __typename into the resolver return Object to resolve the issue.

In the implementation of the getBankAccounts resolver:

async getBankAccounts(): GetBankAccountsResponseOrUserInputRequest {
    if (shouldGetUserInputRequest()) {
      return {
        __typename: "UserInputRequest",
        ...response,
      };
    }

    return {
      __typename: "GetAccountsResponse",
      accounts,
    };
  }

I hope this solution can be useful for someone facing a similar challenge.

Answer 2

After struggling with implementing __resolveType or __isTypeOf in my resolvers, I finally found a solution by directly adding the __typename into the resolver return Object to resolve the issue.

In the implementation of the getBankAccounts resolver:

async getBankAccounts(): GetBankAccountsResponseOrUserInputRequest {
    if (shouldGetUserInputRequest()) {
      return {
        __typename: "UserInputRequest",
        ...response,
      };
    }

    return {
      __typename: "GetAccountsResponse",
      accounts,
    };
  }

I hope this solution can be useful for someone facing a similar challenge.

Answer 3

Answer №2

Your resolver map is not configured correctly.

When passing the resolver map to ApolloServer (or makeExecutableSchema), it should be an object with keys representing type names in your schema. Each key should map to another object with field names on that type, each mapping to a resolver function.

const resolvers = {
  SomeType: {
    someField: (parent, args, context, info) => { ... },
  },
}

The same resolver map is used for providing the resolveType function for unions or interfaces. The structure remains similar, but the key becomes __resolveType and corresponds to the union or interface's name:

const resolvers = {
  SomeType: {
    someField: (parent, args, context, info) => { ... },
  },
  SomeUnion: {
    __resolveType: (parent) => { ... },
  }
}

The resolveType function must return a string matching an existing object type in your schema.

If you opt for __isTypeOf over __resolveType, note that isTypeOf is specific to an object type and not the interface or union itself. Refer to the docs for clarity. In this case, the resolver map looks like:

const resolvers = {
  SomeType: {
    someField: (parent, args, context, info) => { ... },
    __isTypeOf: (parent) => { ... },
  },
}

__isTypeOf should always return either true or false, confirming if the passed object matches the type.

Choose between __resolveType or __isTypeOf; using the latter requires adding it to every possible object type in the union or interface.

Answer 4

Your resolver map is not configured correctly.

When passing the resolver map to ApolloServer (or makeExecutableSchema), it should be an object with keys representing type names in your schema. Each key should map to another object with field names on that type, each mapping to a resolver function.

const resolvers = {
  SomeType: {
    someField: (parent, args, context, info) => { ... },
  },
}

The same resolver map is used for providing the resolveType function for unions or interfaces. The structure remains similar, but the key becomes __resolveType and corresponds to the union or interface's name:

const resolvers = {
  SomeType: {
    someField: (parent, args, context, info) => { ... },
  },
  SomeUnion: {
    __resolveType: (parent) => { ... },
  }
}

The resolveType function must return a string matching an existing object type in your schema.

If you opt for __isTypeOf over __resolveType, note that isTypeOf is specific to an object type and not the interface or union itself. Refer to the docs for clarity. In this case, the resolver map looks like:

const resolvers = {
  SomeType: {
    someField: (parent, args, context, info) => { ... },
    __isTypeOf: (parent) => { ... },
  },
}

__isTypeOf should always return either true or false, confirming if the passed object matches the type.

Choose between __resolveType or __isTypeOf; using the latter requires adding it to every possible object type in the union or interface.

Resolving the "Abstract type N must be an Object type at runtime" error in GraphQL Server Union Types

Answer №1

Answer №2

Similar questions

Unable to utilize Google Storage within a TypeScript environment

Issue encountered while deploying Next.js application on vercel using the replaceAll function

Using TypeScript 4.1, React, and Material-UI, the className attribute does not support the CSSProperties type

React: The Material-UI autocomplete input, controlled with the React Hook Form `<controller>` component, experiences issues when the `multiple` prop is set to `true`

What is the best way to trim a string property of an object within an array?

Creating objects based on interfaces in TypeScript is a common practice. This process involves defining

Tips for modifying the JSON format within a Spring and Angular project

Is it possible to verify if the @Output is correctly wired up within an Angular component?

Utilize the identical element

Different ways to reference a variable in Typescript without relying on the keyword "this" throughout the codebase

Improving my solution with PrimeNG in Angular2 - fixing the undefined tag error

Error encountered while compiling an Asp.Net Core project due to exceeding the maximum allowable path length in the

Who is the intended audience for the "engines" field in an npm package - consumers or developers?

Implementing pagination within an Angular 11 Mat-table with grouping feature

What is the process for including a new item in the p-breadcrumb list?

The Context API's `useContext` hook appears to be malfunctioning, persistently

Make sure to include a property that is indexed when typing

Tips for accurately typing a "Type Mapping" function

Checking the formik field with an array of objects through Yup for validation

Troubleshooting common issues while setting up React Native with TypeScript