Depth limiting in GraphQL - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to set the maximum query depth to 3.

GraphQL

const server = new ApolloServer({ schema, validationRules: [depthLimit({ maxDepth: [1] })] });

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

A3

B10

C5

D1

Attempts:

3 left

💡 Hint

Common Mistakes

Setting maxDepth too high defeats the purpose of depth limiting.

Using a string instead of a number for maxDepth.

The maxDepth option limits the query depth. Setting it to 3 restricts queries to a depth of 3.

2fill in blank

medium

Complete the code to import the depthLimit function from the correct package.

GraphQL

import [1] from 'graphql-depth-limit';

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

AdepthLimiter

BdepthLimit

ClimitDepth

DdepthLimitRule

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect function names that do not exist in the package.

Forgetting to install the package before importing.

The package graphql-depth-limit exports the function depthLimit which is used to limit query depth.

3fill in blank

hard

Fix the error in the validationRules array to correctly apply depth limiting.

GraphQL

const server = new ApolloServer({ schema, validationRules: [[1]] });

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

AdepthLimit({ maxDepth: 3 })

BdepthLimit

CdepthLimitRule(3)

DdepthLimit(3)

Attempts:

3 left

💡 Hint

Common Mistakes

Passing the function without calling it.

Using incorrect argument types.

The depthLimit function must be called with an options object specifying maxDepth. Passing just the function or wrong arguments causes errors.

4fill in blank

hard

Fill both blanks to create a validation rule that limits depth to 4 and logs a warning on violation.

GraphQL

const depthLimitRule = depthLimit({ maxDepth: [1], onError: (err) => console.[2]('Depth limit exceeded:', err) });

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

A4

Bwarn

Cerror

D3

Attempts:

3 left

💡 Hint

Common Mistakes

Using console.log instead of console.warn for warnings.

Setting maxDepth to a string instead of a number.

Setting maxDepth to 4 limits queries to depth 4. Using console.warn logs a warning message when the limit is exceeded.

5fill in blank

hard

Fill all three blanks to define a GraphQL server with depth limiting set to 2, using the imported depthLimit function and applying it in validationRules.

GraphQL

import [1] from 'graphql-depth-limit';

const server = new ApolloServer({
  schema,
  validationRules: [[2]([3])]
});

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

AdepthLimit

C{ maxDepth: 2 }

DdepthLimiter

Attempts:

3 left

💡 Hint

Common Mistakes

Using different names for import and usage.

Passing maxDepth as a number directly instead of inside an object.

The function depthLimit is imported and called with an options object { maxDepth: 2 } inside validationRules to enforce depth limiting.

Practice

1.

What is the main purpose of depth limiting in GraphQL?

easy

A. To speed up the client-side rendering

B. To increase the depth of queries for more data

C. To limit the number of users accessing the server

D. To stop queries from going too deep and protect the server

Solution

1. Step 1: Understand what depth limiting controls

   Depth limiting restricts how deep a GraphQL query can go into nested fields.

2. Step 2: Identify the purpose of this restriction

   This prevents overly complex queries that can slow down or crash the server.

3. Final Answer:

   To stop queries from going too deep and protect the server -> Option D

4. Quick Check:

   Depth limiting = Protect server from deep queries [OK]

Hint: Depth limiting stops deep queries to keep server safe [OK]

Common Mistakes:

• Thinking depth limiting speeds up client rendering
• Confusing depth limiting with user access control
• Believing depth limiting increases query depth

2.

Which of the following is the correct way to set a maximum query depth of 5 in a GraphQL server using graphql-depth-limit?

const depthLimit = require('graphql-depth-limit');
const server = new ApolloServer({
  schema,
  validationRules: [ /* ??? */ ]
});

easy

A. validationRules: [depthLimit(5)]

B. validationRules: [depthLimit.max(5)]

C. validationRules: [depthLimit.setMaxDepth(5)]

D. validationRules: [depthLimit.limit(5)]

Solution

1. Step 1: Recall the usage of graphql-depth-limit

   The package exports a function called depthLimit that takes the max depth as an argument.

