Merge changes I32a66a3b,I8995a8b8 * changes: Replace created() by constructor() (Polymer Legacy) Remove usages of this.toggleClass() (Polymer Legacy)

diff --git a/polygerrit-ui/app/elements/admin/gr-access-section/gr-access-section.ts b/polygerrit-ui/app/elements/admin/gr-access-section/gr-access-section.ts
index 8c756cd..3e63444 100644
--- a/polygerrit-ui/app/elements/admin/gr-access-section/gr-access-section.ts
+++ b/polygerrit-ui/app/elements/admin/gr-access-section/gr-access-section.ts

@@ -108,9 +108,8 @@
   @property({type: Array})
   _permissions?: PermissionArray<EditablePermissionInfo>;
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('access-saved', () => this._handleAccessSaved());
   }
 

diff --git a/polygerrit-ui/app/elements/admin/gr-permission/gr-permission.ts b/polygerrit-ui/app/elements/admin/gr-permission/gr-permission.ts
index 6528d35..f9d7a6d 100644
--- a/polygerrit-ui/app/elements/admin/gr-permission/gr-permission.ts
+++ b/polygerrit-ui/app/elements/admin/gr-permission/gr-permission.ts

@@ -142,11 +142,6 @@
   constructor() {
     super();
     this._query = () => this._getGroupSuggestions();
-  }
-
-  /** @override */
-  created() {
-    super.created();
     this.addEventListener('access-saved', () => this._handleAccessSaved());
   }
 

diff --git a/polygerrit-ui/app/elements/admin/gr-repo-access/gr-repo-access.ts b/polygerrit-ui/app/elements/admin/gr-repo-access/gr-repo-access.ts
index 17a9ee6..5cc5d51 100644
--- a/polygerrit-ui/app/elements/admin/gr-repo-access/gr-repo-access.ts
+++ b/polygerrit-ui/app/elements/admin/gr-repo-access/gr-repo-access.ts

@@ -122,11 +122,6 @@
   constructor() {
     super();
     this._query = () => this._getInheritFromSuggestions();
-  }
-
-  /** @override */
-  created() {
-    super.created();
     this.addEventListener('access-modified', () =>
       this._handleAccessModified()
     );

diff --git a/polygerrit-ui/app/elements/admin/gr-rule-editor/gr-rule-editor.ts b/polygerrit-ui/app/elements/admin/gr-rule-editor/gr-rule-editor.ts
index f8c03d2..c6d2be8 100644
--- a/polygerrit-ui/app/elements/admin/gr-rule-editor/gr-rule-editor.ts
+++ b/polygerrit-ui/app/elements/admin/gr-rule-editor/gr-rule-editor.ts

@@ -137,9 +137,8 @@
   @property({type: Object})
   _originalRuleValues?: RuleValue;
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('access-saved', () => this._handleAccessSaved());
   }
 

diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.ts b/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.ts
index 34572c5..da84b45 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.ts
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.ts

@@ -110,9 +110,8 @@
 
   private readonly restApiService = appContext.restApiService;
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('next-page', () => this._handleNextPage());
     this.addEventListener('previous-page', () => this._handlePreviousPage());
   }

diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.ts b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.ts
index f12ed6f..fbcf7c1 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.ts
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.ts

@@ -162,11 +162,6 @@
   constructor() {
     super();
     this.cursor.scrollMode = ScrollMode.KEEP_VISIBLE;
-  }
-
-  /** @override */
-  created() {
-    super.created();
     this.addEventListener('keydown', e => this._scopedKeydownHandler(e));
   }
 

diff --git a/polygerrit-ui/app/elements/change/gr-change-actions/gr-change-actions.ts b/polygerrit-ui/app/elements/change/gr-change-actions/gr-change-actions.ts
index dcd1d93..2c87591 100644
--- a/polygerrit-ui/app/elements/change/gr-change-actions/gr-change-actions.ts
+++ b/polygerrit-ui/app/elements/change/gr-change-actions/gr-change-actions.ts

@@ -553,9 +553,8 @@
 
   private readonly restApiService = appContext.restApiService;
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('fullscreen-overlay-opened', () =>
       this._handleHideBackgroundContent()
     );

diff --git a/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.ts b/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.ts
index 84342cb..ebe61b7 100644
--- a/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.ts
+++ b/polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.ts

@@ -605,12 +605,9 @@
     );
   }
 
