Gatsby: Scroll to hash will attempt to scroll, even if the hash is not a valid selector

[McInkay]

Description

Since 2.23.6, if you put in a hash that isn't a valid selector (for example including a = character), then we get an error when gatsby tries to scroll to that hash, and the whole application dies.

Steps to reproduce

Take any gatsby site, go to any url and put this hash on the end: #test=test.

For example: https://90bvv-8000.sse.codesandbox.io/#test=test

Expected result

I understand that this is an example where we are doing something wrong and expecting it to work, but I would expect this to do nothing. I would expect it to load with the hash, keep the hash in the url and do nothing out of the ordinary.

I would expect this to do the same as you do on a plain html site, which is nothing. I wouldn't expect it to manage to scroll anywhere, because obviously that doesn't make any sense, but I would expect it to do nothing else.

Actual result

We get a crash, because querySelector complains that it isn't a valid selector.

Environment

System:
OS: Linux 5.6 Fedora 32 (Workstation Edition) 32 (Workstation Edition)
CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
Shell: 5.8 - /usr/bin/zsh
Binaries:
Node: 12.16.3 - /usr/bin/node
Yarn: 1.21.1 - /usr/bin/yarn
npm: 6.14.4 - /usr/bin/npm
Languages:
Python: 3.8.3 - /usr/bin/python
Browsers:
Chrome: 83.0.4103.106
Firefox: 77.0.1
npmPackages:
gatsby: 2.23.9 => 2.23.9
gatsby-link: 2.4.7 => 2.4.7
gatsby-plugin-react-helmet: 3.3.5 => 3.3.5
gatsby-plugin-styled-components: 3.3.5 => 3.3.5
gatsby-source-filesystem: 2.3.13 => 2.3.13
gatsby-transformer-json: 2.4.6 => 2.4.6

[CharlieRick]

We have run into this issue ourselves, I think it's being caused by a recent update of this dependency - https://www.npmjs.com/package/gatsby-react-router-scroll

We're using keycloak which puts the state as a hash in the url and it is breaking our entire application, coming up with a similar error to yourself. We would appreciate a fix for this so that we don't need to worry about managing versions. About to attempt rolling back the version of gatsby-react-router-scroll to 3.0.0.

[CharlieRick]

Rolling back to version 3.0.1 has worked as a temporary fix.

Add "gatsby-react-router-scroll": "3.0.1" to your package.json and npm install again :)

[shavidzet]

I don't like rolling back version :smile:
As I dived in source code it's already fixed, but it is not shipped yet in npm registry :cry:

[blainekasten]

This was fixed by https://github.com/gatsbyjs/gatsby/pull/25161, let me publish a new version of gatsby quick!

[blainekasten]

Published!

[email protected]
[email protected]