Gatsby: Unable to retrieve Entity References with the drupal-source plugin

Created on 2 Aug 2018  Â·  16Comments  Â·  Source: gatsbyjs/gatsby

Description

I set up a Drupal 8 installation from the umami profile (demo content automatically added) and enabled the jsonapi and jsonapi_extra modules.
I connected a gatsby installation through the drupal source plugin and am able to list all my nodes, create detail pages and so on... but I am unable to retrieve entity reference fields, like author, tags, category...

image

image

Steps to reproduce

  • Install Drupal 8 with the Umami profile and content (Drupal 8.5 or 8.6):
    $ drupal site:install demo_umami --db-type="mysql" --db-host="127.0.0.1" --db-name="drupal8-gatsby"
  • Create a new gatsby site with the drupal-source-plugin enabled and configured.
module.exports = {
  siteMetadata: {
    title: 'Gatsby Default Starter',
  },
  plugins: [
    'gatsby-plugin-react-helmet',
    'gatsby-plugin-styled-components',
    {
      resolve: 'gatsby-source-drupal',
      options: {
        baseUrl: 'http://dev.gatsby.d8/',
        apiBase: 'jsonapi',
      },
    }
  ],
}
  • Navigate to the graphql browser and try to query for recipes along with their tags and category (entity reference fields - see screenshots below).
{
  allNodeRecipe {
    edges {
      node {
        id
        title
        field_preparation_time
        field_cooking_time
        field_difficulty
        field_ingredients
        field_summary {
          value
          format
          processed
        }
        field_recipe_instruction {
          value
          format
          processed
        }
        relationships {
          field_image {
            url
          }
        }
        path {
          alias
          pid
          langcode
        }
      }
    }
  }
}

Expected result

Either within the relationships or as a dedicated field, I would expect the field_recipe_category or the field_tags to appear.

Actual result

They don't autocomplete, and when entered manually given an error "cannot query field on..."

Environment

  System:
    OS: macOS High Sierra 10.13.6
    CPU: x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 9.11.1 - /usr/local/bin/node
    npm: 5.6.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 67.0.3396.99
    Firefox: 60.0.2
    Safari: 11.1.2
  npmPackages:
    gatsby: ^1.9.277 => 1.9.277
    gatsby-link: ^1.6.46 => 1.6.46
    gatsby-plugin-react-helmet: ^2.0.11 => 2.0.11
    gatsby-plugin-styled-components: ^2.0.11 => 2.0.11
    gatsby-source-drupal: ^2.0.41 => 2.0.41
  npmGlobalPackages:
    gatsby-cli: 1.1.58

File contents (if changed)

gatsby-config.js:

module.exports = {
  siteMetadata: {
    apiUrl: 'http://dev.gatsby.d8',
    title: 'Gatsby Default Starter',
  },
  plugins: [
    'gatsby-plugin-react-helmet',
    'gatsby-plugin-styled-components',
    {
      resolve: 'gatsby-source-drupal',
      options: {
        baseUrl: 'http://dev.gatsby.d8/',
        apiBase: 'jsonapi',
      },
    }
  ],
}

package.json:

```{
"name": "gatsby-starter-default",
"description": "Gatsby default starter",
"version": "1.0.0",
"author": "Kyle Mathews mathews.kyle@gmail.com",
"dependencies": {
"gatsby": "^1.9.277",
"gatsby-link": "^1.6.46",
"gatsby-plugin-react-helmet": "^2.0.11",
"gatsby-plugin-styled-components": "^2.0.11",
"gatsby-source-drupal": "^2.0.41",
"react-helmet": "^5.2.0",
"styled-components": "^3.3.3"
},
"keywords": [
"gatsby"
],
"license": "MIT",
"scripts": {
"build": "gatsby build",
"develop": "gatsby develop",
"format": "prettier --write 'src/*/.js'",
"test": "echo \"Error: no test specified\" && exit 1"
},
"devDependencies": {
"prettier": "^1.13.7"
},
"repository": {
"type": "git",
"url": "https://github.com/gatsbyjs/gatsby-starter-default"
}
}


`gatsby-node.js`: 

/**

// You can delete this file if you're not using it

const path = require(path)

exports.createPages = ({ graphql, boundActionCreators }) => {
const { createPage } = boundActionCreators;

const loadRecipes = new Promise((resolve, reject) => {
graphql( { allNodeRecipe { edges { node { path { alias } } } } }
).then(result => {
result.data.allNodeRecipe.edges.map(({ node }) => {
createPage({
path: ${node.path.alias}/,
component: path.resolve(./src/templates/recipe.js),
context: {
slug: node.path.alias,
},
})
})
resolve()
})
})

return Promise.all([loadRecipes])
};
```

