diff --git a/polygerrit-ui/app/elements/core/gr-error-manager/gr-error-manager.ts b/polygerrit-ui/app/elements/core/gr-error-manager/gr-error-manager.ts
index 0c88426..11996c1 100644
--- a/polygerrit-ui/app/elements/core/gr-error-manager/gr-error-manager.ts
+++ b/polygerrit-ui/app/elements/core/gr-error-manager/gr-error-manager.ts
@@ -16,18 +16,28 @@
  */
 /* Import to get Gerrit interface */
 /* TODO(taoalpha): decouple gr-gerrit from gr-js-api-interface */
-import '../gr-error-dialog/gr-error-dialog.js';
-import '../../shared/gr-alert/gr-alert.js';
-import '../../shared/gr-overlay/gr-overlay.js';
-import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
-import '../../shared/gr-js-api-interface/gr-js-api-interface.js';
-import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
-import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
-import {PolymerElement} from '@polymer/polymer/polymer-element.js';
-import {htmlTemplate} from './gr-error-manager_html.js';
-import {getBaseUrl} from '../../../utils/url-util.js';
-import {appContext} from '../../../services/app-context.js';
-import {IronA11yAnnouncer} from '@polymer/iron-a11y-announcer/iron-a11y-announcer.js';
+import '../gr-error-dialog/gr-error-dialog';
+import '../../shared/gr-alert/gr-alert';
+import '../../shared/gr-overlay/gr-overlay';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface';
+import '../../shared/gr-js-api-interface/gr-js-api-interface';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin';
+import {PolymerElement} from '@polymer/polymer/polymer-element';
+import {htmlTemplate} from './gr-error-manager_html';
+import {getBaseUrl} from '../../../utils/url-util';
+import {appContext} from '../../../services/app-context';
+import {IronA11yAnnouncer} from '@polymer/iron-a11y-announcer/iron-a11y-announcer';
+import {customElement, property} from '@polymer/decorators';
+import {ReportingService} from '../../../services/gr-reporting/gr-reporting';
+import {AuthService} from '../../../services/gr-auth/gr-auth';
+import {EventEmitterService} from '../../../services/gr-event-interface/gr-event-interface';
+import {GrOverlay} from '../../shared/gr-overlay/gr-overlay';
+import {GrErrorDialog} from '../gr-error-dialog/gr-error-dialog';
+import {GrAlert} from '../../shared/gr-alert/gr-alert';
+import {RestApiService} from '../../../services/services/gr-rest-api/gr-rest-api';
+import {FetchRequest} from '../../shared/gr-rest-api-interface/gr-rest-apis/gr-rest-api-helper';
+import {ErrorType, FixIronA11yAnnouncer} from '../../../types/types';
 
 const HIDE_ALERT_TIMEOUT_MS = 5000;
 const CHECK_SIGN_IN_INTERVAL_MS = 60 * 1000;
@@ -37,12 +47,6 @@
 const TOO_MANY_FILES = 'too many files to find conflicts';
 const AUTHENTICATION_REQUIRED = 'Authentication required\n';
 
-const ErrorType = {
-  AUTH: 'AUTH',
-  NETWORK: 'NETWORK',
-  GENERIC: 'GENERIC',
-};
-
 // Bigger number has higher priority
 const ErrorTypePriority = {
   [ErrorType.AUTH]: 3,
@@ -50,59 +54,71 @@
   [ErrorType.GENERIC]: 1,
 };
 
+interface ErrorMsg {
+  errorText?: string;
+  status?: number;
+  statusText?: string;
+  url?: string;
+  trace?: string | null;
+  tip?: string;
+}
+
 export const __testOnly_ErrorType = ErrorType;
 
