Which @angular/* package(s) are the source of the bug?

router

Is this a regression?

No

Description

Projects will often use a CSS attribute to enable smooth scrolling. An example in normalize.css:

:root {
    @media (prefers-reduced-motion: no-preference) {
        scroll-behavior: smooth;
    }
}

When you add this to an Angular project combined with the withInMemoryScrolling feature enabled, users may experience a weird page transition. After navigation and the new page is renderered, the page slowly scrolls up to the top. This gets more annoying when the scroll distance gets higher.

When a user navigates to another page, he/she expects to see the top of the new page without a scroll animation when arriving at the page. Therefor my proposal is to improve the router scroller to avoid having a smooth scroll animation during navigation.

The native window.scrollTo method supports a "behavior" option in which JS can override the behavior defined by CSS.

The changes required (imo) are:

• Improve the @angular/common BrowserViewPortScroller to support the native behavior option.
• Change the @angular/router RouterScroller to pass the "instant" behavior when the user navigates to a different page.

Final remarks:

• If navigation occurs between two states on the same page (ie. pagination), one could argue that the smooth scrolling is desirable. Not sure if this is possible, but RouterScroller should only set "behavior: instant" only when the new component is different than the previous component.
• This change could be opt-in for backwards compatibility, so configuration options may be added to the inMemoryScrolling provider.

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/stackblitz-starters-hnp8mh

Please provide the exception or error you saw

• Scroll down the page
• Click on "Details" button in any of the items in the list

You should now see the detail page appear instantly with a smooth transition scrolling to the top

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 18.1.2
Node: 18.20.2
Package Manager: yarn 4.1.0
OS: darwin arm64

Angular: 18.1.2
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, language-service, localize, platform-browser
... platform-browser-dynamic, platform-server, router, ssr

Package Version

@angular-devkit/architect 0.1801.2
@angular-devkit/build-angular 18.1.2
@angular-devkit/core 18.1.2
@angular-devkit/schematics 18.1.2
@schematics/angular 18.1.2
ng-packagr 18.1.0
rxjs 7.8.1
typescript 5.5.4
zone.js 0.14.4

Anything else?

I can make a PR for this, just let me know if the given proposal is acceptable...