Abstract type resolution in GraphQL - Mini Project: Build & Apply

Abstract Type Resolution in GraphQL

📖 Scenario: You are building a simple GraphQL API for a library system. The library has different types of items: Books and Magazines. Both share some common fields but also have their own unique fields.To handle this, you will use GraphQL's abstract types (interfaces) to define a common structure and then resolve the specific types when querying.

🎯 Goal: Create a GraphQL schema with an Item interface and two types Book and Magazine that implement this interface. Then, write a resolver function to correctly resolve the abstract type Item to either Book or Magazine based on the data.

📋 What You'll Learn

Define an interface called Item with fields id and title

Create two types Book and Magazine implementing Item

Add a unique field author to Book and issueNumber to Magazine

Write a resolver function __resolveType for the Item interface to return the correct type

Create a query items that returns a list of Item objects

💡 Why This Matters

🌍 Real World

Abstract type resolution is used in GraphQL APIs to handle data that can be one of several types sharing common fields, such as different media types in a library or different user roles in an application.

💼 Career

Understanding abstract types and resolvers is essential for backend developers working with GraphQL to build flexible and efficient APIs that serve diverse data types.

1

Define the Item interface and types

Create a GraphQL schema with an interface called Item that has fields id (ID!) and title (String!). Then define two types Book and Magazine that implement Item. Book should have an additional field author (String!), and Magazine should have an additional field issueNumber (Int!).

GraphQL

# Define the Item interface and Book, Magazine types
# Your code here

Hint

Use the interface keyword for Item. Use implements Item for Book and Magazine.

2

Add the items query returning a list of Item

Add a query type with a field called items that returns a list of Item (use [Item!]! to indicate a non-null list of non-null items).

GraphQL

interface Item {
  id: ID!
  title: String!
}

type Book implements Item {
  id: ID!
  title: String!
  author: String!
}

type Magazine implements Item {
  id: ID!
  title: String!
  issueNumber: Int!
}

type Query {
  # Define the items query here
  # Your code here
}

Hint

Define a Query type with a field items returning a list of Item.

3

Create sample data for items

Create a JavaScript array called items with two objects: one representing a Book with id '1', title 'GraphQL Guide', and author 'John Doe'; and one representing a Magazine with id '2', title 'Tech Monthly', and issueNumber 42.

GraphQL

interface Item {
  id: ID!
  title: String!
}

type Book implements Item {
  id: ID!
  title: String!
  author: String!
}

type Magazine implements Item {
  id: ID!
  title: String!
  issueNumber: Int!
}

type Query {
  items: [Item!]!
}

// Create the items array with sample data
// Your code here

Hint

Create an array named items with two objects matching the described fields.

4

Write the __resolveType resolver for Item

Write a resolver function called Item with a method __resolveType that takes an object obj and returns the string 'Book' if obj has the author field, or 'Magazine' if obj has the issueNumber field.

GraphQL

interface Item {
  id: ID!
  title: String!
}

type Book implements Item {
  id: ID!
  title: String!
  author: String!
}

type Magazine implements Item {
  id: ID!
  title: String!
  issueNumber: Int!
}

type Query {
  items: [Item!]!
}

const items = [
  { id: '1', title: 'GraphQL Guide', author: 'John Doe' },
  { id: '2', title: 'Tech Monthly', issueNumber: 42 }
];

const resolvers = {
  Item: {
    __resolveType(obj) {
      // Your code here
    }
  }
};

Hint

Check for the presence of author or issueNumber fields to decide the 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