Unsubscribing in GraphQL - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to unsubscribe from a GraphQL subscription.

GraphQL

const unsubscribe = subscriptionClient.[1]();

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

Apublish

Bunsubscribe

Cconnect

Dsubscribe

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'subscribe' instead of 'unsubscribe' will start a subscription, not stop it.

Using 'connect' or 'publish' are unrelated to unsubscribing.

The unsubscribe method stops the subscription and cleans up resources.

2fill in blank

medium

Complete the code to stop receiving updates by calling the correct method on the subscription object.

GraphQL

const subscription = client.subscribe({ query: MY_SUBSCRIPTION });
subscription.[1]();

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

Astart

Bconnect

Clisten

Dunsubscribe

Attempts:

3 left

💡 Hint

Common Mistakes

Calling 'start' or 'listen' will not stop the subscription.

Using 'connect' is unrelated to unsubscribing.

Calling unsubscribe() on the subscription object stops the updates.

3fill in blank

hard

Fix the error in the code to properly unsubscribe from a GraphQL subscription.

GraphQL

const sub = client.subscribe({ query: SUBSCRIPTION_QUERY });
// Incorrect unsubscribe call
sub.[1]();

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

Aunsubscribe

Bsubscribe

Cdisconnect

Dcancel

Attempts:

3 left

💡 Hint

Common Mistakes

Calling 'subscribe' again instead of 'unsubscribe'.

Using 'disconnect' or 'cancel' which are not standard methods.

The correct method to stop a subscription is unsubscribe(). Using subscribe() again or other methods will not stop it.

4fill in blank

hard

Fill both blanks to correctly create and then unsubscribe from a GraphQL subscription.

GraphQL

const subscription = client.[1]({ query: SUBSCRIPTION });
subscription.[2]();

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

Asubscribe

Bunsubscribe

Cconnect

Dstart

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'connect' or 'start' instead of 'subscribe' to begin.

Using 'connect' or 'start' instead of 'unsubscribe' to stop.

You first call subscribe to start the subscription, then unsubscribe to stop it.

5fill in blank

hard

Fill all three blanks to subscribe, handle data, and then unsubscribe properly.

GraphQL

const subscription = client.[1]({ query: SUBSCRIPTION });
subscription.[2](({ data }) => {
  console.log(data);
});
subscription.[3]();

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

Asubscribe

Cunsubscribe

Dconnect

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'connect' instead of 'subscribe' to start.

Not calling 'unsubscribe' to stop the subscription.

First, call subscribe to start the subscription and provide a callback to handle data. Finally, call unsubscribe to stop the subscription.