[MD History] Add UMA stats for switching views and the CBD button.

chrome/browser/resources/md_history/app.crisper.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.
 
 /**
  * @fileoverview PromiseResolver is a helper class that allows creating a
  * Promise that will be fulfilled (resolved or rejected) some time later.
  *
  * Example:
  *  var resolver = new PromiseResolver();
@@ skipping 11421 matching lines @@
      */
     deleteForeignSession: function(sessionTag) {
       chrome.send('deleteForeignSession', [sessionTag]);
     },
 
     openClearBrowsingData: function() {
       chrome.send('clearBrowsingData');
     },
 
     /**
+     * @param {string} histogram
+     * @param {number} value
+     * @param {number} max
+     */
+    recordHistogram: function(histogram, value, max) {
+      chrome.send('metricsHandler:recordInHistogram', [histogram, value, max]);
+    },
+
+    /**
     * Record an action in UMA.
     * @param {string} actionDesc The name of the action to be logged.
     */
     recordAction: function(actionDesc) {
       chrome.send('metricsHandler:recordAction', [actionDesc]);
     },
 
     /**
      * @param {boolean} successful
      * @private
@@ skipping 2894 matching lines @@
 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: [
-    'groupedRangeChanged_(queryState.range)',
-  ],
-
   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.
@@ skipping 37 matching lines @@
     this.set('queryState.querying', true);
     this.set('queryState.incremental', incremental);
 
     var lastVisitTime = 0;
     if (incremental) {
       var lastVisit = this.queryResult.results.slice(-1)[0];
       lastVisitTime = lastVisit ? lastVisit.time : 0;
     }
 
     var maxResults =
-      queryState.range == HistoryRange.ALL_TIME ? RESULTS_PER_PAGE : 0;
+      this.groupedRange == HistoryRange.ALL_TIME ? RESULTS_PER_PAGE : 0;
     chrome.send('queryHistory', [
       queryState.searchTerm, queryState.groupedOffset, queryState.range,
       lastVisitTime, maxResults
     ]);
   },
 
   /** @return {number} */
   getSelectedItemCount: function() {
     return this.getSelectedList_().selectedPaths.size;
   },
@@ skipping 12 matching lines @@
       return;
     this.$.dialog.get().then(function(dialog) {
       dialog.showModal();
     });
   },
 
   /**
    * @param {HistoryRange} range
    * @private
    */
