Abstract type resolution in GraphQL

Introduction

Abstract type resolution helps GraphQL know which specific type to use when a query asks for a general type. It makes sure you get the right data shape.

When you have a query that returns different types under one general category.

When you want to ask for common fields but also get type-specific fields.

When your data has different shapes but shares some common parts.

When you use interfaces or unions in your GraphQL schema.

When you want to handle multiple object types in one query response.

Syntax

GraphQL

interface Animal {
  id: ID!
  name: String!
}

type Dog implements Animal {
  id: ID!
  name: String!
  barkVolume: Int
}

type Cat implements Animal {
  id: ID!
  name: String!
  livesLeft: Int
}

union Pet = Dog | Cat

# Resolver example for interface or union
const resolvers = {
  Animal: {
    __resolveType(obj) {
      if (obj.barkVolume !== undefined) {
        return 'Dog';
      }
      if (obj.livesLeft !== undefined) {
        return 'Cat';
      }
      return null; // GraphQL will error if null
    }
  },
  Pet: {
    __resolveType(obj) {
      if (obj.barkVolume !== undefined) {
        return 'Dog';
      }
      if (obj.livesLeft !== undefined) {
        return 'Cat';
      }
      return null; // GraphQL will error if null
    }
  }
};

The __resolveType function tells GraphQL which concrete type to use.

This is needed for interfaces and unions because they can represent multiple types.

Examples

This example shows how to resolve between Car and Bike when querying Vehicle.

GraphQL

interface Vehicle {
  id: ID!
  make: String!
}

type Car implements Vehicle {
  id: ID!
  make: String!
  doors: Int
}

type Bike implements Vehicle {
  id: ID!
  make: String!
  hasPedals: Boolean
}

const resolvers = {
  Vehicle: {
    __resolveType(obj) {
      if (obj.doors !== undefined) {
        return 'Car';
      }
      if (obj.hasPedals !== undefined) {
        return 'Bike';
      }
      return null; // GraphQL will error if null
    }
  }
};

Here, the union SearchResult can be either Photo or Person, and the resolver picks the right one.

GraphQL

union SearchResult = Photo | Person

const resolvers = {
  SearchResult: {
    __resolveType(obj) {
      if (obj.url) {
        return 'Photo';
      }
      if (obj.name) {
        return 'Person';
      }
      return null; // GraphQL will error if null
    }
  }
};

Sample Program

This program sets up a GraphQL server with an Animal interface. It returns a list of animals that can be Dogs or Cats. The __resolveType function tells GraphQL which type each animal is.

GraphQL

const { ApolloServer, gql } = require('apollo-server');

const typeDefs = gql`
  interface Animal {
    id: ID!
    name: String!
  }

  type Dog implements Animal {
    id: ID!
    name: String!
    barkVolume: Int
  }

  type Cat implements Animal {
    id: ID!
    name: String!
    livesLeft: Int
  }

  type Query {
    animals: [Animal]
  }
`;

const animalsData = [
  { id: '1', name: 'Rex', barkVolume: 5 },
  { id: '2', name: 'Whiskers', livesLeft: 7 }
];

const resolvers = {
  Query: {
    animals: () => animalsData
  },
  Animal: {
    __resolveType(obj) {
      if (obj.barkVolume !== undefined) {
        return 'Dog';
      }
      if (obj.livesLeft !== undefined) {
        return 'Cat';
      }
      return null; // GraphQL will error if null
    }
  }
};

const server = new ApolloServer({ typeDefs, resolvers });

server.listen().then(({ url }) => {
  console.log(`Server ready at ${url}`);
});

Important Notes

The __resolveType function runs every time GraphQL needs to know the exact type.

If you forget to implement __resolveType, GraphQL will give an error when querying interfaces or unions.

Use abstract type resolution to keep your schema flexible and clean when dealing with multiple related types.

Summary

Abstract type resolution helps GraphQL pick the right type when you use interfaces or unions.

You write a __resolveType function that checks your data and returns the correct type name.

This makes your queries return the right fields for each specific type.

Practice

1. What is the main purpose of the __resolveType function in GraphQL when using interfaces or unions?

easy

A. To fetch data from the database

B. To validate the query syntax before execution

C. To define new scalar types

D. To determine the specific object type to return for an abstract type

Solution

