refactor: make all event emitters readonly

Author: rafaelss95

guides/bidirectionality.md

@@ -28,7 +28,7 @@ export class MyCustomComponent {
     this.dir = directionality.value;
 
     directionality.change.subscribe(() => {
-       this.dir = directionality.value;
+      this.dir = directionality.value;
     });
   }
 }

src/cdk-experimental/dialog/dialog-container.ts

@@ -104,19 +104,19 @@ export class CdkDialogContainer extends BasePortalOutlet implements OnDestroy {
   @ViewChild(CdkPortalOutlet, {static: true}) _portalHost: CdkPortalOutlet;
 
   /** A subject emitting before the dialog enters the view. */
-  _beforeEnter: Subject<void> = new Subject();
+  readonly _beforeEnter = new Subject<void>();
 
   /** A subject emitting after the dialog enters the view. */
-  _afterEnter: Subject<void> = new Subject();
+  readonly _afterEnter = new Subject<void>();
 
   /** A subject emitting before the dialog exits the view. */
-  _beforeExit: Subject<void> = new Subject();
+  readonly _beforeExit = new Subject<void>();
 
   /** A subject emitting after the dialog exits the view. */
-  _afterExit: Subject<void> = new Subject();
+  readonly _afterExit = new Subject<void>();
 
   /** Stream of animation `done` events. */
-  _animationDone = new Subject<AnimationEvent>();
+  readonly _animationDone = new Subject<AnimationEvent>();
 
   constructor(
     private _elementRef: ElementRef<HTMLElement>,

src/cdk-experimental/dialog/dialog.ts

@@ -54,7 +54,7 @@ export class Dialog implements OnDestroy {
   _getAfterAllClosed(): Observable<void> {
     return this._parentDialog ? this._parentDialog.afterAllClosed : this._afterAllClosedBase;
   }
-  _afterAllClosedBase = new Subject<void>();
+  readonly _afterAllClosedBase = new Subject<void>();
 
   // TODO(jelbourn): tighten the type on the right-hand side of this expression.
   afterAllClosed: Observable<void> = defer(() => this.openDialogs.length ?
@@ -64,7 +64,7 @@ export class Dialog implements OnDestroy {
   get afterOpened(): Subject<DialogRef<any>> {
     return this._parentDialog ? this._parentDialog.afterOpened : this._afterOpened;
   }
-  _afterOpened: Subject<DialogRef<any>> = new Subject();
+  readonly _afterOpened = new Subject<DialogRef<any>>();
 
   /** Stream that emits when a dialog is opened. */
   get openDialogs(): DialogRef<any>[] {

src/cdk-experimental/listbox/listbox.ts

@@ -87,7 +87,7 @@ export class CdkOption<T = unknown> implements ListKeyManagerOption, Highlightab
     this._value = value;
   }
 
-  @Output() readonly selectionChange: EventEmitter<OptionSelectionChangeEvent<T>> =
+  @Output() readonly selectionChange =
       new EventEmitter<OptionSelectionChangeEvent<T>>();
 
   constructor(private readonly _elementRef: ElementRef,
@@ -228,7 +228,7 @@ export class CdkListbox<T> implements AfterContentInit, OnDestroy, OnInit, Contr
 
   @ContentChildren(CdkOption, {descendants: true}) _options: QueryList<CdkOption<T>>;
 
-  @Output() readonly selectionChange: EventEmitter<ListboxSelectionChangeEvent<T>> =
+  @Output() readonly selectionChange =
       new EventEmitter<ListboxSelectionChangeEvent<T>>();
 
   /**

src/cdk-experimental/menu/context-menu.ts

@@ -118,10 +118,10 @@ export class CdkContextMenuTrigger implements OnDestroy {
   private _menuPanel: CdkMenuPanel;
 
   /** Emits when the attached menu is requested to open. */
-  @Output('cdkContextMenuOpened') readonly opened: EventEmitter<void> = new EventEmitter();
+  @Output('cdkContextMenuOpened') readonly opened = new EventEmitter<void>();
 
   /** Emits when the attached menu is requested to close. */
-  @Output('cdkContextMenuClosed') readonly closed: EventEmitter<void> = new EventEmitter();
+  @Output('cdkContextMenuClosed') readonly closed = new EventEmitter<void>();
 
   /** Whether the context menu should be disabled. */
   @Input('cdkContextMenuDisabled')
@@ -140,7 +140,7 @@ export class CdkContextMenuTrigger implements OnDestroy {
   private _panelContent: TemplatePortal;
 
   /** Emits when the element is destroyed. */
-  private readonly _destroyed: Subject<void> = new Subject();
+  private readonly _destroyed = new Subject<void>();
 
   /** Reference to the document. */
   private readonly _document: Document;

src/cdk-experimental/menu/menu-bar.ts

@@ -72,7 +72,7 @@ export class CdkMenuBar extends CdkMenuGroup implements Menu, AfterContentInit,
   private _mouseFocusChanged: Observable<CdkMenuItem>;
 
   /** Emits when the MenuBar is destroyed. */
-  private readonly _destroyed: Subject<void> = new Subject();
+  private readonly _destroyed = new Subject<void>();
 
   /** All child MenuItem elements nested in this MenuBar. */
   @ContentChildren(CdkMenuItem, {descendants: true})

src/cdk-experimental/menu/menu-group.ts

@@ -35,14 +35,14 @@ import {CdkMenuItem} from './menu-item';
 })
 export class CdkMenuGroup implements AfterContentInit, OnDestroy {
   /** Emits the element when checkbox or radiobutton state changed  */
-  @Output() readonly change: EventEmitter<CdkMenuItem> = new EventEmitter();
+  @Output() readonly change = new EventEmitter<CdkMenuItem>();
 
   /** List of menuitemcheckbox or menuitemradio elements which reside in this group */
   @ContentChildren(CdkMenuItemSelectable, {descendants: true})
   private readonly _selectableItems: QueryList<CdkMenuItemSelectable>;
 
   /** Emits when the _selectableItems QueryList triggers a change */
-  private readonly _selectableChanges: EventEmitter<void> = new EventEmitter();
+  private readonly _selectableChanges = new EventEmitter<void>();
 
   ngAfterContentInit() {
     this._registerMenuSelectionListeners();

src/cdk-experimental/menu/menu-item-selectable.ts

@@ -20,7 +20,7 @@ let nextId = 0;
 @Directive()
 export abstract class CdkMenuItemSelectable extends CdkMenuItem {
   /** Event emitted when the selectable item is clicked */
-  @Output() clicked: EventEmitter<CdkMenuItemSelectable> = new EventEmitter();
+  @Output() readonly clicked = new EventEmitter<CdkMenuItemSelectable>();
 
   /** Whether the element is checked */
   @Input()

src/cdk-experimental/menu/menu-item-trigger.ts

@@ -70,10 +70,10 @@ export class CdkMenuItemTrigger implements OnDestroy {
   private _menuPanel?: CdkMenuPanel;
 
   /** Emits when the attached menu is requested to open */
-  @Output('cdkMenuOpened') readonly opened: EventEmitter<void> = new EventEmitter();
+  @Output('cdkMenuOpened') readonly opened = new EventEmitter<void>();
 
   /** Emits when the attached menu is requested to close */
-  @Output('cdkMenuClosed') readonly closed: EventEmitter<void> = new EventEmitter();
+  @Output('cdkMenuClosed') readonly closed = new EventEmitter<void>();
 
   /** A reference to the overlay which manages the triggered menu */
   private _overlayRef: OverlayRef | null = null;

src/cdk-experimental/menu/menu-item.ts

@@ -69,10 +69,10 @@ export class CdkMenuItem implements FocusableOption, FocusableElement, OnDestroy
    * If this MenuItem is a regular MenuItem, outputs when it is triggered by a keyboard or mouse
    * event.
    */
-  @Output('cdkMenuItemTriggered') triggered: EventEmitter<void> = new EventEmitter();
+  @Output('cdkMenuItemTriggered') readonly triggered = new EventEmitter<void>();
 
   /** Emits when the menu item is destroyed. */
-  private readonly _destroyed: Subject<void> = new Subject();
+  private readonly _destroyed = new Subject<void>();
 
   constructor(
     readonly _elementRef: ElementRef<HTMLElement>,

src/cdk-experimental/menu/menu-stack.ts

@@ -34,10 +34,10 @@ export class MenuStack {
   private readonly _elements: MenuStackItem[] = [];
 
   /** Emits the element which was popped off of the stack when requested by a closer. */
-  private readonly _close: Subject<MenuStackItem> = new Subject();
+  private readonly _close = new Subject<MenuStackItem>();
 
   /** Emits once the MenuStack has become empty after popping off elements. */
-  private readonly _empty: Subject<FocusNext> = new Subject();
+  private readonly _empty = new Subject<FocusNext>();
 
   /** Observable which emits the MenuStackItem which has been requested to close. */
   readonly closed: Observable<MenuStackItem> = this._close;

src/cdk-experimental/menu/menu.ts

@@ -69,7 +69,7 @@ export class CdkMenu extends CdkMenuGroup implements Menu, AfterContentInit, OnI
   @Input('cdkMenuOrientation') orientation: 'horizontal' | 'vertical' = 'vertical';
 
   /** Event emitted when the menu is closed. */
-  @Output() readonly closed: EventEmitter<void | 'click' | 'tab' | 'escape'> = new EventEmitter();
+  @Output() readonly closed = new EventEmitter<void | 'click' | 'tab' | 'escape'>();
 
   // We provide a default MenuStack implementation in case the menu is an inline menu.
   // For Menus part of a MenuBar nested within a MenuPanel this will be overwritten

src/cdk-experimental/popover-edit/focus-escape-notifier.ts

@@ -22,7 +22,7 @@ export const enum FocusEscapeNotifierDirection {
  * focus leaves the region.
  */
 export class FocusEscapeNotifier extends FocusTrap {
-  private _escapeSubject = new Subject<FocusEscapeNotifierDirection>();
+  private readonly _escapeSubject = new Subject<FocusEscapeNotifierDirection>();
 
   constructor(
       element: HTMLElement,

src/cdk-experimental/popover-edit/lens-directives.ts

@@ -84,7 +84,7 @@ export class CdkEditControl<FormValue> implements OnDestroy, OnInit {
   // In Ivy the `host` metadata will be merged, whereas in ViewEngine it is overridden. In order
   // to avoid double event listeners, we need to use `HostListener`. Once Ivy is the default, we
   // can move this back into `host`.
-  // tslint:disable:no-host-decorator-in-concrete
+  // tslint:disable-next-line:no-host-decorator-in-concrete
   @HostListener('ngSubmit')
   handleFormSubmit(): void {
     if (this.ignoreSubmitUnlessValid && !this.editRef.isValid()) { return; }
@@ -107,7 +107,7 @@ export class CdkEditControl<FormValue> implements OnDestroy, OnInit {
   // In Ivy the `host` metadata will be merged, whereas in ViewEngine it is overridden. In order
   // to avoid double event listeners, we need to use `HostListener`. Once Ivy is the default, we
   // can move this back into `host`.
-  // tslint:disable:no-host-decorator-in-concrete
+  // tslint:disable-next-line:no-host-decorator-in-concrete
   @HostListener('document:click', ['$event'])
   handlePossibleClickOut(evt: Event): void {
     if (closest(evt.target, EDIT_PANE_SELECTOR)) { return; }
@@ -128,7 +128,7 @@ export class CdkEditControl<FormValue> implements OnDestroy, OnInit {
   // In Ivy the `host` metadata will be merged, whereas in ViewEngine it is overridden. In order
   // to avoid double event listeners, we need to use `HostListener`. Once Ivy is the default, we
   // can move this back into `host`.
-  // tslint:disable:no-host-decorator-in-concrete
+  // tslint:disable-next-line:no-host-decorator-in-concrete
   @HostListener('keydown', ['$event'])
   _handleKeydown(event: KeyboardEvent) {
     if (event.key === 'Escape' && !hasModifierKey(event)) {
@@ -167,7 +167,7 @@ export class CdkEditRevert<FormValue> {
   // In Ivy the `host` metadata will be merged, whereas in ViewEngine it is overridden. In order
   // to avoid double event listeners, we need to use `HostListener`. Once Ivy is the default, we
   // can move this back into `host`.
-  // tslint:disable:no-host-decorator-in-concrete
+  // tslint:disable-next-line:no-host-decorator-in-concrete
   @HostListener('click')
   revertEdit(): void {
     this.editRef.reset();
@@ -192,10 +192,8 @@ export class CdkEditClose<FormValue> {
   // In Ivy the `host` metadata will be merged, whereas in ViewEngine it is overridden. In order
   // to avoid double event listeners, we need to use `HostListener`. Once Ivy is the default, we
   // can move this back into `host`.
-  // tslint:disable:no-host-decorator-in-concrete
-  @HostListener('click')
-  @HostListener('keydown.enter')
-  @HostListener('keydown.space')
+  // tslint:disable-next-line:no-host-decorator-in-concrete
+  @HostListener('click') @HostListener('keydown.enter') @HostListener('keydown.space')
   closeEdit(): void {
     // Note that we use `click` here, rather than a keyboard event, because some screen readers
     // will emit a fake click event instead of an enter keyboard event on buttons. For the keyboard

src/cdk-experimental/popover-edit/table-directives.ts

@@ -501,7 +501,7 @@ export class CdkEditOpen {
   // In Ivy the `host` metadata will be merged, whereas in ViewEngine it is overridden. In order
   // to avoid double event listeners, we need to use `HostListener`. Once Ivy is the default, we
   // can move this back into `host`.
-  // tslint:disable:no-host-decorator-in-concrete
+  // tslint:disable-next-line:no-host-decorator-in-concrete
   @HostListener('click', ['$event'])
   openEdit(evt: Event): void {
     this.editEventDispatcher.editing.next(closest(this.elementRef.nativeElement!, CELL_SELECTOR));

src/cdk/a11y/focus-monitor/focus-monitor.ts

@@ -68,7 +68,7 @@ export const FOCUS_MONITOR_DEFAULT_OPTIONS =
 
 type MonitoredElementInfo = {
   checkChildren: boolean,
-  subject: Subject<FocusOrigin>,
+  readonly subject: Subject<FocusOrigin>,
   rootNode: HTMLElement|Document
 };
 
@@ -565,7 +565,7 @@ function getTarget(event: Event): HTMLElement|null {
 })
 export class CdkMonitorFocus implements AfterViewInit, OnDestroy {
   private _monitorSubscription: Subscription;
-  @Output() cdkFocusChange = new EventEmitter<FocusOrigin>();
+  @Output() readonly cdkFocusChange = new EventEmitter<FocusOrigin>();
 
   constructor(private _elementRef: ElementRef<HTMLElement>, private _focusMonitor: FocusMonitor) {}
 

src/cdk/a11y/key-manager/list-key-manager.spec.ts

@@ -26,7 +26,7 @@ class FakeHighlightable {
 }
 
 class FakeQueryList<T> extends QueryList<T> {
-  changes = new Subject<FakeQueryList<T>>();
+  readonly changes = new Subject<FakeQueryList<T>>();
   items: T[];
   get length() { return this.items.length; }
   set length(_) { /* Empty setter for base class constructor */  }

src/cdk/a11y/key-manager/list-key-manager.ts

@@ -44,7 +44,7 @@ export class ListKeyManager<T extends ListKeyManagerOption> {
   private _activeItemIndex = -1;
   private _activeItem: T | null = null;
   private _wrap = false;
-  private _letterKeyStream = new Subject<string>();
+  private readonly _letterKeyStream = new Subject<string>();
   private _typeaheadSubscription = Subscription.EMPTY;
   private _vertical = true;
   private _horizontal: 'ltr' | 'rtl' | null;
@@ -82,10 +82,10 @@ export class ListKeyManager<T extends ListKeyManagerOption> {
    * Stream that emits any time the TAB key is pressed, so components can react
    * when focus is shifted off of the list.
    */
-  tabOut: Subject<void> = new Subject<void>();
+  readonly tabOut = new Subject<void>();
 
   /** Stream that emits whenever the active item of the list manager changes. */
-  change = new Subject<number>();
+  readonly change = new Subject<number>();
 
   /**
    * Sets the predicate function that determines which items should be skipped by the

src/cdk/a11y/live-announcer/live-announcer.md

@@ -1,12 +1,12 @@
 ### LiveAnnouncer
 `LiveAnnouncer` is used to announce messages for screen-reader users using an `aria-live` region.
 See [the W3C's WAI-ARIA](https://www.w3.org/TR/wai-aria/states_and_properties#aria-live)
-for more information on aria-live regions. 
+for more information on aria-live regions.
 
 #### Methods
 
 ##### `announce(message: string, politeness?: 'off' | 'polite' | 'assertive'): void`
-Announce the given message via aria-live region. The politeness argument determines the 
+Announce the given message via aria-live region. The politeness argument determines the
 `aria-live` attribute on the announcer element, defaulting to 'polite'.
 
 #### Examples
@@ -18,9 +18,8 @@ The LiveAnnouncer is injected into a component:
 })
 export class MyComponent {
 
- constructor(liveAnnouncer: LiveAnnouncer) {
-   liveAnnouncer.announce("Hey Google");
- }
-
+  constructor(liveAnnouncer: LiveAnnouncer) {
+    liveAnnouncer.announce("Hey Google");
+  }
 }
 ```

src/cdk/accordion/accordion-item.ts

@@ -42,18 +42,18 @@ export class CdkAccordionItem implements OnDestroy {
   /** Subscription to openAll/closeAll events. */
   private _openCloseAllSubscription = Subscription.EMPTY;
   /** Event emitted every time the AccordionItem is closed. */
-  @Output() closed: EventEmitter<void> = new EventEmitter<void>();
+  @Output() readonly closed = new EventEmitter<void>();
   /** Event emitted every time the AccordionItem is opened. */
-  @Output() opened: EventEmitter<void> = new EventEmitter<void>();
+  @Output() readonly opened = new EventEmitter<void>();
   /** Event emitted when the AccordionItem is destroyed. */
-  @Output() destroyed: EventEmitter<void> = new EventEmitter<void>();
+  @Output() readonly destroyed = new EventEmitter<void>();
 
   /**
    * Emits whenever the expanded state of the accordion changes.
    * Primarily used to facilitate two-way binding.
    * @docs-private
    */
-  @Output() expandedChange: EventEmitter<boolean> = new EventEmitter<boolean>();
+  @Output() readonly expandedChange = new EventEmitter<boolean>();
 
   /** The unique AccordionItem id. */
   readonly id: string = `cdk-accordion-child-${nextId++}`;

src/cdk/accordion/accordion.ts

@@ -33,7 +33,7 @@ export class CdkAccordion implements OnDestroy, OnChanges {
   readonly _stateChanges = new Subject<SimpleChanges>();
 
   /** Stream that emits true/false when openAll/closeAll is triggered. */
-  readonly _openCloseAllActions: Subject<boolean> = new Subject<boolean>();
+  readonly _openCloseAllActions = new Subject<boolean>();
 
   /** A readonly id value to use for unique selection coordination. */
   readonly id = `cdk-accordion-${nextId++}`;

src/cdk/bidi/dir.ts

@@ -40,7 +40,7 @@ export class Dir implements Directionality, AfterContentInit, OnDestroy {
   _rawDir: string;
 
   /** Event emitted when the direction changes. */
-  @Output('dirChange') change = new EventEmitter<Direction>();
+  @Output('dirChange') readonly change = new EventEmitter<Direction>();
 
   /** @docs-private */
   @Input()

src/cdk/clipboard/copy-to-clipboard.ts

@@ -54,7 +54,7 @@ export class CdkCopyToClipboard implements OnDestroy {
    * Emits when some text is copied to the clipboard. The
    * emitted value indicates whether copying was successful.
    */
-  @Output('cdkCopyToClipboardCopied') copied = new EventEmitter<boolean>();
+  @Output('cdkCopyToClipboardCopied') readonly copied = new EventEmitter<boolean>();
 
   /** Copies that are currently being attempted. */
   private _pending = new Set<PendingCopy>();

src/cdk/collections/selection-model.ts

@@ -34,7 +34,7 @@ export class SelectionModel<T> {
   }
 
   /** Event emitted when the value has changed. */
-  changed: Subject<SelectionChange<T>> = new Subject();
+  readonly changed = new Subject<SelectionChange<T>>();
 
   constructor(
     private _multiple = false,

src/cdk/drag-drop/directives/drag-handle.ts

@@ -41,7 +41,7 @@ export class CdkDragHandle implements OnDestroy {
   _parentDrag: {} | undefined;
 
   /** Emits when the state of the handle has changed. */
-  _stateChanges = new Subject<CdkDragHandle>();
+  readonly _stateChanges = new Subject<CdkDragHandle>();
 
   /** Whether starting to drag through this handle is disabled. */
   @Input('cdkDragHandleDisabled')