-  /** @override */
-  created() {
-    super.created();
-
+  constructor() {
+    super();
     this.addEventListener('topic-changed', () => this._handleTopicChanged());
-
     this.addEventListener(
       // When an overlay is opened in a mobile viewport, the overlay has a full
       // screen view. When it has a full screen view, we do not want the

diff --git a/polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.ts b/polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.ts
index 7c5d30f..56927e6 100644
--- a/polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.ts
+++ b/polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.ts

@@ -48,7 +48,7 @@
   ScrollMode,
   SpecialFilePath,
 } from '../../../constants/constants';
-import {descendedFromClass} from '../../../utils/dom-util';
+import {descendedFromClass, toggleClass} from '../../../utils/dom-util';
 import {
   addUnmodifiedFiles,
   computeDisplayPath,
@@ -357,11 +357,6 @@
     super();
     this.fileCursor.scrollMode = ScrollMode.KEEP_VISIBLE;
     this.fileCursor.cursorTargetClass = 'selected';
-  }
-
-  /** @override */
-  created() {
-    super.created();
     this.addEventListener('keydown', e => this._scopedKeydownHandler(e));
   }
 
@@ -921,7 +916,7 @@
     }
 
     e.preventDefault();
-    this.toggleClass('hideComments');
+    toggleClass(this, 'hideComments');
   }
 
   _handleCursorNext(e: CustomKeyboardEvent) {

diff --git a/polygerrit-ui/app/elements/change/gr-message/gr-message.ts b/polygerrit-ui/app/elements/change/gr-message/gr-message.ts
index 28ce47e..0811193 100644
--- a/polygerrit-ui/app/elements/change/gr-message/gr-message.ts
+++ b/polygerrit-ui/app/elements/change/gr-message/gr-message.ts

@@ -197,8 +197,8 @@
 
   private readonly restApiService = appContext.restApiService;
 
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('click', e => this._handleClick(e));
   }
 

diff --git a/polygerrit-ui/app/elements/diff/gr-comment-api/gr-comment-api.ts b/polygerrit-ui/app/elements/diff/gr-comment-api/gr-comment-api.ts
index 0ca6ea3..1d0a484 100644
--- a/polygerrit-ui/app/elements/diff/gr-comment-api/gr-comment-api.ts
+++ b/polygerrit-ui/app/elements/diff/gr-comment-api/gr-comment-api.ts

@@ -605,15 +605,6 @@
 
   private readonly restApiService = appContext.restApiService;
 
