Report UI latency for opening a file diff view

The metric is reported as StartupDiffViewDisplayed for initial load and
DiffViewDisplayed while navigating the app.

Change-Id: I4e24676d521a9bb8e8bbc3712d62ffdfda243839

polygerrit-ui/app/elements/core/gr-reporting/gr-reporting.js

@@ -41,14 +41,17 @@
   const TIMER = {
     CHANGE_DISPLAYED: 'ChangeDisplayed',
     DASHBOARD_DISPLAYED: 'DashboardDisplayed',
+    DIFF_VIEW_DISPLAYED: 'DiffViewDisplayed',
     PLUGINS_LOADED: 'PluginsLoaded',
     STARTUP_CHANGE_DISPLAYED: 'StartupChangeDisplayed',
     STARTUP_DASHBOARD_DISPLAYED: 'StartupDashboardDisplayed',
+    STARTUP_DIFF_VIEW_DISPLAYED: 'StartupDiffViewDisplayed',
   };
 
   const STARTUP_TIMERS = {};
   STARTUP_TIMERS[TIMER.PLUGINS_LOADED] = 0;
   STARTUP_TIMERS[TIMER.STARTUP_CHANGE_DISPLAYED] = 0;
+  STARTUP_TIMERS[TIMER.STARTUP_DIFF_VIEW_DISPLAYED] = 0;
   STARTUP_TIMERS[TIMER.STARTUP_DASHBOARD_DISPLAYED] = 0;
 
   const INTERACTION_TYPE = 'interaction';
@@ -176,6 +179,7 @@
       }
       this.time(TIMER.CHANGE_DISPLAYED);
       this.time(TIMER.DASHBOARD_DISPLAYED);
+      this.time(TIMER.DIFF_VIEW_DISPLAYED);
     },
 
     locationChanged(page) {
@@ -199,6 +203,14 @@
       }
     },
 
+    diffViewDisplayed() {
+      if (this._baselines.hasOwnProperty(TIMER.STARTUP_DIFF_VIEW_DISPLAYED)) {
+        this.timeEnd(TIMER.STARTUP_DIFF_VIEW_DISPLAYED);
+      } else {
+        this.timeEnd(TIMER.DIFF_VIEW_DISPLAYED);
+      }
+    },
+
     pluginsLoaded() {
       this.timeEnd(TIMER.PLUGINS_LOADED);
     },

polygerrit-ui/app/elements/core/gr-reporting/gr-reporting_test.html

@@ -84,6 +84,7 @@ limitations under the License.
       element.beforeLocationChanged();
       assert.isTrue(element.time.calledWithExactly('DashboardDisplayed'));
       assert.isTrue(element.time.calledWithExactly('ChangeDisplayed'));
+      assert.isTrue(element.time.calledWithExactly('DiffViewDisplayed'));
       assert.isFalse(element._baselines.hasOwnProperty('garbage'));
     });
 
@@ -98,6 +99,17 @@ limitations under the License.
       assert.isTrue(element.timeEnd.calledWithExactly('ChangeDisplayed'));
     });
 
+    test('diffViewDisplayed', () => {
+      sandbox.spy(element, 'timeEnd');
+      element.diffViewDisplayed();
+      assert.isFalse(
+          element.timeEnd.calledWithExactly('DiffViewDisplayed'));
+      assert.isTrue(
+          element.timeEnd.calledWithExactly('StartupDiffViewDisplayed'));
+      element.diffViewDisplayed();
+      assert.isTrue(element.timeEnd.calledWithExactly('DiffViewDisplayed'));
+    });
+
     test('dashboardDisplayed', () => {
       sandbox.spy(element, 'timeEnd');
       element.dashboardDisplayed();

polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html

@@ -23,6 +23,7 @@ limitations under the License.
 <link rel="import" href="../../../bower_components/iron-dropdown/iron-dropdown.html">
 <link rel="import" href="../../../styles/shared-styles.html">
 <link rel="import" href="../../core/gr-navigation/gr-navigation.html">
+<link rel="import" href="../../core/gr-reporting/gr-reporting.html">
 <link rel="import" href="../../shared/gr-button/gr-button.html">
 <link rel="import" href="../../shared/gr-count-string-formatter/gr-count-string-formatter.html">
 <link rel="import" href="../../shared/gr-dropdown-list/gr-dropdown-list.html">
@@ -346,6 +347,7 @@ limitations under the License.
     <gr-storage id="storage"></gr-storage>
     <gr-diff-cursor id="cursor"></gr-diff-cursor>
     <gr-comment-api id="commentAPI"></gr-comment-api>
+    <gr-reporting id="reporting"></gr-reporting>
   </template>
   <script src="gr-diff-view.js"></script>
 </dom-module>

polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.js

@@ -618,7 +618,7 @@
       promises.push(this._getChangeEdit(this._changeNum));
 
       this._loading = true;
-      Promise.all(promises).then(r => {
+      return Promise.all(promises).then(r => {
         const edit = r[4];
         if (edit) {
           this.set('_change.revisions.' + edit.commit.commit, {
@@ -629,7 +629,9 @@
         }
         this._loading = false;
         this.$.diff.comments = this._commentsForDiff;
-        this.$.diff.reload();
+        return this.$.diff.reload();
+      }).then(() => {
+        this.$.reporting.diffViewDisplayed();
       });
     },
 

polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view_test.html

@@ -71,6 +71,23 @@ limitations under the License.
       sandbox.restore();
     });
 
+    test('params change triggers diffViewDisplayed()', () => {
+      sandbox.stub(element.$.reporting, 'diffViewDisplayed');
+      sandbox.stub(element.$.diff, 'reload').returns(Promise.resolve());
+      sandbox.spy(element, '_paramsChanged');
+      element.params = {
+        view: Gerrit.Nav.View.DIFF,
+        changeNum: '42',
+        patchNum: '2',
+        basePatchNum: '1',
+        path: '/COMMIT_MSG',
+      };
+
+      return element._paramsChanged.returnValues[0].then(() => {
+        assert.isTrue(element.$.reporting.diffViewDisplayed.calledOnce);
+      });
+    });
+
     test('toggle left diff with a hotkey', () => {
       const toggleLeftDiffStub = sandbox.stub(element.$.diff, 'toggleLeftDiff');
       MockInteractions.pressAndReleaseKeyOn(element, 65, 'shift', 'a');