-  groupedRangeChanged_: function(range) {
-    this.selectedPage_ = this.queryState.range == HistoryRange.ALL_TIME ?
+  groupedRangeChanged_: function(range, oldRange) {
+    this.selectedPage_ = range == HistoryRange.ALL_TIME ?
       'infinite-list' : 'grouped-list';
 
+    if (oldRange == undefined)
+      return;
+
     this.queryHistory(false);
+    this.fire('history-view-changed');
   },
 
   /** @private */
   loadMoreHistory_: function() { this.queryHistory(true); },
 
   /**
    * @param {HistoryQuery} info
    * @param {!Array<HistoryEntry>} results
    * @private
    */
@@ skipping 223 matching lines @@
     /**
      * An array of synced devices with synced tab data.
      * @type {!Array<!ForeignDeviceInternal>}
      */
     syncedDevices_: {
       type: Array,
       value: function() { return []; }
     },
 
     /** @private */
-    signInState_: {
+    signInState: {
       type: Boolean,
-      value: loadTimeData.getBoolean('isUserSignedIn'),
+      observer: 'signInStateChanged_',
     },
 
     /** @private */
     guestSession_: {
       type: Boolean,
       value: loadTimeData.getBoolean('isGuestSession'),
     },
 
     /** @private */
     fetchingSyncedTabs_: {
@@ skipping 165 matching lines @@
    */
   tabSyncDisabled: function() {
     this.fetchingSyncedTabs_ = false;
     this.clearDisplayedSyncedDevices_();
   },
 
   /**
    * Get called when user's sign in state changes, this will affect UI of synced
    * tabs page. Sign in promo gets displayed when user is signed out, and
    * different messages are shown when there are no synced tabs.
-   * @param {boolean} isUserSignedIn
+   * @param {boolean} signInState
    */
-  updateSignInState: function(isUserSignedIn) {
-    // If user's sign in state didn't change, then don't change message or
-    // update UI.
-    if (this.signInState_ == isUserSignedIn)
-      return;
-
-    this.signInState_ = isUserSignedIn;
+  signInStateChanged_: function() {
+    this.fire('history-view-changed');
 
     // User signed out, clear synced device list and show the sign in promo.
-    if (!isUserSignedIn) {
+    if (!this.signInState) {
       this.clearDisplayedSyncedDevices_();
       return;
     }
     // User signed in, show the loading message when querying for synced
     // devices.
     this.fetchingSyncedTabs_ = true;
   },
 
   searchTermChanged: function(searchTerm) {
     this.clearDisplayedSyncedDevices_();
@@ skipping 71 matching lines @@
 
   });
 // 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-side-bar',
 
   properties: {
-    selectedPage: {
-      type: String,
-      notify: true
-    },
+    selectedPage: {type: String, notify: true},
 
     route: Object,
 
     showFooter: Boolean,
 
     // If true, the sidebar is contained within an app-drawer.
-    drawer: {
-      type: Boolean,
-      reflectToAttribute: true
-    },
-  },
-
-  /** @private */
-  onSelectorActivate_: function() {
-    this.fire('history-close-drawer');
+    drawer: {type: Boolean, reflectToAttribute: true},
   },
 
   /**
+   * @private
+   */
+  onSelectorActivate_: function() { this.fire('history-close-drawer'); },
+
+  /**
    * Relocates the user to the clear browsing data section of the settings page.
    * @param {Event} e
    * @private
    */
   onClearBrowsingDataTap_: function(e) {
+    md_history.BrowserService.getInstance().recordAction(
+        'HistoryPage_InitClearBrowsingData');
     md_history.BrowserService.getInstance().openClearBrowsingData();
     e.preventDefault();
   },
 
   /**
    * @param {Object} route
    * @private
    */
-  getQueryString_: function(route) {
-    return window.location.search;
-  }
+  getQueryString_: function(route) { return window.location.search; }
 });
 // 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-app',
 
   properties: {
     showSidebarFooter: Boolean,
 
     // The id of the currently selected page.
-    selectedPage_: {type: String, value: 'history', observer: 'unselectAll'},
+    selectedPage_: {type: String, observer: 'unselectAll'},
 
     // Whether domain-grouped history is enabled.
     grouped_: {type: Boolean, reflectToAttribute: true},
 
     /** @type {!QueryState} */
     queryState_: {
       type: Object,
       value: function() {
         return {
           // Whether the most recent query was incremental.
           incremental: false,
           // A query is initiated by page load.
           querying: true,
           queryingDisabled: false,
           _range: HistoryRange.ALL_TIME,
           searchTerm: '',
           // TODO(calamity): Make history toolbar buttons change the offset
           groupedOffset: 0,
 
           set range(val) { this._range = Number(val); },
           get range() { return this._range; },
         };
       }
     },
 
-   /** @type {!QueryResult} */
+    /** @type {!QueryResult} */
     queryResult_: {
       type: Object,
       value: function() {
         return {
           info: null,
           results: null,
           sessionList: null,
         };
       }
     },
 
     // Route data for the current page.
     routeData_: Object,
 
     // The query params for the page.
     queryParams_: Object,
 
     // True if the window is narrow enough for the page to have a drawer.
     hasDrawer: Boolean,
+
+    isUserSignedIn_: {
+      type: Boolean,
+      // Updated on synced-device-manager attach by chrome.sending
+      // 'otherDevicesInitialized'.
+      value: loadTimeData.getBoolean('isUserSignedIn'),
+    },
   },
 
   observers: [
     // routeData_.page <=> selectedPage
     'routeDataChanged_(routeData_.page)',
     'selectedPageChanged_(selectedPage_)',
 
     // queryParams_.q <=> queryState.searchTerm
     'searchTermChanged_(queryState_.searchTerm)',
     'searchQueryParamChanged_(queryParams_.q)',
 
   ],
 
   // TODO(calamity): Replace these event listeners with data bound properties.
   listeners: {
     'cr-menu-tap': 'onMenuTap_',
     'history-checkbox-select': 'checkboxSelected',
     'unselect-all': 'unselectAll',
     'delete-selected': 'deleteSelected',
     'search-domain': 'searchDomain_',
     'history-close-drawer': 'closeDrawer_',
+    'history-view-changed': 'recordHistoryView_',
   },
 
   /** @override */
   ready: function() {
     this.grouped_ = loadTimeData.getBoolean('groupByDomain');
 
     cr.ui.decorate('command', cr.ui.Command);
     document.addEventListener('canExecute', this.onCanExecute_.bind(this));
     document.addEventListener('command', this.onCommand_.bind(this));
 
@@ skipping 28 matching lines @@
    * @private
    */
   unselectAll: function() {
     var listContainer =
         /** @type {HistoryListContainerElement} */ (this.$.history);
     var toolbar = /** @type {HistoryToolbarElement} */ (this.$.toolbar);
     listContainer.unselectAllItems(toolbar.count);
     toolbar.count = 0;
   },
 
-  deleteSelected: function() {
-    this.$.history.deleteSelectedWithPrompt();
-  },
+  deleteSelected: function() { this.$.history.deleteSelectedWithPrompt(); },
 
   /**
    * @param {HistoryQuery} info An object containing information about the
    *    query.
    * @param {!Array<HistoryEntry>} results A list of results.
    */
   historyResult: function(info, results) {
     this.set('queryState_.querying', false);
     this.set('queryResult_.info', info);
     this.set('queryResult_.results', results);
     var listContainer =
         /** @type {HistoryListContainerElement} */ (this.$['history']);
     listContainer.historyResult(info, results);
   },
 
   /**
    * Focuses the search bar in the toolbar.
    */
-  focusToolbarSearchField: function() {
-    this.$.toolbar.showSearchField();
-  },
+  focusToolbarSearchField: function() { this.$.toolbar.showSearchField(); },
 
   /**
    * Fired when the user presses 'More from this site'.
    * @param {{detail: {domain: string}}} e
    */
   searchDomain_: function(e) { this.$.toolbar.setSearchTerm(e.detail.domain); },
 
   /**
    * @param {Event} e
    * @private
@@ skipping 57 matching lines @@
     }
 
     this.set('queryResult_.sessionList', sessionList);
   },
 
   /**
    * Update sign in state of synced device manager after user logs in or out.
    * @param {boolean} isUserSignedIn
    */
   updateSignInState: function(isUserSignedIn) {
-    var syncedDeviceManagerElem =
-      /** @type {HistorySyncedDeviceManagerElement} */this
-          .$$('history-synced-device-manager');
-    if (syncedDeviceManagerElem)
-      syncedDeviceManagerElem.updateSignInState(isUserSignedIn);
+    this.isUserSignedIn_ = isUserSignedIn;
   },
 
   /**
    * @param {string} selectedPage
    * @return {boolean}
    * @private
    */
   syncedTabsSelected_: function(selectedPage) {
     return selectedPage == 'syncedTabs';
   },
 
   /**
    * @param {boolean} querying
    * @param {boolean} incremental
    * @param {string} searchTerm
    * @return {boolean} Whether a loading spinner should be shown (implies the
    *     backend is querying a new search term).
    * @private
    */
   shouldShowSpinner_: function(querying, incremental, searchTerm) {
     return querying && !incremental && searchTerm != '';
   },
 
   /**
    * @param {string} page
    * @private
    */
-  routeDataChanged_: function(page) {
-    this.selectedPage_ = page;
-  },
+  routeDataChanged_: function(page) { this.selectedPage_ = page; },
 
   /**
    * @param {string} selectedPage
    * @private
    */
   selectedPageChanged_: function(selectedPage) {
     this.set('routeData_.page', selectedPage);
+    this.recordHistoryView_();
   },
 
   /**
    * This computed binding is needed to make the iron-pages selector update when
    * the synced-device-manager is instantiated for the first time. Otherwise the
    * fallback selection will continue to be used after the corresponding item is
    * added as a child of iron-pages.
    * @param {string} selectedPage
    * @param {Array} items
    * @return {string}
    * @private
    */
-  getSelectedPage_: function(selectedPage, items) {
-    return selectedPage;
-  },
+  getSelectedPage_: function(selectedPage, items) { return selectedPage; },
 
   /** @private */
   closeDrawer_: function() {
     var drawer = this.$$('#drawer');
     if (drawer)
       drawer.close();
   },
+
+  /** @private */
+  recordHistoryView_: function() {
+    var histogramValue = HistoryViewHistogram.END;
+    switch (this.selectedPage_) {
+      case 'syncedTabs':
+        histogramValue = this.isUserSignedIn_ ?
+            HistoryViewHistogram.SYNCED_TABS :
+            HistoryViewHistogram.SIGNIN_PROMO;
+        break;
+      default:
+        switch (this.queryState_.range) {
+          case HistoryRange.ALL_TIME:
+            histogramValue = HistoryViewHistogram.HISTORY;
+            break;
+          case HistoryRange.WEEK:
+            histogramValue = HistoryViewHistogram.GROUPED_WEEK;
+            break;
+          case HistoryRange.MONTH:
+            histogramValue = HistoryViewHistogram.GROUPED_MONTH;
+            break;
+        }
+        break;
+    }
+
+    md_history.BrowserService.getInstance().recordHistogram(
+      'History.HistoryView', histogramValue, HistoryViewHistogram.END
+    );
+  },
 });