Custom error extensions in GraphQL - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to add a custom error extension in a GraphQL error.

GraphQL

throw new GraphQLError('Invalid input', { extensions: { [1]: 'BAD_USER_INPUT' } });

Drag options to blanks, or click blank then click option'

Astatus

Bmessage

Ccode

Derror

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'message' instead of 'code' inside extensions.

Forgetting to put the custom code inside the extensions object.

The code field inside extensions is used to specify a custom error code in GraphQL errors.

2fill in blank

medium

Complete the code to include a custom error extension with a numeric HTTP status code.

GraphQL

throw new GraphQLError('Unauthorized', { extensions: { code: 'UNAUTHENTICATED', [1]: 401 } });

Drag options to blanks, or click blank then click option'

AstatusCode

BhttpStatus

CerrorCode

Dstatus

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'statusCode' which is less common in GraphQL error extensions.

Using 'errorCode' which is usually a string code, not a number.

The status field is commonly used to represent HTTP status codes in custom error extensions.

3fill in blank

hard

Fix the error in the code to correctly add a custom error extension with a reason string.

GraphQL

throw new GraphQLError('Failed', { extensions: { code: 'FAILURE', reason [1] 'Timeout' } });

Drag options to blanks, or click blank then click option'

A=

B:

C=>

D==

Attempts:

3 left

💡 Hint

Common Mistakes

Using '=' instead of ':' in object literals.

Using '=>' which is for arrow functions, not object properties.

In JavaScript objects, key-value pairs use a colon ':' to separate the key and value.

4fill in blank

hard

Fill both blanks to create a custom error with code and a nested details object.

GraphQL

throw new GraphQLError('Error', { extensions: { [1]: 'BAD_REQUEST', [2]: { field: 'email', issue: 'invalid format' } } });

Drag options to blanks, or click blank then click option'

Acode

Bmessage

Cdetails

Dinfo

Attempts:

3 left

💡 Hint

Common Mistakes

Swapping 'code' and 'message' keys.

Using 'info' instead of 'details' for nested error data.

The code key holds the error code string, and details is a common key for nested error info.

5fill in blank

hard

Fill all three blanks to throw a GraphQL error with uppercase code, numeric status, and a user-friendly message.

GraphQL

throw new GraphQLError('Access denied', { extensions: { [1]: 'FORBIDDEN', [2]: 403, [3]: 'You do not have permission to access this resource.' } });

Drag options to blanks, or click blank then click option'

Acode

Bstatus

Cmessage

Derror

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'error' instead of 'message' for the user message.

Confusing 'status' with 'code' for the numeric value.

code is the uppercase error code, status is the HTTP status number, and message is the user-friendly error message.

Practice

1. What is the main purpose of using extensions in GraphQL error responses?

easy

A. To change the data returned by the query

B. To hide errors from the client

C. To speed up the query execution

D. To provide extra information like error codes and details

Solution

1. Step 1: Understand the role of error extensions

   Extensions add extra info to errors, such as codes or metadata.

2. Step 2: Compare with other options

   Extensions do not change data, speed, or hide errors; they enrich error info.

3. Final Answer:

   To provide extra information like error codes and details -> Option D

4. Quick Check:

   Extensions add info = B [OK]

Hint: Extensions add details to errors, not data or speed [OK]

Common Mistakes:

• Thinking extensions change query data
• Assuming extensions hide errors
• Confusing extensions with performance tools

2. Which of the following is the correct way to add a custom error extension in a GraphQL error object?

easy

A. { message: 'Error', extensions: ['BAD_REQUEST'] }

B. { message: 'Error', code: 'BAD_REQUEST' }

C. { message: 'Error', extensions: { code: 'BAD_REQUEST' } }

D. { error: 'Error', extensions: 'BAD_REQUEST' }

Solution

1. Step 1: Identify correct error object structure

   The error object must have a message and an extensions object with code inside.

2. Step 2: Check each option's syntax

   { message: 'Error', extensions: { code: 'BAD_REQUEST' } } correctly nests code inside extensions; others misuse or misplace fields.

3. Final Answer:

   { message: 'Error', extensions: { code: 'BAD_REQUEST' } } -> Option C

4. Quick Check:

   Extensions is an object with code = D [OK]

Hint: Extensions must be an object with keys like code [OK]

Common Mistakes:

• Putting code outside extensions
• Using extensions as a string or array
• Misnaming fields like error instead of message

3. Given this GraphQL error response:

{"errors":[{"message":"Not found","extensions":{"code":"NOT_FOUND","timestamp":"2024-06-01T12:00:00Z"}}]}

What will the client see in the extensions field?

medium

A. {"code":"NOT_FOUND","timestamp":"2024-06-01T12:00:00Z"}

B. "Not found"

C. {"message":"Not found"}

D. An empty object {}

Solution

1. Step 1: Locate the extensions field in the error

   The extensions field contains code and timestamp as key-value pairs.

2. Step 2: Understand what client receives

   The client sees the extensions object exactly as given, with code and timestamp.

3. Final Answer:

   {"code":"NOT_FOUND","timestamp":"2024-06-01T12:00:00Z"} -> Option A

4. Quick Check:

   Extensions content = A [OK]

Hint: Extensions field shows all custom error details as object [OK]

Common Mistakes:

• Confusing message with extensions
• Expecting extensions to be a string
• Ignoring extra fields like timestamp

4. You wrote this error response in your GraphQL server:

{ message: 'Unauthorized', extensions: 'AUTH_ERROR' }

Why does this cause a problem?

medium

A. Extensions must be an object, not a string

B. Message cannot be 'Unauthorized'

C. Extensions field is missing

D. The error object must not have extensions

Solution

1. Step 1: Check the type of extensions field

   Extensions must be an object with key-value pairs, not a string.

2. Step 2: Identify the error cause

   Using a string for extensions causes syntax or runtime errors in GraphQL.

3. Final Answer:

   Extensions must be an object, not a string -> Option A

4. Quick Check:

   Extensions type error = A [OK]

Hint: Extensions must always be an object, never a string [OK]

Common Mistakes:

• Using string instead of object for extensions
• Ignoring GraphQL error format rules
• Assuming message content causes error

5. You want to send a GraphQL error with a custom extension that includes an error code and a retry flag set to false. Which of these error objects correctly implements this?

hard

A. { message: 'Timeout', extensions: { code: 'TIMEOUT', retry: 0 } }

B. { message: 'Timeout', extensions: { code: 'TIMEOUT', retry: false } }

C. { message: 'Timeout', extensions: { code: 'TIMEOUT', retry: 'no' } }

D. { message: 'Timeout', extensions: { code: 'TIMEOUT', retry: null } }

Solution

1. Step 1: Check the data types for extensions fields

   The retry flag should be a boolean false, not string or null or number.

2. Step 2: Validate each option's retry value

   { message: 'Timeout', extensions: { code: 'TIMEOUT', retry: false } } uses boolean false correctly; others use wrong types.

3. Final Answer:

   { message: 'Timeout', extensions: { code: 'TIMEOUT', retry: false } } -> Option B

4. Quick Check:

   Boolean retry flag = C [OK]

Hint: Use boolean false for retry, not string or null [OK]

Common Mistakes:

• Using string 'no' instead of boolean false
• Using null or 0 for boolean flags
• Ignoring correct data types in extensions