2. Step 2: Match the correct syntax

   The correct way is to pass depthLimit(5) inside validationRules array.

3. Final Answer:

   validationRules: [depthLimit(5)] -> Option A

4. Quick Check:

   depthLimit(5) sets max depth 5 [OK]

Hint: Use depthLimit(number) inside validationRules [OK]

Common Mistakes:

• Using non-existent methods like max or setMaxDepth
• Passing depthLimit without parentheses
• Placing depthLimit outside validationRules array

3.

Given this GraphQL query and a server with depth limit set to 3, what will happen?

{
  user {
    posts {
      comments {
        text
      }
    }
  }
}

medium

A. The query will succeed and return all comments' text

B. The query will return only user and posts without comments

C. The query will fail due to exceeding the depth limit

D. The query will return an empty response

Solution

1. Step 1: Calculate the query depth

   The query goes user (level 1) -> posts (level 2) -> comments (level 3) -> text (level 4). Depth is 4.

2. Step 2: Compare with the depth limit

   The server limits depth to 3, but query depth is 4, so it exceeds the limit.

3. Final Answer:

   The query will fail due to exceeding the depth limit -> Option C

4. Quick Check:

   Query depth 4 > limit 3 = fail [OK]

Hint: Count nested fields; if deeper than limit, query fails [OK]

Common Mistakes:

• Counting leaf fields as separate depth
• Assuming depth limit applies per field, not whole query
• Thinking partial data returns on depth limit exceed

4.

What is wrong with this GraphQL server setup code that tries to limit query depth?

const depthLimit = require('graphql-depth-limit');
const server = new ApolloServer({
  schema,
  validationRules: depthLimit(4)
});

medium

A. validationRules should be an array, not a single function

B. depthLimit should be called without arguments

C. schema must be inside validationRules

D. ApolloServer does not support validationRules

Solution

1. Step 1: Check the expected type of validationRules

   validationRules expects an array of functions, not a single function.

2. Step 2: Identify the mistake in the code

   The code passes depthLimit(4) directly, missing the array brackets.

3. Final Answer:

   validationRules should be an array, not a single function -> Option A

4. Quick Check:

   validationRules = [depthLimit(4)] [OK]

Hint: Wrap depthLimit call inside array for validationRules [OK]

Common Mistakes:

• Passing function directly instead of array
• Calling depthLimit without max depth argument
• Misplacing schema inside validationRules

5.

You want to allow queries up to depth 4 but block deeper ones. You also want to log a warning when a query exceeds the limit. Which approach correctly combines depth limiting with custom logging in a GraphQL server?

const depthLimit = require('graphql-depth-limit');
const { ApolloServer } = require('apollo-server');

const loggingDepthLimit = (maxDepth) => {
  return (context) => {
    const validationRule = depthLimit(maxDepth);
    return (validationContext) => {
      const errors = validationRule(validationContext);
      if (errors && errors.length > 0) {
        console.warn('Query depth exceeded:', errors);
      }
      return errors;
    };
  };
};

const server = new ApolloServer({
  schema,
  validationRules: [loggingDepthLimit(4)]
});

hard

A. depthLimit cannot be wrapped; this will cause runtime errors

B. This code correctly wraps depthLimit to log warnings on depth exceed

C. validationRules must be a single function, not an array

D. Logging should be done outside validationRules, this is incorrect

Solution

1. Step 1: Understand wrapping validation rules

   Validation rules are functions that can be wrapped to add behavior like logging.

2. Step 2: Analyze the custom logging wrapper

   The code creates a function that calls depthLimit and logs warnings if errors occur.

3. Step 3: Confirm usage in ApolloServer

   Passing the wrapped function inside an array to validationRules is correct.

4. Final Answer:

   This code correctly wraps depthLimit to log warnings on depth exceed -> Option B

5. Quick Check:

   Wrap validationRules to add logging = correct [OK]

Hint: Wrap depthLimit in function to add logging, pass in array [OK]

Common Mistakes:

• Assuming validationRules can't be wrapped
• Passing validationRules as single function instead of array
• Trying to log outside validationRules without access to errors