-  /** @override */
-  created() {
-    super.created();
-  }
-
-  constructor() {
-    super();
-  }
-
   /**
    * Load all comments (with drafts and robot comments) for the given change
    * number. The returned promise resolves when the comments have loaded, but

diff --git a/polygerrit-ui/app/elements/diff/gr-diff-cursor/gr-diff-cursor.ts b/polygerrit-ui/app/elements/diff/gr-diff-cursor/gr-diff-cursor.ts
index bd98764..eea0a67 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-cursor/gr-diff-cursor.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff-cursor/gr-diff-cursor.ts

@@ -38,6 +38,7 @@
 import {GrDiff} from '../gr-diff/gr-diff';
 import {fireAlert, fireEvent} from '../../../utils/event-util';
 import {Subscription} from 'rxjs';
+import {toggleClass} from '../../../utils/dom-util';
 
 type GrDiffRowType = GrDiffLineType | GrDiffGroupType;
 
@@ -502,8 +503,8 @@
     if (!this.diffRow) {
       return;
     }
-    this.toggleClass(LEFT_SIDE_CLASS, this.side === Side.LEFT, this.diffRow);
-    this.toggleClass(RIGHT_SIDE_CLASS, this.side === Side.RIGHT, this.diffRow);
+    toggleClass(this.diffRow, LEFT_SIDE_CLASS, this.side === Side.LEFT);
+    toggleClass(this.diffRow, RIGHT_SIDE_CLASS, this.side === Side.RIGHT);
   }
 
   _isActionType(type: GrDiffRowType) {

diff --git a/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight.ts b/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight.ts
index 5ccb3b3..96d6f11 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight.ts

@@ -74,9 +74,8 @@
 
   private selectionChangeTask?: DelayedTask;
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('comment-thread-mouseleave', e =>
       this._handleCommentThreadMouseleave(e)
     );

diff --git a/polygerrit-ui/app/elements/diff/gr-diff-host/gr-diff-host.ts b/polygerrit-ui/app/elements/diff/gr-diff-host/gr-diff-host.ts
index d40a8a6..4d6ef6e 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-host/gr-diff-host.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff-host/gr-diff-host.ts

@@ -269,9 +269,8 @@
 
   private readonly syntaxLayer = new GrSyntaxLayer();
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener(
       // These are named inconsistently for a reason:
       // The create-comment event is fired to indicate that we should

diff --git a/polygerrit-ui/app/elements/diff/gr-diff-selection/gr-diff-selection.ts b/polygerrit-ui/app/elements/diff/gr-diff-selection/gr-diff-selection.ts
index cee5ef6..2950885 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-selection/gr-diff-selection.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff-selection/gr-diff-selection.ts

@@ -66,9 +66,8 @@
   @property({type: Object})
   _linesCache: LinesCache = {left: null, right: null};
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('copy', e => this._handleCopy(e));
     addListener(this, 'down', e => this._handleDown(e));
   }

diff --git a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.ts b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.ts
index 27ebde2..d64ce3f 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.ts

@@ -99,6 +99,7 @@
 import {fireAlert, fireEvent, fireTitleChange} from '../../../utils/event-util';
 import {GerritView} from '../../../services/router/router-model';
 import {assertIsDefined} from '../../../utils/common-util';
+import {toggleClass} from '../../../utils/dom-util';
 const ERR_REVIEW_STATUS = 'Couldn’t change file review status.';
 const MSG_LOADING_BLAME = 'Loading blame...';
 const MSG_LOADED_BLAME = 'Blame loaded';
@@ -1624,7 +1625,7 @@
     if (this.shouldSuppressKeyboardShortcut(e)) return;
     if (this.modifierPressed(e)) return;
 
-    this.toggleClass('hideComments');
+    toggleClass(this, 'hideComments');
   }
 
   _handleOpenFileList(e: CustomKeyboardEvent) {

diff --git a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts
index 3ee87c0..5214c64 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts

@@ -73,7 +73,7 @@
   CreateCommentEventDetail as CreateCommentEventDetailApi,
   RenderPreferences,
 } from '../../../api/diff';
-import {isSafari} from '../../../utils/dom-util';
+import {isSafari, toggleClass} from '../../../utils/dom-util';
 import {assertIsDefined} from '../../../utils/common-util';
 import {debounce, DelayedTask} from '../../../utils/async-util';
 
@@ -284,9 +284,8 @@
 
   private renderDiffTableTask?: DelayedTask;
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this._setLoading(true);
     this.addEventListener('create-range-comment', (e: Event) =>
       this._handleCreateRangeComment(e as CustomEvent)
@@ -498,7 +497,7 @@
   }
 
   toggleLeftDiff() {
-    this.toggleClass('no-left');
+    toggleClass(this, 'no-left');
   }
 
   _blameChanged(newValue?: BlameInfo[] | null) {

diff --git a/polygerrit-ui/app/elements/diff/gr-selection-action-box/gr-selection-action-box.ts b/polygerrit-ui/app/elements/diff/gr-selection-action-box/gr-selection-action-box.ts
index 3e67c49..f5c568f 100644
--- a/polygerrit-ui/app/elements/diff/gr-selection-action-box/gr-selection-action-box.ts
+++ b/polygerrit-ui/app/elements/diff/gr-selection-action-box/gr-selection-action-box.ts

@@ -53,10 +53,8 @@
   @property({type: Boolean})
   positionBelow = false;
 
-  /** @override */
-  created() {
-    super.created();
-
+  constructor() {
+    super();
     // See https://crbug.com/gerrit/4767
     this.addEventListener('mousedown', e => this._handleMouseDown(e));
   }

diff --git a/polygerrit-ui/app/elements/edit/gr-editor-view/gr-editor-view.ts b/polygerrit-ui/app/elements/edit/gr-editor-view/gr-editor-view.ts
index 6b29e85..7e1bb00 100644
--- a/polygerrit-ui/app/elements/edit/gr-editor-view/gr-editor-view.ts
+++ b/polygerrit-ui/app/elements/edit/gr-editor-view/gr-editor-view.ts

@@ -132,9 +132,8 @@
     };
   }
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('content-change', e => {
       this._handleContentChange(e as CustomEvent<{value: string}>);
     });

