Trouble with GraphQL webHookSubscriptionCreate returning undefined

[michaelg47]

I'm building an app with the Remix template and I'm trying to create a webhook subscription for a bulk query operation I have to do. However, in the response to the below mutation, webhookSubscription is always null.

const response = await admin.graphql(
    `#graphql
      mutation webhookSubscriptionCreate($topic: WebhookSubscriptionTopic!, $webhookSubscription: WebhookSubscriptionInput!) {
        webhookSubscriptionCreate(topic: $topic, webhookSubscription: $webhookSubscription) {
          userErrors {
            field
            message
          }
          webhookSubscription {
            id
            topic
          }
        }
      }`,
    {
      variables: {
        "topic": "BULK_OPERATIONS_FINISH",
        "webhookSubscription": {
          "callbackUrl": BASE_URL + "processOrders",
          "format": "JSON"
        }
      },
    }
  ); 

When I log userErrors.message, it reads: 'Address for this topic has already been taken'.

So, I wrote a query to check my existing webhook subscriptions:

const response = await admin.graphql(
    `#graphql
      query {
        webhookSubscriptions(first: 10, topics: BULK_OPERATIONS_FINISH) {
          edges {
            node {
              id
              topic
              endpoint {
                __typename
                ... on WebhookHttpEndpoint {
                  callbackUrl
                }
              }
            }
          }
        }
      }`,
    {}
  );

But when I try to access webhookSubscriptions.edges, I get: TypeError: Cannot read properties of undefined (reading 'edges'). 

It seems that I can't get any of these webhook queries to work. Can you tell what I might be doing wrong? Any help would be appreciated.

[Liam · Accepted solution]

Hi Michaelg47,

The error "Address for this topic has already been taken" suggests that there is already a webhook subscription with the same topic and callback URL. Shopify does not allow two webhook subscriptions to have the same topic and callback URL.

Your second issue, "TypeError: Cannot read properties of undefined (reading 'edges')" indicates that webhookSubscriptions is undefined in the response. This might be due to the fact that there are no webhook subscriptions for the topic BULK_OPERATIONS_FINISH in your store.

Here are a few things you could try:

1. Check the callback URL: Make sure the callback URL that you are providing while creating the webhook is correct and it is accessible from the internet. Local URLs or URLs that are not accessible publicly will not work.

2. Check the topic: Ensure you are using the correct topic. In your case, it should be BULK_OPERATIONS_FINISH.

3. Delete existing webhooks: If there is already a webhook with the same topic and callback URL, you might need to delete the existing webhook subscription before creating a new one. You can do this by using the webhookSubscriptionDelete mutation with the ID of the webhook subscription you want to delete.

4. Return all webhook subscriptions: If you are not certain about the topic, you can modify your second query to return all webhook subscriptions regardless of the topic. This way, you can inspect all the active webhooks. Here's how you could modify your query:

query {
  webhookSubscriptions(first: 10) {
    {
      node {
        id
        topic
        endpoint {
          __typename
          ... on WebhookHttpEndpoint {
            callbackUrl
          }
        }
      }
    }
  }
}

Try these steps and let us know if you're still having an issue with this.