Skip to content

Reset scroll position after navigation. Fixes #10482 #12423

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

Merged
merged 3 commits into from
Jul 24, 2019

Conversation

SteveSandersonMS
Copy link
Member

This only affects link clicks and programmatic navigation.

For back/forwards, browsers already apply their own native scroll position restoration behavior, which varies between browsers, so we leave that alone.

@SteveSandersonMS SteveSandersonMS added the area-blazor Includes: Blazor, Razor Components label Jul 22, 2019
@SteveSandersonMS SteveSandersonMS force-pushed the stevesa/10482-reset-scroll-on-navigate branch 2 times, most recently from 5fbcddc to cd85731 Compare July 22, 2019 11:41
Browser.Equal(0, () => BrowserScrollY);
}

private long BrowserScrollY
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is kind of confusing. I would have simply used methods for this.

Copy link
Member

@javiercn javiercn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great change!

Straightforward and with E2E, nice!

@SteveSandersonMS SteveSandersonMS force-pushed the stevesa/10482-reset-scroll-on-navigate branch from cd85731 to 1d4be1e Compare July 22, 2019 15:17
@SteveSandersonMS SteveSandersonMS force-pushed the stevesa/10482-reset-scroll-on-navigate branch from 1d4be1e to 4bc6696 Compare July 24, 2019 15:48
@SteveSandersonMS SteveSandersonMS merged commit 54da777 into master Jul 24, 2019
@ghost ghost deleted the stevesa/10482-reset-scroll-on-navigate branch July 24, 2019 17:26
@mkArtakMSFT mkArtakMSFT added the tell-mode Indicates a PR which is being merged during tell-mode label Jul 25, 2019
@kaveh6202
Copy link

kaveh6202 commented Aug 19, 2019

I think there is a problem with this approach , you see, I have a collapse component in my page and it is kind of in the bottom of the page . when i toggle a tab within my component , the normal behavior for page in this situation is not to scroll and stay put since i have inner page link ( starts with # ) in href attribute of my "a" tag.

@smirceamihai
Copy link

Agree with @kaveh6202
Please consider:

  • Turning this into an optional (parameter) feature for the NavigateTo method
  • Disabling the scroll reset if the navigation goes to the same LocalPath (only query params change)

For us the workaround was overriding the default behavior with an interop method:

async function navigateToState (url) { history.replaceState(null, null, url); await DotNet.invokeMethodAsync( 'Microsoft.AspNetCore.Components.WebAssembly', 'NotifyLocationChanged', url, false // IsNavigationIntercepted ); }

@ghost
Copy link

ghost commented Feb 14, 2021

Hi @smirceamihai. It looks like you just commented on a closed PR. The team will most probably miss it. If you'd like to bring something important up to their attention, consider filing a new issue and add enough details to build context.

@christallire
Copy link

Agree with @kaveh6202 Please consider:

  • Turning this into an optional (parameter) feature for the NavigateTo method
  • Disabling the scroll reset if the navigation goes to the same LocalPath (only query params change)

For us the workaround was overriding the default behavior with an interop method:

async function navigateToState (url) { history.replaceState(null, null, url); await DotNet.invokeMethodAsync( 'Microsoft.AspNetCore.Components.WebAssembly', 'NotifyLocationChanged', url, false // IsNavigationIntercepted ); }

for anyone who stumbled this on .NET 7
there's some internal changes at the API. need to add history argument after the url like this:

await DotNet.invokeMethodAsync( 'Microsoft.AspNetCore.Components.WebAssembly', 'NotifyLocationChanged', url, '', false);

@ghost
Copy link

ghost commented Nov 9, 2022

Hi @christallire. It looks like you just commented on a closed PR. The team will most probably miss it. If you'd like to bring something important up to their attention, consider filing a new issue and add enough details to build context.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-blazor Includes: Blazor, Razor Components tell-mode Indicates a PR which is being merged during tell-mode
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants