Daniel F Pupius described the problem as:
Lots of sites get this wrong and it’s really annoying. When the user navigates using the browser’s forward or back button the scroll position should be the same as it was last time they were on the page. This sometimes works correctly on Facebook but sometimes doesn’t. Google+ always seems to lose your scroll position.
So there are already numerous questions about resetting the scroll to the top of the page when browsing to a new page. Ember.js's Cookbook also shows how to hook into Route.activate
:
export default Ember.Mixin.create({
activate: function() {
this._super();
window.scrollTo(0,0);
}
});
However this only solves halve the problem. When the user uses the back/forward buttons, the scroll position will not be restored, but simply reset.
There are quite a few attempts into solving this, many by just storing the scroll position inside the Ember.Controller
instance, for example in this article. However this is only a partial solution. If the controller is used multiple times, only a single scroll state will be preserved.
How can the default browser implementation of restoring the old scroll state be preserved? Thus, do nothing if Route.activate
was triggered from a html5 history state change?