Navi: Pre-select first email provider to have a default.

Bug: 901210, 900377
Change-Id: I928f6cdb1a8251131afbe2e95afe1cbca39703ea
Reviewed-on: https://chromium-review.googlesource.com/c/1332696
Commit-Queue: Hector Carmona <hcarmona@chromium.org>
Reviewed-by: Scott Chen <scottchen@chromium.org>
Cr-Commit-Position: refs/heads/master@{#607853}

chrome/browser/resources/welcome/onboarding_welcome/email/email_chooser.js

@@ -65,6 +65,9 @@ Polymer({
 
     this.emailProxy_.getEmailList().then(list => {
       this.emailList_ = list;
+
+      // Pre-select fist email provider.
+      this.selectedEmailProvider_ = this.emailList_[0];
     });
 
     window.addEventListener('beforeunload', () => {
@@ -152,6 +155,9 @@ Polymer({
     if (emailProvider.bookmarkId)
       return;
 
+    // Indicates that the emailProvider is being added as a bookmark.
+    emailProvider.bookmarkId = 'pending';
+
     this.emailProxy_.cacheBookmarkIcon(emailProvider.id);
     this.bookmarkProxy_.toggleBookmarkBar(true);
     this.bookmarkProxy_.addBookmark(

chrome/browser/resources/welcome/onboarding_welcome/email/nux_email_proxy.js

@@ -154,9 +154,12 @@ cr.define('nux', function() {
     recordFinalize() {
       let finalValue = this.firstPart + this.lastPart;
 
-      chrome.metricsPrivate.recordEnumerationValue(
-          INTERACTION_METRIC_NAME, NuxEmailProvidersInteractions[finalValue],
-          INTERACTION_METRIC_COUNT);
+      // TODO(hcarmona): revisit this metric.
+      let metric = NuxEmailProvidersInteractions[finalValue];
+      if (metric) {
+        chrome.metricsPrivate.recordEnumerationValue(
+            INTERACTION_METRIC_NAME, metric, INTERACTION_METRIC_COUNT);
+      }
     }
   }
 

chrome/test/data/webui/welcome/email_chooser_test.js

@@ -50,42 +50,34 @@ cr.define('onboarding_welcome_email_chooser', function() {
     });
 
     test('test email chooser options', function() {
-      var options = testElement.shadowRoot.querySelectorAll('.option');
+      let options = testElement.shadowRoot.querySelectorAll('.option');
       assertEquals(2, options.length);
 
-      assertFalse(!!testElement.$$('.option[active]'));
-      assertTrue(testElement.$$('.action-button').disabled);
+      // First option is default selected and action button should be enabled.
+      assertEquals(testElement.$$('.option[active]'), options[0]);
+      assertFalse(testElement.$$('.action-button').disabled);
 
-      // Click first option, it should be selected and action button should be
-      // enabled.
       options[0].click();
       return Promise
           .all([
-            testBookmarkBrowserProxy.whenCalled('addBookmark'),
+            testBookmarkBrowserProxy.whenCalled('removeBookmark'),
             testEmailBrowserProxy.whenCalled('recordClickedOption'),
           ])
           .then(responses => {
-            let response = responses[0];
-            assertEquals(response.title, emails[0].name);
-            assertEquals(response.url, emails[0].url);
-            assertEquals(response.parentId, '1');
-            assertEquals(testElement.$$('.option[active]'), options[0]);
-            assertFalse(testElement.$$('.action-button').disabled);
+            let removedId = responses[0];
+            assertEquals(removedId, 1);
+            assertFalse(!!testElement.$$('.option[active]'));
+            assertTrue(testElement.$$('.action-button').disabled);
 
-            // Click second option, it should be selected and first option
-            // should not be selected anymore.
+            // Click second option, it should be selected.
             testBookmarkBrowserProxy.reset();
             options[1].click();
             return Promise.all([
               testBookmarkBrowserProxy.whenCalled('addBookmark'),
-              testBookmarkBrowserProxy.whenCalled('removeBookmark'),
             ]);
           })
           .then(responses => {
             let addResponse = responses[0];
-            let removedId = responses[1];
-
-            assertEquals(removedId, 1);
 
             assertEquals(addResponse.title, emails[1].name);
             assertEquals(addResponse.url, emails[1].url);
@@ -108,21 +100,17 @@ cr.define('onboarding_welcome_email_chooser', function() {
     });
 
     test('test email chooser skip button', function() {
-      var options = testElement.shadowRoot.querySelectorAll('.option');
+      let options = testElement.shadowRoot.querySelectorAll('.option');
       testElement.bookmarkBarWasShown_ = true;
 
-      // Click first option, it should be selected and action button should be
-      // enabled.
-      options[0].click();
-      return testBookmarkBrowserProxy.whenCalled('addBookmark')
-          .then(response => {
-            testElement.$.noThanksButton.click();
-            return Promise.all([
-              testBookmarkBrowserProxy.whenCalled('removeBookmark'),
-              testBookmarkBrowserProxy.whenCalled('toggleBookmarkBar'),
-              testEmailBrowserProxy.whenCalled('recordNoThanks'),
-            ]);
-          })
+      // First option should be selected and action button should be enabled.
+      testElement.$.noThanksButton.click();
+      return Promise
+          .all([
+            testBookmarkBrowserProxy.whenCalled('removeBookmark'),
+            testBookmarkBrowserProxy.whenCalled('toggleBookmarkBar'),
+            testEmailBrowserProxy.whenCalled('recordNoThanks'),
+          ])
           .then(responses => {
             let removeBookmarkResponse = responses[0];
             let toggleBookmarkBarResponse = responses[1];
@@ -133,20 +121,16 @@ cr.define('onboarding_welcome_email_chooser', function() {
     });
 
     test('test email chooser next button', function() {
-      var options = testElement.shadowRoot.querySelectorAll('.option');
+      let options = testElement.shadowRoot.querySelectorAll('.option');
       testElement.bookmarkBarWasShown_ = true;
 
-      // Click first option, it should be selected and action button should be
-      // enabled.
-      options[0].click();
-      return testBookmarkBrowserProxy.whenCalled('addBookmark')
-          .then(response => {
-            testElement.$$('.action-button').click();
-            return Promise.all([
-              testEmailBrowserProxy.whenCalled('recordProviderSelected'),
-              testEmailBrowserProxy.whenCalled('recordGetStarted'),
-            ]);
-          })
+      // First option should be selected and action button should be enabled.
+      testElement.$$('.action-button').click();
+      return Promise
+          .all([
+            testEmailBrowserProxy.whenCalled('recordProviderSelected'),
+            testEmailBrowserProxy.whenCalled('recordGetStarted'),
+          ])
           .then(responses => {
             let recordProviderSelectedResponse = responses[0];