diff --git a/polygerrit-ui/app/elements/gr-app-element.ts b/polygerrit-ui/app/elements/gr-app-element.ts
index bf7a2af..2e97e25 100644
--- a/polygerrit-ui/app/elements/gr-app-element.ts
+++ b/polygerrit-ui/app/elements/gr-app-element.ts

@@ -220,9 +220,8 @@
     };
   }
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this._bindKeyboardShortcuts();
     document.addEventListener(EventType.PAGE_ERROR, e => {
       this._handlePageError(e);

diff --git a/polygerrit-ui/app/elements/shared/gr-account-list/gr-account-list.ts b/polygerrit-ui/app/elements/shared/gr-account-list/gr-account-list.ts
index 3b15233..772e93d 100644
--- a/polygerrit-ui/app/elements/shared/gr-account-list/gr-account-list.ts
+++ b/polygerrit-ui/app/elements/shared/gr-account-list/gr-account-list.ts

@@ -189,11 +189,6 @@
     super();
     this.reporting = appContext.reportingService;
     this._querySuggestions = input => this._getSuggestions(input);
-  }
-
-  /** @override */
-  created() {
-    super.created();
     this.addEventListener('remove', e =>
       this._handleRemove(e as CustomEvent<{account: AccountInput}>)
     );

diff --git a/polygerrit-ui/app/elements/shared/gr-button/gr-button.ts b/polygerrit-ui/app/elements/shared/gr-button/gr-button.ts
index 72b2744..0419b14 100644
--- a/polygerrit-ui/app/elements/shared/gr-button/gr-button.ts
+++ b/polygerrit-ui/app/elements/shared/gr-button/gr-button.ts

@@ -82,9 +82,8 @@
 
   private readonly reporting: ReportingService = appContext.reportingService;
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this._initialTabindex = this.getAttribute('tabindex') || '0';
     // TODO(TS): try avoid using unknown
     this.addEventListener('click', e =>

diff --git a/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread.ts b/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread.ts
index 06144dc..ba6b6d8 100644
--- a/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread.ts
+++ b/polygerrit-ui/app/elements/shared/gr-comment-thread/gr-comment-thread.ts

@@ -221,9 +221,8 @@
 
   readonly restApiService = appContext.restApiService;
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('comment-update', e =>
       this._handleCommentUpdate(e as CustomEvent)
     );

diff --git a/polygerrit-ui/app/elements/shared/gr-overlay/gr-overlay.ts b/polygerrit-ui/app/elements/shared/gr-overlay/gr-overlay.ts
index a89e051..7edd217 100644
--- a/polygerrit-ui/app/elements/shared/gr-overlay/gr-overlay.ts
+++ b/polygerrit-ui/app/elements/shared/gr-overlay/gr-overlay.ts

@@ -82,9 +82,8 @@
     return (window.Polymer as any).IronFocusablesHelper.getTabbableNodes(this);
   }
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('iron-overlay-closed', () => this._overlayClosed());
     this.addEventListener('iron-overlay-cancelled', () =>
       this._overlayClosed()

diff --git a/polygerrit-ui/app/elements/shared/gr-select/gr-select.ts b/polygerrit-ui/app/elements/shared/gr-select/gr-select.ts
index 27f6cb1..bba9bda 100644
--- a/polygerrit-ui/app/elements/shared/gr-select/gr-select.ts
+++ b/polygerrit-ui/app/elements/shared/gr-select/gr-select.ts

@@ -70,9 +70,8 @@
     this.nativeSelect.focus();
   }
 
-  /** @override */
-  created() {
-    super.created();
+  constructor() {
+    super();
     this.addEventListener('change', () => this._valueChanged());
     this.addEventListener('dom-change', () => this._updateValue());
   }

diff --git a/polygerrit-ui/app/utils/dom-util.ts b/polygerrit-ui/app/utils/dom-util.ts
index 7f9ef72..3affef7 100644
--- a/polygerrit-ui/app/utils/dom-util.ts
+++ b/polygerrit-ui/app/utils/dom-util.ts

@@ -278,3 +278,17 @@
   );
   observer.observe(element);
 }
+
+/**
+ * Toggles a CSS class on or off for an element.
+ */
+export function toggleClass(el: Element, className: string, bool?: boolean) {
+  if (bool === undefined) {
+    bool = !el.classList.contains(className);
+  }
+  if (bool) {
+    el.classList.add(className);
+  } else {
+    el.classList.remove(className);
+  }
+}