Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

shouldUpdateScroll is not called on the initial page load #23792

Closed
muravitskiy opened this issue May 5, 2020 · 2 comments
Closed

shouldUpdateScroll is not called on the initial page load #23792

muravitskiy opened this issue May 5, 2020 · 2 comments
Assignees
Labels
type: bug An issue or pull request relating to a bug in Gatsby

Comments

@muravitskiy
Copy link

Description

I'm using anchor links like /help#faqs, but the page is not scrolled to the specified id on the initial load - shouldUpdateScroll is not called. If the website was loaded - clicking the link works as expected and page scrolls. One possible solution is to add componentDidMount to https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-react-router-scroll/src/ScrollBehaviorContext.js and call this.scrollBehavior.updateScroll but it is not clear what to use for prevRouterProps

Steps to reproduce

add export to your gatsby-browser.js

exports.shouldUpdateScroll = () => {
  console.log('Should update scroll');
}

update the page and check that no message is present

Expected result

shouldUpdateScroll is called and the anchor link scrolls the page

Actual result

shouldUpdateScroll is called only after clicking a link if the app is loaded already

Environment

System:
    OS: macOS 10.14.6
    CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 12.12.0 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.11.3 - /usr/local/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 81.0.4044.129
    Firefox: 70.0.1
    Safari: 13.1
  npmPackages:
    gatsby: ^2.15.28 => 2.20.10
    gatsby-image: ^2.2.21 => 2.3.1
    gatsby-plugin-catch-links: ^2.1.12 => 2.2.1
    gatsby-plugin-eslint: ^2.0.1 => 2.0.8
    gatsby-plugin-favicon: ^3.1.0 => 3.1.6
    gatsby-plugin-mdx: ^1.1.4 => 1.1.4
    gatsby-plugin-react-helmet: ^3.1.10 => 3.2.1
    gatsby-plugin-react-svg: ^3.0.0 => 3.0.0
    gatsby-plugin-resolve-src: ^2.0.0-beta.1 => 2.0.0
    gatsby-plugin-robots-txt: ^1.5.0 => 1.5.0
    gatsby-plugin-sass: ^2.1.17 => 2.2.1
    gatsby-plugin-sharp: ^2.5.3 => 2.5.3
    gatsby-plugin-sitemap: ^2.2.27 => 2.3.1
    gatsby-remark-copy-linked-files: ^2.2.3 => 2.2.3
    gatsby-remark-images: ^3.2.1 => 3.2.1
    gatsby-source-filesystem: ^2.2.2 => 2.2.2
    gatsby-transformer-remark: ^2.6.26 => 2.7.1
    gatsby-transformer-sharp: ^2.4.3 => 2.4.3
    gatsby-transformer-yaml: ^2.3.1 => 2.3.1
    gatsby-transformer-yaml-full: ^0.2.0 => 0.2.0
    gatsby-yaml-full-file: ^0.2.0 => 0.2.0
    gatsby-yaml-full-markdown: ^0.2.1 => 0.2.1
  npmGlobalPackages:
    gatsby-cli: 2.8.2
@muravitskiy muravitskiy added the type: bug An issue or pull request relating to a bug in Gatsby label May 5, 2020
@gatsbot gatsbot bot added the status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer label May 5, 2020
@danabrit danabrit added status: inkteam assigned and removed status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer labels May 5, 2020
@blainekasten
Copy link
Contributor

Fixed in latest!

@HashemKhalifa
Copy link

@blainekasten you saved my day, thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: bug An issue or pull request relating to a bug in Gatsby
Projects
None yet
Development

No branches or pull requests

4 participants