title: Query Wordpress Posts by string with GraphQL
body: <p>I'm have a headless wordpress installation with a React front end that queries wordpress for posts. I'm trying to create a search feature, that allows me to load posts by search term from the url query string (retrieved by using <code>const searchQuery = window.location.search.split("?q=")[1]</code>), which gives me the string to search on.</p>
  
  <p>However, I get the error "ERROR: GraphQL error: No post exists with this id:".</p>
  
  <p>My GraphQL query is as follows:</p>
  
  <pre><code> query postQuery($slug: String) {
    postBy(slug: $slug) {
      id
      slug
      status
      title
      content
      blocks {
          tagName
          type
          attributes,
          innerHtml
      }
    }
  }
  </code></pre>
  
  <p>I have tried implementing the example here: <a href="https://graphql-search-api.readthedocs.io/en/latest/search-parameters/#fulltext" rel="nofollow noreferrer">https://graphql-search-api.readthedocs.io/en/latest/search-parameters/#fulltext</a>, but it doesn't seem the request is what I need. I have also tried this example: <a href="https://docs.wpgraphql.com/getting-started/posts/#arguments" rel="nofollow noreferrer">https://docs.wpgraphql.com/getting-started/posts/#arguments</a>, but again, this does not work.</p>
  
  <p>There are two issues here: 1) How do I use the search term from my variable <code>searchQuery</code> in my GraphQL request, and 2) How do I form the query correctly, so that the term can be used to search for and return any post with the search term in either the post title or content of the post?</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>I have updated my code with a separate query from the rest of the application, but now receiving the error on the page <code>GraphQL error: Cannot query field "title" on type "RootQueryToPostConnection". GraphQL error: Cannot query field "content" on type "RootQueryToPostConnection</code></p>
  
  <pre><code>const SEARCH_QUERY = gql`
          query searchPostQuery($searchStr: String) {
            posts(where: {search: $searchStr}) {
              title
              content
            }
          }
      `;
  
      const APP_QUERY = gql`
        query appQuery($locationId: MenuLocationEnum!) {
         ...
      }`;
  
      const searchQuery = window.location.search.split("?q=")[1];
      function App(props) {
        return (
          &lt;ApolloProvider client={graphClient}&gt;
              &lt;Query query={window.location.pathname === "/search-results" ? SEARCH_QUERY : APP_QUERY} variables={{ locationId: "HEADER_MENU", searchStr: searchQuery }}&gt;
                {({ data, loading, error, client }) =&gt; {
                  if (loading) return "loading...";
                  if (error) return &lt;p&gt;ERROR: {error.message}&lt;/p&gt;;
                       return (
                    &lt;&gt;
                      &lt;Query query={HEADER_QUERY}&gt;
                        {({ data, client: headerClient }) =&gt; {
                        return (
                        &lt;&gt;
                        &lt;Router&gt;
                           ...
                          &lt;SearchResults
                             path="/search-results"
                          /&gt;
                        &lt;/Router&gt;
                    &lt;/&gt;
                   );
                  }}
           &lt;/Query&gt;
        &lt;/ApolloProvider&gt;
     );
  }
  </code></pre>