variantBySelectedOptions field doesn't exist on Product

[jibinycricket]

Has this field been deprecated? I see it in the docs but it isn't found when I run the query below

Documentation https://shopify.dev/docs/storefront-api/reference/products/product?api%5Bversion%5D=2021-01#fields-2021-01

query

{
  node(id: "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0LzYxOTc2OTU1NzgyOTk=") {
    ... on Product {
      id
      variantBySelectedOptions(selectedOptions: [{name: "Size", value: "Full/Queen"}, {name: "Color", value: "Sienna"}])
    }
  }
}

response

{
  "errors": [
    {
      "message": "Field 'variantBySelectedOptions' doesn't exist on type 'Product'",
      "locations": [
        {
          "line": 5,
          "column": 7
        }
      ],
      "path": [
        "query",
        "node",
        "... on Product",
        "variantBySelectedOptions"
      ],
      "extensions": {
        "code": "undefinedField",
        "typeName": "Product",
        "fieldName": "variantBySelectedOptions"
      }
    }
  ]
}

[swalkinshaw]

It definitely still exists.

🤔 are you sure you're using the Storefront API and not the Admin API? Only easy explanation I could think of

[jibinycricket]

Sorry. That was exactly the issue. I was using the Shopify GraphiQL App, but I didn't realize it only used the Admin API.

Also here is an issue I noticed, that I want to just document in case its helpful for anyone in the future. When using JSON.stringify, the method applies quotes to both the key and the value causing the string to look like '[{"name": "Size", "value": "King/Cal King" }]', this for some reason causes a parsing error in the request, so you have to strip the quotes out of the keys in order for it to look like this '[{name: "Size", value: "King/Cal King" }]';

My query looked like this

  let selectedOptionParams = [
    { name: "Size", value: "King/Cal King" }
  ];

  selectedOptionParams = JSON.stringify(selectedOptionParams).replace(/"(\w+)"\s*:/g, '$1:');

  this.api.post('/',{
    query: `{
      productByHandle(handle:"${productHandle}") {
        variantBySelectedOptions(selectedOptions:${selectedOptionParams}) {
          id
        }
      }
    }`,
  }).then(res => {
    console.debug(res.data);
  })    

If there's a better way to stringify the object please let me know