Gatsby: Gatsby Build + Gastby Serve + Anchor tag href change not working.

[vstojkovski]

Description

The href tag of the anchor tag was changed based on a state change in dev mode (gatsby develop). When I switched to the production environment using gatsby build + gatsby server the href is no long affected i.e it stays the same no matter the change.

Steps to reproduce

Create a link and make the href change based on a state. When using gatsby develop href changes, when using production env the href does not change.

Expected result

The href should change based on a state element. For example on first load stateHere is equal to '/test' after a change in the state it will be equal to /test-2, but the href attribute is not reflected with that change. However the text inside the anchor tag changes.

Actual result

On the change of the state, the link remained the same and the href was not changed. Both places should reflect the state change

Environment

System:
OS: macOS Mojave 10.14.6
CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 10.16.3 - ~/.nvm/versions/node/v10.16.3/bin/node
Yarn: 1.17.3 - ~/.yarn/bin/yarn
npm: 6.9.0 - ~/.nvm/versions/node/v10.16.3/bin/npm
Languages:
Python: 2.7.16 - /usr/bin/python
Browsers:
Chrome: 81.0.4044.138
Firefox: 75.0
Safari: 13.1
npmPackages:
gatsby: ^2.19.49 => 2.19.49
gatsby-cli: ^2.11.3 => 2.11.3
gatsby-image: ^2.2.39 => 2.2.39
gatsby-plugin-create-client-paths: ^2.1.23 => 2.1.23
gatsby-plugin-i18n: ^1.0.1 => 1.0.1
gatsby-plugin-manifest: ^2.2.39 => 2.2.39
gatsby-plugin-offline: ^3.0.32 => 3.0.32
gatsby-plugin-purgecss: ^4.0.1 => 4.0.1
gatsby-plugin-react-helmet: ^3.2.1 => 3.2.1
gatsby-plugin-resolve-src: ^2.0.0 => 2.0.0
gatsby-plugin-sass: ^2.1.29 => 2.1.29
gatsby-plugin-sharp: ^2.4.3 => 2.4.3
gatsby-source-filesystem: ^2.1.46 => 2.1.46
gatsby-source-graphql: ^2.1.33 => 2.1.33
gatsby-source-greenhouse: ^2.0.2 => 2.0.2
gatsby-source-marketo: ^1.0.2 => 1.0.2
gatsby-transformer-sharp: ^2.3.13 => 2.3.13
npmGlobalPackages:
gatsby: 2.19.28

Has anyone encountered this issue?

[madalynrose]

Hi @vstojkovski!

Sorry to hear you're running into an issue. To help us best begin debugging the underlying cause, it is incredibly helpful if you're able to create a minimal reproduction. This is a simplified example of the issue that makes it clear and obvious what the issue is and how we can begin to debug it.

If you're up for it, we'd very much appreciate if you could provide a minimal reproduction and we'll be able to take another look.

Thanks for using Gatsby! 💜

[julienfouilhe]

@madalynrose Encountered the same issue.

Here is the minimal bug repro : https://github.com/julienfouilhe/gatsby-bug-repro (in page-2)

Here is a small example:

const PageComponent = ({location}: {location: Location}) =>  {
   console.log("Render page component");
   return <a href={`https://google.com${location.search ?? ""}`}>Link to site</a>;
};

If you gatsby build, then gatsby serve, and go to http://localhost:9000/page-2?searchParam, you'll see that the search is actually not forwarded to Google. The PageComponent is rerendered normally though (the console.log is displayed properly), but the href attribute is not updated in the DOM.

If you do this:

const PageComponent = ({location}: {location: Location}) =>  {
   console.log("Render page component");
   return <a href={`https://google.com${location.search ?? ""}`}>Link to site {location.search}</a>;
};

You'll see that the location.search is displayed in the <a> tag, but not in the href...

I think it is discussed here: https://github.com/gatsbyjs/gatsby/issues/17914

[github-actions[bot]]

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!
As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

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

[julienfouilhe]

I don't think this is stale

[github-actions[bot]]

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!
As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

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

[github-actions[bot]]

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.
As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

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