1. Step 1: Understand abstract types in GraphQL

   Abstract types like interfaces or unions can represent multiple object types.

2. Step 2: Role of __resolveType

   This function tells GraphQL which concrete type to use for the returned data.

3. Final Answer:

   To determine the specific object type to return for an abstract type -> Option D

4. Quick Check:

   Abstract type resolution = determine specific type [OK]

Hint: Remember: __resolveType picks the exact type [OK]

Common Mistakes:

• Confusing __resolveType with data fetching
• Thinking it validates query syntax
• Assuming it defines scalar types

2. Which of the following is the correct way to define a __resolveType function in a GraphQL resolver object?

easy

A. resolveType(obj) { return obj.typeName; }

B. __resolveType(obj) { return obj.kind; }

C. __resolveType(obj) { return obj.__typename; }

D. __resolveType(obj) { return obj.type; }

Solution

1. Step 1: Check the naming and return value

   The function must be named exactly __resolveType and return a string matching a type name.

2. Step 2: Match the returned value to the data field

   Commonly, the field __typename holds the type name, so returning obj.__typename is correct.

3. Final Answer:

   __resolveType(obj) { return obj.__typename; } -> Option C

4. Quick Check:

   Correct function name and return field = __resolveType(obj) { return obj.__typename; } [OK]

Hint: Function must be named exactly __resolveType [OK]

Common Mistakes:

• Using wrong function name like resolveType
• Returning incorrect property like type
• Returning undefined or wrong field

3. Given this resolver snippet for a union type:

__resolveType(obj) {
  if (obj.price) return 'Book';
  if (obj.author) return 'Author';
  return null;
}

What will be the resolved type for { price: 20, author: 'John' }?

medium

A. Book

B. Author

C. null

D. Error

Solution

1. Step 1: Check conditions in order

   The function first checks if obj.price exists, which is true here.

2. Step 2: Return first matching type

   Since obj.price is true, it returns 'Book' immediately without checking further.

3. Final Answer:

   Book -> Option A

4. Quick Check:

   First true condition returns 'Book' [OK]

Hint: Check conditions top to bottom, first match wins [OK]

Common Mistakes:

• Assuming it returns 'Author' because author field exists
• Thinking it returns null if multiple fields exist
• Expecting an error for multiple matches

4. You wrote this __resolveType function:

__resolveType(obj) {
  if (obj.kind === 'User') return 'User';
  if (obj.kind === 'Admin') return 'Admin';
}

But your GraphQL query returns null for the type. What is the likely problem?

medium

A. Function name should be resolveType without underscores

B. Missing a return statement for unmatched cases

C. The kind field does not exist in obj

D. GraphQL does not support __resolveType for interfaces

Solution

1. Step 1: Check function completeness

   The function lacks a return for cases when obj.kind is neither 'User' nor 'Admin'.

2. Step 2: Understand GraphQL behavior

   If no type is returned, GraphQL resolves the type as null, causing query issues.

3. Final Answer:

   Missing a return statement for unmatched cases -> Option B

4. Quick Check:

   Always return a type or null explicitly [OK]

Hint: Always return a type or null in __resolveType [OK]

Common Mistakes:

• Using wrong function name without underscores
• Assuming missing return defaults to a type
• Believing GraphQL doesn't support __resolveType

5. You have a GraphQL interface Vehicle implemented by types Car and Bike. Your __resolveType function is:

__resolveType(obj) {
  return obj.wheels === 4 ? 'Car' : 'Bike';
}

If an object has { wheels: 0 }, what will happen when querying this interface?

hard

A. It will resolve to 'Bike' because wheels is not 4

B. It will resolve to 'Car' because 0 is falsy

C. It will cause a runtime error due to invalid wheels

D. It will return null and cause query failure

Solution

1. Step 1: Evaluate the ternary condition

   The condition checks if obj.wheels === 4. For 0, this is false.

2. Step 2: Determine returned type

   Since condition is false, it returns 'Bike'.

3. Final Answer:

   It will resolve to 'Bike' because wheels is not 4 -> Option A

4. Quick Check:

   Condition false returns 'Bike' [OK]

Hint: Check exact equality, not truthiness, in __resolveType [OK]

Common Mistakes:

• Confusing falsy 0 with true condition
• Expecting runtime error for zero wheels
• Assuming null return causes failure