Reactjs.org: Can't find "Edit this page" link

[gaearon]

I thought we had a link like this on every page. I can't find it. Where did it go?

[killynathan]

Hi, I would love to take a stab at this.

[edieblu]

Hi @gaearon the issue is in reactjs.org/src/components/MarkdownPage/MarkdownPage.js line 111 where markdownRemark.fields.path && evaluates to null and so the Edit this page, which is what follows, doesn't get shown.
I'm not sure how to fix it yet, but I can look into it in the following days and hopefully come up with a fix!

[killynathan]

is there any chance this bug comes from GH-1065 where it changes graphql formats for path?

[alexkrolick]

Yes it probably came from that. I am not sure why that was not a breaking change in Gatsby.

[arturopuente]

Hi, took a look at this an saw the same issue you have already mentioned. I can see gatsby/onCreateNode.js still assigns path to a string:

createNodeField({
  node,
  name: 'path',
  value: relativePath,
});

And src/types.js still has it defined as a string as well.

[raunofreiberg]

Not sure if relevant, but Gatsby never passes this case when building for me:

https://github.com/reactjs/reactjs.org/blob/master/gatsby/onCreateNode.js#L31

[gaearon]

Anyone figured it out?

[FadySamirSadek]

@gaearon would love to pick this one up if it is available?

[alexkrolick]

It's available, go for it! Added the in-progress label, just notify here again if you change your mind.

You may want to check against the changes in https://github.com/reactjs/reactjs.org/pull/1104.

[FadySamirSadek]

@alexkrolick Will keep you updated, Thanks.

[DZuz14]

Feel free to use this as a temp fix if @FadySamirSadek does not find the root cause of why markdownRemark.fields.path is showing up null. I tested this locally, and it looks like it at-least will get all of the edit buttons back up for now.

Not sure if it would work after a build, but I have been coding all day, and have no bandwidth for this. Just thought it might help.

https://gist.github.com/DZuz14/808c5af1d9120bf860ae56d4ac676506

[mknepprath]

@FadySamirSadek You can use my fix here if you'd like: https://github.com/reactjs/reactjs.org/compare/master...mknepprath:fix-edit-this-page-button

It appears to be a Gatsby issue that was fixed in a recent patch. Updating from ^1.9.273 to ^1.9.277 fixes the links when reverting the addition of the ids.

[FadySamirSadek]

@mknepprath I was thinking the same thing but it generates an error

`error GraphQL Error Field "path" of type "File" must have a selection of subfields. Did you mean "path {... }"?

file: /Users/fadysadek/Documents/projects/reactjs.org/src/pages/docs/error-decoder.html.js

1 |
2 | query ErrorPageMarkdown($slug: String!) {
3 | markdownRemark(fields: {slug: {eq: $slug}}) {
4 | html
5 | fields {

6 | path
| ^
7 | }
8 | frontmatter {
9 | title
10 | }
11 | }
12 | errorCodesJson {
13 | internal {
14 | contentDigest
15 | }
16 | }
`

[alexandernanberg]

This is really confusing, I've the same problem in the Gatsby 2 PR #1104.

I've no idea why path becomes an object when assigning it to therelativePath.
But it will be a string if we append something on it...

createNodeField({
  node,
  name: 'path',
  value: relativePath + 'whatever',  // can't be an empty string and String(relativePath) does not work either
});

I've also tried replicating this with the gatsby-starter-blog but was unable to, so that probably means that there is something wrong in our code or some plugin we are using.

My best guess is that something is checking if the field is a valid url and then converting it.

@KyleAMathews do you have any ideas?

[mknepprath]

@FadySamirSadek @alexandernanberg Per https://github.com/gatsbyjs/gatsby/pull/2255, it seems to convert it to a File node due to it being a relative path, so I'd agree that it has something to do with it checking whether it detects that it's a url.

@FadySamirSadek Did you pull my branch and get that error? Very strange, because that's the error I was getting until I updated the package and removed the id subfield - now it works as expected. I'll try again from scratch...

[mknepprath]

Well, this is strange - I switched to master, reset everything, and it's _still_ fixed for me... The edit link is showing up and I get the reverse error:

GraphQL Error Field "path" must not have a selection since type "String" has no subfields.

  file: /Users/mknepprath/GitHub/reactjs.org/src/pages/docs/error-decoder.html.js

   1 |
   2 |   query ErrorPageMarkdown($slug: String!) {
   3 |     markdownRemark(fields: {slug: {eq: $slug}}) {
   4 |       html
   5 |       fields {
>  6 |         path {
     |              ^
   7 |           id
   8 |         }
   9 |       }
  10 |       frontmatter {
  11 |         title
  12 |       }
  13 |     }
  14 |     errorCodesJson {
  15 |       internal {
  16 |         contentDigest

...Is it a difference between our environments?

[FadySamirSadek]

@mknepprath I have no idea, tried to delete node_modules and reset npm cache still is not working. If you are confident that the change you made solves this issue please open a PR to solve it till we figure out what is causing this,. Thanks.

[alexandernanberg]

By "reset eveything" does that include removing the .cache folder gatsby creates? I've run into some problems with that being cached very hard.

[mknepprath]

After further investigation, I realized I still had the version in package.json set to ^1.9.277... if I downgrade it back to ^1.9.273, the edit button goes away. That does seem to be the fix - I'll put in a PR!

@alexandernanberg I meant removing node_modules and the .cache, yeah. That made no difference, but the version bump did. My guess would be that it comes down to better parent detection, but we'd have to sift through their issues to figure that out.

[mknepprath]

This has me going in circles! Alright, it's not the version bump of gatsby, it's only fixed after I run yarn upgrade gatsby, so it's likely one of the peer dependencies that gets caught in that net and upgraded. I'll report back once I've dug a bit more.

EDIT: The steps I follow to "fix" this are as follows...

1. Delete node_modules and the .cache
2. Update gatsby to ^1.9.277 in package.json and run yarn to apply the change
3. Run yarn upgrade gatsby
4. Run yarn dev

You should now be getting the path, and the edit link should appear once the ids are removed. The reason I haven't put in a PR is this - if I push the above changes to a new branch, then run yarn && yarn dev, I get the original error message error GraphQL Error Field "path" of type "File" must have a selection of subfields again. I'm not sure why that would end up yielding a different result, though. 🤔

[meetzaveri]

Still not finding 'edit this page link' on website. Is it in progress ?

[alexkrolick]

Fixed by #1226 🎉