Fix anchor tag for settings page

Also add location-change listener to support polymer 2

Bug: Issue 10733
Change-Id: I70771b95da0b40913c827ef45929dab346fb298e

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

@@ -159,6 +159,9 @@
     ],
 
     attached() {
+      // Polymer 2: anchor tag won't work on shadow DOM
+      // we need to manually calling scrollIntoView when hash changed
+      this.listen(window, 'location-change', '_handleLocationChange');
       this.fire('title-change', {title: 'Settings'});
 
       this._isDark = !!window.localStorage.getItem('dark-theme');
@@ -215,9 +218,28 @@
 
       this._loadingPromise = Promise.all(promises).then(() => {
         this._loading = false;
+
+        // Handle anchor tag for initial load
+        this._handleLocationChange();
       });
     },
 
+    detach() {
+      this.unlisten(window, 'location-change', '_handleLocationChange');
+    },
+
+    _handleLocationChange() {
+      // Handle anchor tag after dom attached
+      const urlHash = window.location.hash;
+      if (urlHash) {
+        // Use shadowRoot for Polymer 2
+        const elem = (this.shadowRoot || document).querySelector(urlHash);
+        if (elem) {
+          elem.scrollIntoView();
+        }
+      }
+    },
+
     reloadAccountDetail() {
       Promise.all([
         this.$.accountInfo.loadData(),