Issue #37 : On editing a post, scroll partial to top of preview.

[kienstra]

Request For Review

Hi @westonruter,
Could you please review this pull request for Issue #37?

Editing a post field already triggers a refresh of its partial.
So in the refresh() method, define and call scrollPartialToTopOfPage.
Some themes have a margin-top of the #page element, like Twenty Sixteen.
And scrolling would hide part of the partial (see screenshot below).
So calculate the offsetTop of #page, to prevent this.
If this isn't a concern, this commit could be less verbose.

[westonruter]

@kienstra Yeah, there is a much simpler approach you can take here. Namely element.scrollIntoView(). If available, you could actually use element.scrollIntoViewIfNeeded().

Something to bear in mind is whether or not these methods trigger scroll events. If they don't, you'll probably want to manually trigger it on the window so that the scroll message will be sent to the parent frame to remember the scroll position.

[westonruter]

@kienstra also, instead of adding this to the refresh method, I suggest instead that you extend the preparePlacement method, like so:

preparePlacement: function( placement ) {
    var partial = this;
    // @todo placement.container[0].scrollIntoViewIfNeeded(); ...
    return api.selectiveRefresh.Partial.prototype.preparePlacement.call( partial, placement );
}

[kienstra]

Thanks, @westonruter. You raise good points here.