gatsby-browser.js: N/A
gatsby-ssr.js: N/A

screen shot 2018-08-02 at 10 48 13

image

stale? question or discussion

Most helpful comment

@soniCaH can You try setting gatsby-source-drupal version to next? I recently was adding some improvements to relationship handling that is not in stable release (as it did introduce some breaking change)

All 16 comments

@soniCaH can you send in a minimal reproduction repo of your code showing the error? Also, would be great to update to the latest beta of Gatsby and see if the error persists.

@Chuloo does this help?

I confirm the same behavior on Gatsby 2.0:

  System:
    OS: macOS High Sierra 10.13.6
    CPU: x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 9.11.1 - /usr/local/bin/node
    npm: 5.6.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 67.0.3396.99
    Firefox: 60.0.2
    Safari: 11.1.2
  npmPackages:
    gatsby: next => 2.0.0-beta.66
    gatsby-link: ^1.6.46 => 1.6.46
    gatsby-plugin-react-helmet: next => 3.0.0-beta.4
    gatsby-plugin-styled-components: ^2.0.11 => 2.0.11
    gatsby-source-drupal: ^2.0.41 => 2.0.41
  npmGlobalPackages:
    gatsby-cli: 1.1.58

Attached is the json api output of Drupal, in which you can see the field_author, field_recipe_category and field_tags are present (rename to jsonapi.json):

jsonapi.txt

image

@soniCaH can You try setting gatsby-source-drupal version to next? I recently was adding some improvements to relationship handling that is not in stable release (as it did introduce some breaking change)

Thanks @pieh ! That did the trick for recipe_category and tags!

uid/author still not appearing, but less relevant for me personally

Can you check if user endpoint is accessible and if it has entry with that id?

type: "user--user",
id: "800ceb27-ae6b-48bc-a061-e9a45891417e"

EDIT:
View user information permission did the trick! Thank you so much @pieh!

EDIT2:
Now I can retrieve the http://dev.gatsby.d8/jsonapi/user/user endpoint, but that doesn't fix the author/uid field. Still can't query them.

Maybe there is some kind of permission setting You could set in drupal to allow fetching user list for unauthenticated requests (I'm not sure what kind of data that endpoint provide - if that's something that isn't dangerous to do)? Other course of action would be to add ability to authenticate/login in drupal plugin, so it actually would have authorization to pull that data.

Hi there

First of all, I have to say I love GatsbyJS .. and using this with Drupal is really exciting!!

Having said that, I've found myself in a similar situation to @soniCaH.

Some of my entity references are carrying across well.

  • I currently have two content types in Drupal (blog and landing_page)
  • Each content type references one or more paragraph entity bundle types
  • The entities are linked using an 'entity reference revisions' field type

I'm using the @next version of gatsby-source-drupal.

The strange thing, is that while blog is pulling through referenced content — landing_page isn't!?

Running the following GraphQL query:

query {
    allNodeLandingPage {
      edges {
        node {
          relationships {
            field_main_content {
              __typename 
            }
          }
        }
      }
    }
  }

__typename is the only parameter that can be found via autocomplete.

Any advice would be really welcome.

Was a case of RTFM :/

In this case I needed to use GraphQL fragements (https://graphql.org/learn/queries/#fragments)

The same story
My edpoint http://example.com/jsonapi
image
Can not retrieve field_act_as (in my case)

@SergeyRe Your api seems to be returning inconsistent data:
http://roon1.akku.ru/jsonapi/taxonomy_term/acts_as returns only 2 terms with ids:

  • 83fe356d-d3cb-4d85-b42f-6d635daa62d3 ( "Headphone amplifier" )
  • 1441edfa-a170-408e-9496-eb1ee4cc1601 ( "Network player -analog ouput" )

And http://roon1.akku.ru/jsonapi/node/device doesn't reference neither of them

@pieh Yes , Thank you.You are right. I didn't check situation under Anonymous. Sorry for trouble

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

Thanks for being a part of the Gatsby community! 💪💜

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it.

Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else.

Thanks again for being part of the Gatsby community!

@pieh I'm having a what I think is a similar issue with some relationships not appearing as I would expect.

https://cms.dev.lib.umich.edu/jsonapi/node/page/22e6d054-20ad-4d2d-8efd-eb165b9983e1?resourceVersion=id%3A100000201

example

Could you help me figure out why only __typename is accessible on field_panels and not other related fields?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

magicly picture magicly  Â·  3Comments

3CordGuy picture 3CordGuy  Â·  3Comments

brandonmp picture brandonmp  Â·  3Comments

benstr picture benstr  Â·  3Comments

Oppenheimer1 picture Oppenheimer1  Â·  3Comments