[MD History] Make forward/backward work in grouped mode.

chrome/browser/resources/md_history/list_container.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 Polymer({
   is: 'history-list-container',
 
   properties: {
     // The path of the currently selected page.
     selectedPage_: String,
 
     // Whether domain-grouped history is enabled.
     grouped: Boolean,
 
     /** @type {HistoryRange} */
     groupedRange: {type: Number, observer: 'groupedRangeChanged_'},
 
     /** @type {!QueryState} */
     queryState: Object,
 
     /** @type {!QueryResult} */
     queryResult: Object,
   },
 
   observers: [
     'searchTermChanged_(queryState.searchTerm)',
+    'groupedOffsetChanged_(queryState.groupedOffset)',
   ],
 
   listeners: {
     'history-list-scrolled': 'closeMenu_',
     'load-more-history': 'loadMoreHistory_',
     'toggle-menu': 'toggleMenu_',
   },
 
   /**
    * @param {HistoryQuery} info An object containing information about the
    *    query.
-   * @param {!Array<HistoryEntry>} results A list of results.
+   * @param {!Array<!HistoryEntry>} results A list of results.
    */
   historyResult: function(info, results) {
     this.initializeResults_(info, results);
     this.closeMenu_();
 
     if (info.term && !this.queryState.incremental) {
       Polymer.IronA11yAnnouncer.requestAvailability();
       this.fire('iron-announce', {
         text:
             md_history.HistoryItem.searchResultsTitle(results.length, info.term)
@@ skipping 96 matching lines @@
    * @param {HistoryRange} range
    * @private
    */
   groupedRangeChanged_: function(range, oldRange) {
     this.selectedPage_ = range == HistoryRange.ALL_TIME ?
       'infinite-list' : 'grouped-list';
 
     if (oldRange == undefined)
       return;
 
+    this.set('queryState.groupedOffset', 0);
+
+    // Reset the results on range change to prevent stale results from being
+    // processed into the incoming range's UI.
+    if (this.queryResult.info) {
+      this.set('queryResult.results', []);
+      this.historyResult(this.queryResult.info, []);
+    }
+
     this.queryHistory(false);
     this.fire('history-view-changed');
   },
 
   /** @private */
   searchTermChanged_: function() {
     this.queryHistory(false);
     // TODO(tsergeant): Ignore incremental searches in this metric.
     if (this.queryState.searchTerm)
       md_history.BrowserService.getInstance().recordAction('Search');
   },
 
   /** @private */
+  groupedOffsetChanged_: function() {
+    this.queryHistory(false);
+  },
+
+  /** @private */
   loadMoreHistory_: function() { this.queryHistory(true); },
 
   /**
    * @param {HistoryQuery} info
    * @param {!Array<HistoryEntry>} results
    * @private
    */
   initializeResults_: function(info, results) {
     if (results.length == 0)
       return;
@@ skipping 100 matching lines @@
    * @return {HTMLElement}
    * @private
    */
   getSelectedList_: function() { return this.$.content.selectedItem; },
 
   /** @private */
   canDeleteHistory_: function() {
     return loadTimeData.getBoolean('allowDeletingHistory');
   }
 });