Settings: Ignore bubbling iron-select events in settings-animated-pages.

iron-animated-pages was consuming bubbling "iron-select" events
erroneously. This caused a bug where the "back" button was unexpectedly
focused when switching between tabs in the certificate-manager UI.

Fixed: 1097684
Change-Id: I53774148334b2ffa2ec57d89b05d67a8e13c92df
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2259014
Commit-Queue: dpapad <dpapad@chromium.org>
Reviewed-by: John Lee <johntlee@chromium.org>
Cr-Commit-Position: refs/heads/master@{#781578}

chrome/browser/resources/settings/settings_page/settings_animated_pages.js

@@ -57,6 +57,12 @@ Polymer({
    * @private
    */
   onIronSelect_(e) {
+    // Ignore bubbling 'iron-select' events not originating from
+    // |animatedPages| itself.
+    if (e.target !== this.$.animatedPages) {
+      return;
+    }
+
     // Call focusBackButton() on the selected subpage, only if:
     //  1) Not a direct navigation (such that the search box stays focused), and
     //  2) Not a "back" navigation, in which case the anchor element should be

chrome/test/data/webui/settings/settings_animated_pages_test.js

@@ -105,4 +105,39 @@ suite('settings-animated-pages', function() {
     Router.getInstance().navigateToPreviousRoute();
     await whenDone;
   });
+
+  test('IgnoresBubblingIronSelect', async function() {
+    document.body.innerHTML = `
+      <settings-animated-pages section="${testRoutes.PRIVACY.section}">
+        <div route-path="default"></div>
+        <settings-subpage route-path="${testRoutes.SITE_SETTINGS.path}">
+          <div></div>
+        </settings-subpage>
+      </settings-animated-pages>`;
+
+    const subpage = document.body.querySelector('settings-subpage');
+    let counter = 0;
+
+    const whenFired = new Promise(resolve => {
+      // Override |focusBackButton| to check how many times it is called.
+      subpage.focusBackButton = () => {
+        counter++;
+
+        if (counter === 1) {
+          const other = document.body.querySelector('div');
+          other.dispatchEvent(new CustomEvent('iron-select', {bubbles: true}));
+          resolve();
+        }
+      };
+    });
+
+    Router.getInstance().navigateTo(testRoutes.PRIVACY);
+    Router.getInstance().navigateTo(testRoutes.SITE_SETTINGS);
+
+    await whenFired;
+
+    // Ensure that |focusBackButton| was only called once, ignoring the
+    // any unrelated 'iron-select' events.
+    assertEquals(1, counter);
+  });
 });