Why am I receiving an "AxiosError - Request failed with status code 400" when attempting a mutation through GraphQL using the Shopify Developer App in PipeDream, despite having all necessary permissions?

This topic was automatically generated from Slack. You can find the original thread here.

I’m receiving the following error AxiosError - Request failed with status code 400
{"errors":{"query":"Required parameter missing or invalid"}} when attempting a mutation through GraphQL using the Shopify Developer App. this same Mutation worked perfectly when tested inside of Shopify using the Shopify GraphQL App. When copying and pasting a Query it works, but the Mutation fails inside of PipeDream. The Permissions for the Shopify Custom App include all the “write” access needed for the specific mutation. What else could be the problem?

Based on the error message you’re encountering, it seems like there might be an issue with how the mutation is structured or how the parameters are being passed in your request from Pipedream. Since the mutation works perfectly when tested directly in Shopify but fails when called from Pipedream using the Shopify Developer App, let’s consider a few potential issues and solutions: 1. Parameter Passing: Ensure that all required parameters for the mutation are correctly passed and formatted. The error message {"errors":{"query":"Required parameter missing or invalid"}} suggests that either a required parameter is missing or there’s a formatting issue with how the parameters are being sent. 2. Header Information: Double-check that all necessary headers, especially those related to authentication, are correctly set in your request. Since you’re using the Shopify Developer App, make sure the access token is correctly being applied. 3. Mutation Syntax: Verify that the mutation syntax is correct and matches the expected format by Shopify’s GraphQL API. Even small discrepancies in the mutation structure can lead to errors. 4. API Version: Ensure that the API version you’re targeting in your request URL (https://${this.shopify_developer_app.$auth.shop_id}.[myshopify.com/admin/api/2023-07/customers/search.json)](http://myshopify.com/admin/api/2023-07/customers/search.json`)) is compatible with the mutation you’re trying to perform. Shopify’s API versions periodically, and certain mutations or fields may behave differently or may not be available in all versions. 5. Permissions: Although you mentioned that the permissions for the Shopify Custom App include all the “write” access needed for the specific mutation, it might be helpful to review them once more to ensure that no required permission is overlooked. Here’s a general structure for sending a GraphQL mutation using Axios in Pipedream, which you can adapt to your specific mutation: ``` import { axios } from “@pipedream/platform” export default defineComponent({ props: { shopify_developer_app: { type: “app”, app: “shopify_developer_app”, }, // Include other props as needed }, async run({steps, $}) { const mutation = your mutation here; return await axios($, { method: “POST”, url: https://${this.shopify_developer_app.$auth.shop_id}.[myshopify.com/admin/api/2023-07/graphql.json](http://myshopify.com/admin/api/2023-07/graphql.json), headers: { "X-Shopify-Access-Token

Could you share your component code? It might just be a formatting issue with the GQL payload

here is the current code in the step that generates the error message "AxiosError - Request failed with status code 400
{"errors":{"query":"Required parameter missing or invalid"}}":

import { axios } from "@pipedream/platform"
export default defineComponent({
  props: {
    shopify_developer_app: {
      type: "app",
      app: "shopify_developer_app",
    }
  },
  async run({steps, $}) {
    const data = {
      "mutation assignRole": `{
      companyLocationAssignRoles(companyLocationId: "gid://shopify/CompanyLocation/1900380449"
            rolesToAssign: [{companyContactId: "gid://shopify/CompanyContact/1632010529", companyContactRoleId: "gid://shopify/CompanyContactRole/3670802721"}]
          ) {
            roleAssignments {
              id
              role {
                id
                name
              }
              company {
                id
                name
              }
              companyContact {
                id
                roleAssignments(first: 10) {
                  nodes {
                    id
                    role {
                      id
                      name
                    }
                  }
                }
              }
            }
          }
      }`,
    }
    return await axios($, {
      method: "post",
      url: `https://${this.shopify_developer_app.$auth.shop_id}.myshopify.com/admin/api/2024-04/graphql.json`,
      headers: {
        "X-Shopify-Access-Token": `${this.shopify_developer_app.$auth.access_token}`,
        "Content-Type": `application/json`,
      },
      data,
    })
  },
})

here is how the mutation looks inside of the Shopify GraphQL App when it runs successfully:

mutation companyLocationRoles {
  companyLocationAssignRoles(
    companyLocationId: "gid://shopify/CompanyLocation/1900380449"
    rolesToAssign: [{companyContactId: "gid://shopify/CompanyContact/1632010529", companyContactRoleId: "gid://shopify/CompanyContactRole/3670802721"}]
  ) {
    roleAssignments {
      id
      role {
        id
        name
      }
      company {
        id
        name
      }
      companyContact {
        id
        roleAssignments(first: 10) {
          nodes {
            id
            role {
              id
              name
            }
          }
        }
      }
    }
  }
}

I think Shopify is trying to tell you it’s expecting a query argument in the HTTP payload. Not mutation <name>

Have you tried moving the entire mutation as a value instead of splitting the name as the key?

Here’s a good example: How to call a GraphQL API with Axios | by Sashko Stubailo | Medium

no, haven’t tried that since the Queries work perfect when I copy and paste them from the Shopify App into Pipedream, orginally the query argument gave an error and I switched to mutation. I’ll check out the example now, thank you!

Sure thing, hopefully that works for you.

There’s other NPM libraries that help making GraphQL queries a bit easier. But axios is fine too.

I have two code steps the one previous works great its just a simple query I pasted from Shopify GraphQL app, so I changed the mutation step to add the “query:” argument back and got the previous error again “Field ‘companyLocationAssignRoles’ doesn’t exist on type ‘QueryRoot’”

this was the only change, online haven’t seen any examples of a successful mutation on Shopify :cry:

I think this finally solved it: How to do GraphQL queries and mutations with Axios | by Adam Hinckley | Medium

this is what i found :eyes:

Right, that was going to be my next suggestion. If you wrap the mutation with a name, then you can define arguments as variables to the mutation/query underneath

But with axios, you’re sending a “naked” GraphQL request, without a dedicated GraphQL client to help pass those variables

Did that new method work for you?

yes, adding that word ‘mutation’ after the ‘query’ did the trick. I had to restore the query argument first and work my way back. Thank you for helping! It was an insane mission trying to find that syntax example that just came up from the second Medium article I found

Yea that’s the trouble with GraphQL sometimes. There are fancy libraries help make it easier, but they expect you to have a file dedicated to each query/mutation definition. Not so simple in just a code step

Glad to hear you figured it out