-/**
- * @extends PolymerElement
- */
-class GrErrorManager extends GestureEventListeners(
-    LegacyElementMixin(
-        PolymerElement)) {
-  static get template() { return htmlTemplate; }
-
-  static get is() { return 'gr-error-manager'; }
-
-  static get properties() {
-    return {
-    /**
-     * The ID of the account that was logged in when the app was launched. If
-     * not set, then there was no account at launch.
-     */
-      knownAccountId: Number,
-
-      /** @type {?Object} */
-      _alertElement: Object,
-      /** @type {?number} */
-      _hideAlertHandle: Number,
-      _refreshingCredentials: {
-        type: Boolean,
-        value: false,
-      },
-
-      /**
-       * The time (in milliseconds) since the most recent credential check.
-       */
-      _lastCredentialCheck: {
-        type: Number,
-        value() { return Date.now(); },
-      },
-
-      loginUrl: {
-        type: String,
-        value: '/login',
-      },
-    };
+export interface GrErrorManager {
+  $: {
+    noInteractionOverlay: GrOverlay;
+    errorDialog: GrErrorDialog;
+    errorOverlay: GrOverlay;
+    restAPI: RestApiService & Element;
+  };
+}
+@customElement('gr-error-manager')
+export class GrErrorManager extends GestureEventListeners(
+  LegacyElementMixin(PolymerElement)
+) {
+  static get template() {
+    return htmlTemplate;
   }
 
+  /**
+   * The ID of the account that was logged in when the app was launched. If
+   * not set, then there was no account at launch.
+   */
+  @property({type: Number})
+  knownAccountId?: number;
+
+  @property({type: Object})
+  _alertElement: GrAlert | null = null;
+
+  @property({type: Number})
+  _hideAlertHandle: number | null = null;
+
+  @property({type: Boolean})
+  _refreshingCredentials = false;
+
+  /**
+   * The time (in milliseconds) since the most recent credential check.
+   */
+  @property({type: Number})
+  _lastCredentialCheck: number = Date.now();
+
+  @property({type: String})
+  loginUrl = '/login';
+
+  reporting: ReportingService;
+
+  _authService: AuthService;
+
+  eventEmitter: EventEmitterService;
+
+  _authErrorHandlerDeregistrationHook?: Function;
+
   constructor() {
     super();
 
-    /** @type {!Auth} */
     this._authService = appContext.authService;
 
-    /** @type {?Function} */
-    this._authErrorHandlerDeregistrationHook;
-
     this.reporting = appContext.reportingService;
     this.eventEmitter = appContext.eventEmitter;
   }
@@ -118,13 +134,14 @@
     this.listen(document, 'visibilitychange', '_handleVisibilityChange');
     this.listen(document, 'show-auth-required', '_handleAuthRequired');
 
-    this._authErrorHandlerDeregistrationHook =
-      this.eventEmitter.on('auth-error',
-          event => {
-            this._handleAuthError(event.message, event.action);
-          });
+    this._authErrorHandlerDeregistrationHook = this.eventEmitter.on(
+      'auth-error',
+      event => {
+        this._handleAuthError(event.message, event.action);
+      }
+    );
 
-    IronA11yAnnouncer.requestAvailability();
+    ((IronA11yAnnouncer as unknown) as FixIronA11yAnnouncer).requestAvailability();
   }
 
   /** @override */
@@ -139,38 +156,48 @@
     this.unlisten(document, 'visibilitychange', '_handleVisibilityChange');
     this.unlisten(document, 'show-auth-required', '_handleAuthRequired');
 
-    this._authErrorHandlerDeregistrationHook();
+    if (this._authErrorHandlerDeregistrationHook) {
+      this._authErrorHandlerDeregistrationHook();
+    }
   }
 
-  _shouldSuppressError(msg) {
+  _shouldSuppressError(msg: string) {
     return msg.includes(TOO_MANY_FILES);
   }
 
   _handleAuthRequired() {
     this._showAuthErrorAlert(
-        'Log in is required to perform that action.', 'Log in.');
+      'Log in is required to perform that action.',
+      'Log in.'
+    );
   }
 
-  _handleAuthError(msg, action) {
+  _handleAuthError(msg: string, action: string) {
     this.$.noInteractionOverlay.open().then(() => {
       this._showAuthErrorAlert(msg, action);
     });
   }
 
-  _handleServerError(e) {
+  _handleServerError(
+    e: CustomEvent<{response: Response; request: FetchRequest}>
+  ) {
     const {request, response} = e.detail;
     response.text().then(errorText => {
       const url = request && (request.anonymizedUrl || request.url);
       const {status, statusText} = response;
-      if (response.status === 403
-              && !this._authService.isAuthed
-              && errorText === AUTHENTICATION_REQUIRED) {
+      if (
+        response.status === 403 &&
+        !this._authService.isAuthed &&
+        errorText === AUTHENTICATION_REQUIRED
+      ) {
         // if not authed previously, this is trying to access auth required APIs
         // show auth required alert
         this._handleAuthRequired();
-      } else if (response.status === 403
-              && this._authService.isAuthed
-              && errorText === AUTHENTICATION_REQUIRED) {
+      } else if (
+        response.status === 403 &&
+        this._authService.isAuthed &&
+        errorText === AUTHENTICATION_REQUIRED
+      ) {
         // The app was logged at one point and is now getting auth errors.
         // This indicates the auth token may no longer valid.
         // Re-check on auth
@@ -178,7 +205,7 @@
         this.$.restAPI.getLoggedIn();
       } else if (!this._shouldSuppressError(errorText)) {
         const trace =
-            response.headers && response.headers.get('X-Gerrit-Trace');
+          response.headers && response.headers.get('X-Gerrit-Trace');
         if (response.status === 404) {
           this._showNotFoundMessageWithTip({
             status,
@@ -188,57 +215,89 @@
             trace,
           });
         } else {
-          this._showErrorDialog(this._constructServerErrorMsg({
-            status,
-            statusText,
-            errorText,
-            url,
-            trace,
-          }));
+          this._showErrorDialog(
+            this._constructServerErrorMsg({
+              status,
+              statusText,
+              errorText,
+              url,
+              trace,
+            })
+          );
         }
       }
       console.info(`server error: ${errorText}`);
     });
   }
 
-  _showNotFoundMessageWithTip({status, statusText, errorText, url, trace}) {
+  _showNotFoundMessageWithTip({
+    status,
+    statusText,
+    errorText,
+    url,
+    trace,
+  }: ErrorMsg) {
     this.$.restAPI.getLoggedIn().then(isLoggedIn => {
-      const tip = isLoggedIn ?
-        'You might have not enough privileges.' :
-        'You might have not enough privileges. Sign in and try again.';
-      this._showErrorDialog(this._constructServerErrorMsg({
-        status,
-        statusText,
-        errorText,
-        url,
-        trace,
-        tip,
-      }), {
-        showSignInButton: !isLoggedIn,
-      });
+      const tip = isLoggedIn
+        ? 'You might have not enough privileges.'
+        : 'You might have not enough privileges. Sign in and try again.';
+      this._showErrorDialog(
+        this._constructServerErrorMsg({
+          status,
+          statusText,
+          errorText,
+          url,
+          trace,
+          tip,
+        }),
+        {
+          showSignInButton: !isLoggedIn,
+        }
+      );
     });
   }
 
-  _constructServerErrorMsg({errorText, status, statusText, url, trace, tip}) {
+  _constructServerErrorMsg({
+    errorText,
+    status,
+    statusText,
+    url,
+    trace,
+    tip,
+  }: ErrorMsg) {
     let err = '';
     if (tip) {
       err += `${tip}\n\n`;
     }
     err += `Error ${status}`;
-    if (statusText) { err += ` (${statusText})`; }
-    if (errorText || url) { err += ': '; }
-    if (errorText) { err += errorText; }
-    if (url) { err += `\nEndpoint: ${url}`; }
-    if (trace) { err += `\nTrace Id: ${trace}`; }
+    if (statusText) {
+      err += ` (${statusText})`;
+    }
+    if (errorText || url) {
+      err += ': ';
+    }
+    if (errorText) {
+      err += errorText;
+    }
+    if (url) {
+      err += `\nEndpoint: ${url}`;
+    }
+    if (trace) {
+      err += `\nTrace Id: ${trace}`;
+    }
     return err;
   }
 
-  _handleShowAlert(e) {
-    this._showAlert(e.detail.message, e.detail.action, e.detail.callback,
-        e.detail.dismissOnNavigation);
+  _handleShowAlert(e: CustomEvent) {
+    this._showAlert(
+      e.detail.message,
+      e.detail.action,
+      e.detail.callback,
+      e.detail.dismissOnNavigation
+    );
   }
 
-  _handleNetworkError(e) {
+  _handleNetworkError(e: CustomEvent) {
     this._showAlert('Server unavailable');
     console.error(e.detail.error.message);
   }
@@ -249,37 +308,39 @@
     return ErrorTypePriority[incoming] >= ErrorTypePriority[existing];
   }
 
-  /**
-   * @param {string} text
-   * @param {?string=} opt_actionText
-   * @param {?Function=} opt_actionCallback
-   * @param {?boolean=} opt_dismissOnNavigation
-   * @param {?string=} opt_type
-   */
-  _showAlert(text, opt_actionText, opt_actionCallback,
-      opt_dismissOnNavigation, opt_type) {
+  _showAlert(
+    text: string,
+    actionText?: string,
+    actionCallback?: () => void,
+    dismissOnNavigation?: boolean,
+    type?: ErrorType
+  ) {
     if (this._alertElement) {
       // check priority before hiding
-      if (!this._canOverride(opt_type, this._alertElement.type)) return;
+      if (!this._canOverride(type, this._alertElement.type)) return;
       this._hideAlert();
     }
 
     this._clearHideAlertHandle();
-    if (opt_dismissOnNavigation) {
+    if (dismissOnNavigation) {
       // Persist alert until navigation.
       this.listen(document, 'location-change', '_hideAlert');
     } else {
-      this._hideAlertHandle =
-        this.async(this._hideAlert, HIDE_ALERT_TIMEOUT_MS);
+      this._hideAlertHandle = this.async(
+        this._hideAlert,
+        HIDE_ALERT_TIMEOUT_MS
+      );
     }
     const el = this._createToastAlert();
-    el.show(text, opt_actionText, opt_actionCallback);
+    el.show(text, actionText, actionCallback);
     this._alertElement = el;
-    this.fire('iron-announce', {text}, {bubbles: true} );
+    this.fire('iron-announce', {text}, {bubbles: true});
   }
 
   _hideAlert() {
-    if (!this._alertElement) { return; }
+    if (!this._alertElement) {
+      return;
+    }
 
     this._alertElement.hide();
     this._alertElement = null;
@@ -289,13 +350,13 @@
   }
 
   _clearHideAlertHandle() {
-    if (this._hideAlertHandle != null) {
+    if (this._hideAlertHandle !== null) {
       this.cancelAsync(this._hideAlertHandle);
       this._hideAlertHandle = null;
     }
   }
 
-  _showAuthErrorAlert(errorText, actionText) {
+  _showAuthErrorAlert(errorText: string, actionText?: string) {
     // hide any existing alert like `reload`
     // as auth error should have the highest priority
     if (this._alertElement) {
@@ -304,9 +365,12 @@
 
     this._alertElement = this._createToastAlert();
     this._alertElement.type = ErrorType.AUTH;
-    this._alertElement.show(errorText, actionText,
-        this._createLoginPopup.bind(this));
-    this.fire('iron-announce', {text: errorText}, {bubbles: true} );
+    this._alertElement.show(
+      errorText,
+      actionText,
+      this._createLoginPopup.bind(this)
+    );
+    this.fire('iron-announce', {text: errorText}, {bubbles: true});
     this._refreshingCredentials = true;
     this._requestCheckLoggedIn();
     if (!document.hidden) {
@@ -323,15 +387,19 @@
   _handleVisibilityChange() {
     // Ignore when the page is transitioning to hidden (or hidden is
     // undefined).
-    if (document.hidden !== false) { return; }
+    if (document.hidden !== false) {
+      return;
+    }
 
     // If not currently refreshing credentials and the credentials are old,
     // request them to confirm their validity or (display an auth toast if it
     // fails).
     const timeSinceLastCheck = Date.now() - this._lastCredentialCheck;
-    if (!this._refreshingCredentials &&
-        this.knownAccountId !== undefined &&
-        timeSinceLastCheck > STALE_CREDENTIAL_THRESHOLD_MS) {
+    if (
+      !this._refreshingCredentials &&
+      this.knownAccountId !== undefined &&
+      timeSinceLastCheck > STALE_CREDENTIAL_THRESHOLD_MS
+    ) {
       this._lastCredentialCheck = Date.now();
 
       // check auth status in case:
@@ -343,7 +411,10 @@
 
   _requestCheckLoggedIn() {
     this.debounce(
-        'checkLoggedIn', this._checkSignedIn, CHECK_SIGN_IN_INTERVAL_MS);
+      'checkLoggedIn',
+      this._checkSignedIn,
+      CHECK_SIGN_IN_INTERVAL_MS
+    );
   }
 
   _checkSignedIn() {
@@ -369,7 +440,7 @@
           if (this._refreshingCredentials) {
             // If the credentials were refreshed but the account is different
             // then reload the page completely.
-            if (account._account_id !== this.knownAccountId) {
+            if (account?._account_id !== this.knownAccountId) {
               this._reloadPage();
               return;
             }
@@ -386,18 +457,19 @@
   }
 
   _createLoginPopup() {
-    const left = window.screenLeft +
-        (window.outerWidth - SIGN_IN_WIDTH_PX) / 2;
-    const top = window.screenTop +
-        (window.outerHeight - SIGN_IN_HEIGHT_PX) / 2;
+    const left = window.screenLeft + (window.outerWidth - SIGN_IN_WIDTH_PX) / 2;
+    const top = window.screenTop + (window.outerHeight - SIGN_IN_HEIGHT_PX) / 2;
     const options = [
-      'width=' + SIGN_IN_WIDTH_PX,
-      'height=' + SIGN_IN_HEIGHT_PX,
-      'left=' + left,
-      'top=' + top,
+      `width=${SIGN_IN_WIDTH_PX}`,
+      `height=${SIGN_IN_HEIGHT_PX}`,
+      `left=${left}`,
+      `top=${top}`,
     ];
-    window.open(getBaseUrl() +
-        '/login/%3FcloseAfterLogin', '_blank', options.join(','));
+    window.open(
+      getBaseUrl() + '/login/%3FcloseAfterLogin',
+      '_blank',
+      options.join(',')
+    );
     this.listen(window, 'focus', '_handleWindowFocus');
   }
 
@@ -416,7 +488,7 @@
     this.flushDebouncer('checkLoggedIn');
   }
 
-  _handleShowErrorDialog(e) {
+  _handleShowErrorDialog(e: CustomEvent) {
     this._showErrorDialog(e.detail.message);
   }
 
@@ -424,13 +496,17 @@
     this.$.errorOverlay.close();
   }
 
-  _showErrorDialog(message, opt_options) {
+  _showErrorDialog(message: string, options?: {showSignInButton?: boolean}) {
     this.reporting.reportErrorDialog(message);
     this.$.errorDialog.text = message;
     this.$.errorDialog.showSignInButton =
-        opt_options && opt_options.showSignInButton;
+      !!options && !!options.showSignInButton;
     this.$.errorOverlay.open();
   }
 }
 
-customElements.define(GrErrorManager.is, GrErrorManager);
+declare global {
+  interface HTMLElementTagNameMap {
+    'gr-error-manager': GrErrorManager;
+  }
+}
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts b/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts
index bec07f0..e0333cc 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts
@@ -27,6 +27,7 @@
 import {htmlTemplate} from './gr-diff-mode-selector_html';
 import {customElement, property} from '@polymer/decorators';
 import {IronA11yAnnouncer} from '@polymer/iron-a11y-announcer/iron-a11y-announcer';
+import {FixIronA11yAnnouncer} from '../../../types/types';
 
 export interface GrDiffModeSelector {
   $: {
@@ -34,10 +35,6 @@
   };
 }
 
-interface FixIronA11yAnnouncer extends IronA11yAnnouncer {
-  requestAvailability(): void;
-}
-
 @customElement('gr-diff-mode-selector')
 export class GrDiffModeSelector extends GestureEventListeners(
   LegacyElementMixin(PolymerElement)
diff --git a/polygerrit-ui/app/elements/shared/gr-alert/gr-alert.ts b/polygerrit-ui/app/elements/shared/gr-alert/gr-alert.ts
index 3a20b5e..046218b 100644
--- a/polygerrit-ui/app/elements/shared/gr-alert/gr-alert.ts
+++ b/polygerrit-ui/app/elements/shared/gr-alert/gr-alert.ts
@@ -22,6 +22,7 @@
 import {htmlTemplate} from './gr-alert_html';
 import {getRootElement} from '../../../scripts/rootElement';
 import {customElement, property} from '@polymer/decorators';
+import {ErrorType} from '../../../types/types';
 
 declare global {
   interface HTMLElementTagNameMap {
@@ -30,7 +31,7 @@
 }
 
 @customElement('gr-alert')
-class GrAlert extends GestureEventListeners(
+export class GrAlert extends GestureEventListeners(
   LegacyElementMixin(PolymerElement)
 ) {
   static get template() {
@@ -50,7 +51,7 @@
   actionText?: string;
 
   @property({type: String})
-  type?: string;
+  type?: ErrorType;
 
   @property({type: Boolean, reflectToAttribute: true})
   shown = true;
@@ -88,11 +89,11 @@
     }
   }
 
-  show(text: string, opt_actionText: string, opt_actionCallback?: () => void) {
+  show(text: string, actionText?: string, actionCallback?: () => void) {
     this.text = text;
-    this.actionText = opt_actionText;
-    this._hideActionButton = !opt_actionText;
-    this._actionCallback = opt_actionCallback;
+    this.actionText = actionText;
+    this._hideActionButton = !actionText;
+    this._actionCallback = actionCallback;
     getRootElement().appendChild(this);
     this.shown = true;
   }
diff --git a/polygerrit-ui/app/types/types.ts b/polygerrit-ui/app/types/types.ts
index ece3d3a..6ed4c48 100644
--- a/polygerrit-ui/app/types/types.ts
+++ b/polygerrit-ui/app/types/types.ts
@@ -15,11 +15,16 @@
  * limitations under the License.
  */
 import {Side} from '../constants/constants';
+import {IronA11yAnnouncer} from '@polymer/iron-a11y-announcer';
 
 export function notUndefined<T>(x: T | undefined): x is T {
   return x !== undefined;
 }
 
+export interface FixIronA11yAnnouncer extends IronA11yAnnouncer {
+  requestAvailability(): void;
+}
+
 export interface CoverageRange {
   type: CoverageType;
   side: Side;
@@ -46,6 +51,12 @@
   NOT_INSTRUMENTED = 'NOT_INSTRUMENTED',
 }
 
+export enum ErrorType {
+  AUTH = 'AUTH',
+  NETWORK = 'NETWORK',
+  GENERIC = 'GENERIC',
+}
+
 /**
  * If Polymer would have exported DomApiNative from its dom.js utility, then we
  * would probably not need this type. We just use it for casting the return