Product Metafield Description Returning Null

Retired Boards Appdev Custom Storefronts
1

Hey folks,

I’m currently in the process of building a static site using the Storefront GraphQL API and we have some product metafields set up that we plan on pulling into a product details page.
Unfortunately, when we pull in the metafield data the metafield description is always null. The other metafield data is present, only the description is null.

I’ve tried both metafields and metafield, they both return all of the data, but the description is null. I’ve confirmed that the field has a description, you can see how it’s setup here:

kamon000_0-1641528937098.png
kamon000_0-1641528937098.png1081×677 18.3 KB

Here’s my product query:

query productByHandle($slug: String!) {
  productByHandle(handle: $slug) {
    id
    handle
    title
    vendor
    description
    flow_rate: metafield(namespace: "specs", key: "flow_rate") {
      key
      value
      description
    }
    metafields(first: 100, namespace: "specs") {
      edges {
        node {
          key
          value
          description
        }
      }
    }
    descriptionHtml
    options {
      id
      name
      values
    }
    priceRange {
      minVariantPrice {
        amount
        currencyCode
      }
      maxVariantPrice {
        amount
        currencyCode
      }
    }
    variants(first: 250) {
      pageInfo {
        hasNextPage
        hasPreviousPage
      }
      edges {
        node {
          id
          title
          sku
          selectedOptions {
            name
            value
          }
          priceV2 {
            amount
            currencyCode
          }
          compareAtPriceV2 {
            amount
            currencyCode
          }
        }
      }
    }
    images(first: 250) {
      pageInfo {
        hasNextPage
        hasPreviousPage
      }
      edges {
        node {
          originalSrc
          altText
          width
          height
        }
      }
    }
  }
}

The response looks like this from the above query:

{
  "data": {
    "productByHandle": {
      "id": "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0Lzc0MzA4MDYwNDQ4ODc=",
      "handle": "intelli-pro-xf-vs-pump",
      "title": "INTELLI PRO XF VS PUMP",
      "vendor": "Shasta Pools",
      "description": "IntelliProXF VSF pump is the first variable speed and flow pump that adjusts to changes in flow system conditions to maintain its programmed flow rate. With its available performance and efficiency, it is perfectly suited for large and feature rich pools with high flow demand.",
      "flow_rate": {
        "key": "flow_rate",
        "value": "50",
        "description": null
      },
      "metafields": {
        "edges": [
          {
            "node": {
              "key": "flow_rate",
              "value": "50",
              "description": null
            }
          },
          {
            "node": {
              "key": "manufacturer",
              "value": "Pentair",
              "description": null
            }
          },
          {
            "node": {
              "key": "model",
              "value": "Frickin' Rad One",
              "description": null
            }
          }
        ]
      },
      "descriptionHtml": "

IntelliProXF VSF pump is the first variable speed and flow pump that adjusts to changes in flow system conditions to maintain its programmed flow rate. With its available performance and efficiency, it is perfectly suited for large and feature rich pools with high flow demand.

\n

 

",
      "options": [
        {
          "id": "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0T3B0aW9uLzk0NDc3ODcxMzUxOTE=",
          "name": "Title",
          "values": [
            "Default Title"
          ]
        }
      ],
      "priceRange": {
        "minVariantPrice": {
          "amount": "500.0",
          "currencyCode": "USD"
        },
        "maxVariantPrice": {
          "amount": "500.0",
          "currencyCode": "USD"
        }
      },
      "variants": {
        "pageInfo": {
          "hasNextPage": false,
          "hasPreviousPage": false
        },
        "edges": [
          {
            "node": {
              "id": "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0VmFyaWFudC80MTk4Njg3OTQ4ODIxNQ==",
              "title": "Default Title",
              "sku": "557884",
              "selectedOptions": [
                {
                  "name": "Title",
                  "value": "Default Title"
                }
              ],
              "priceV2": {
                "amount": "500.0",
                "currencyCode": "USD"
              },
              "compareAtPriceV2": {
                "amount": "650.0",
                "currencyCode": "USD"
              }
            }
          }
        ]
      },
      "images": {
        "pageInfo": {
          "hasNextPage": false,
          "hasPreviousPage": false
        },
        "edges": [
          {
            "node": {
              "originalSrc": "https://cdn.shopify.com/s/files/1/0607/1274/7223/products/1553541247591.jpg?v=1635894962",
              "altText": null,
              "width": 1280,
              "height": 583
            }
          }
        ]
      }
    }
  }
}

Have tried all of the API versions with no luck. The Admin GraphQL API does return the metafield description, so the data is there, just not for the Storefront API.

Any insight would be greatly appreciated, thanks!

2

Hi @kamon000 , Jesse here from the Metafields team.

The description in your screen shot is the description on the definition. The description you are asking for in your graphql query is for the description on the metafield. As far as I know, the the description on the metafield can only be set via the API. You mention that this works in admin though which is somewhat surprising - could you double check that you are actually getting a description back when asking for that metafield (vs asking for the description of the definition?).

In admin, you could get to that description by:

flow_rate: metafield(namespace: "specs", key: "flow_rate") {
  key
  value
  definition {
    description
  }
}

We do not currently expose definition in storefront though. Let me know what you find out regarding the description you are seeing in admin.

3

Oh! That makes sense, I guess the lines were getting blurred for me between a metafield definition and an actual metafield.

Modifying the query as you suggested and using the Admin API I am able to retrieve the definition description. Unfortunately, though, that doesn’t necessarily solve my problem as I don’t think exposing the Admin API to our public-facing site is a good idea from a security perspective.

There potentially will be dozens of these metafield defintions and we’re hoping to use the metafield descriptions as labels that our client can manage that get displayed on the frontend.

Is there a way to access the metafield definitions and their keys/namespaces/descriptions, without needing to openly expose the Admin API?

If there’s nothing existing, would it be insane to create a custom Shopify app for our client that essentially only has read access to the metafields that would return a JSON response of them that we can access via our site?

Thanks for the help, I really appreciate it!