Troubleshooting Guide: Resolving the 'Cannot Query Field "id" on "ItemSearchResults"' Issue in a JSS App with Sitecore 10.3"

"Unraveling the Mystery: Addressing the 'Cannot Query Field "id" on "ItemSearchResults"' Problem in a JSS App with Sitecore 10.3"Introduction

In my previous post I was able to get the items from Sitecore Experience Edge for a single item. If you haven't read that issue you need to read that first before continuing with this one since I explain how to use the sitecore api Key to get the result from a single item. If you want to read that post click here. Now that you have previous background let's dive in to the problem.

The Problem

To give a you a little bit of context this is what I was trying to do. I was trying to get all of the item's children from this sitecore item: /sitecore/content/HeadlessApp/Content/Quizzes.

Here is a picture of the items in Sitecore that should match the Postman's response:

Everything belowe the Quizzes folder should have been returned. However, getting the items from its children was a little bit challenging. I tried using this code:

 query {
  item(path: "/sitecore/content/HeadlessApp/Content/Quizzes", language: "en") {
    id
   children {   
           id,
           name
   }
   
  }
}

And the problem is that I received an error like this:

 {
    "errors": [
        {
            "message": "Cannot query field \"id\" on type \"ItemSearchResults\".",
            "locations": [
                {
                    "line": 5,
                    "column": 12
                }
            ],
            "extensions": {
                "code": "5.2.1"
            }
        },
        {
            "message": "Cannot query field \"name\" on type \"ItemSearchResults\".",
            "locations": [
                {
                    "line": 6,
                    "column": 12
                }
            ],
            "extensions": {
                "code": "5.2.1"
            }
        }
    ]
}

I didn't realize what was wrong so it took me a couple of days to figure it out. That's why I am writing this post to see if it can help anyone else that is having the same issue.

Solution

After long extensive research of why this didn't work I found the solution. Since the error says "ItemSearchResuls" you need to use the code in the following way in order to get the all the children from the items:

 query {
  item(path: "/sitecore/content/HeadlessApp/Content/Quizzes", language: "en") {
    id
   children {
       results {
           id,
           name
       }
   }
   
  }
}

After the children node you need to add the results node see that in line 5. That way you will get a successful JSON response as you can se in the picture below:

However, there is still a slight problem with the request because I want it to filter it out a little bit more.

Filtering by Template ID

So in this case I didn't want Question Type, Display Options and other stuff that was part of Quizzes children to be part of this response. Why ? Because I am planning to create an iOS Quiz App that gets this informaton from Sitecore. Thus, I want to filter children and only list Math and Science which are Quiz Categories,

Now this is an easy task because we can filter by templates. Math and Science both are categories. And the category template ID from this item is: {2DD80D3E-B1DA-4DF0-A915-DC160A459079}. You can get the template ID from the item's template field. See figure below for more detail:

Now in order to filter the id and get a JSON response with only Math and Science you can use the following GraphQL query:

  query {
  item(path: "/sitecore/content/HeadlessApp/Content/Quizzes", language: "en") {
    id
   children(includeTemplateIDs: ["2DD80D3EB1DA4DF0A915DC160A459079"]) {
       results {
           id,
           name
       }
   }
   
  }
}

You can see that in children node in line 4 I added an argument to includeTemplateIDs. Take note that the GUID representation of the template ID should be in quotation marks, uppercase and no braces. And after all that work you should get a post response like this:

As a result we only get Math and Science which are the children with the corresponding id of category in this example.

Also take note that we only included in the query id and name for the results, you can include any other type of field like path if you want to get more information from the items. Nevertheless, for the purposes of this blog post we only use id and name since it is the only thing we are interested right now.

Conclusion

The error of ItemSearch Results was very new and I was not able to find how to get a query from Sitecore in the Official documentation. If you want to get other examples on how to filter your graphql queries click here. Please keep in mind that I found this issue with a JSS application using Sitecore 10.3, so if that is not the case your issue might be different. In my next blog post I will demonstrate how to get this information from an iOS app and display it on the screen. This is to show how Sitecore is now a headless CMS.

Search This Blog

Sitecore