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/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();
@@ -191,7 +191,7 @@ 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
+  // tslint:disable-next-line:no-host-decorator-in-concrete
   @HostListener('click')
   closeEdit(): void {
     // Note that we use `click` here, rather than a keyboard event, because some screen readers

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

@@ -478,7 +478,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

@@ -438,7 +438,7 @@ export class FocusMonitor implements OnDestroy {
 })
 export class CdkMonitorFocus implements OnDestroy {
   private _monitorSubscription: Subscription;
-  @Output() cdkFocusChange = new EventEmitter<FocusOrigin>();
+  @Output() readonly cdkFocusChange = new EventEmitter<FocusOrigin>();
 
   constructor(private _elementRef: ElementRef<HTMLElement>, private _focusMonitor: FocusMonitor) {
     this._monitorSubscription = this._focusMonitor.monitor(

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

@@ -41,18 +41,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/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.spec.ts

@@ -12,7 +12,7 @@ const COPY_CONTENT = 'copy content';
 })
 class CopyToClipboardHost {
   @Input() content = '';
-  @Output() copied = new EventEmitter<boolean>();
+  @Output() readonly copied = new EventEmitter<boolean>();
 }
 
 describe('CdkCopyToClipboard', () => {

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

@@ -28,7 +28,7 @@ export class CdkCopyToClipboard {
    * Emits when some text is copied to the clipboard. The
    * emitted value indicates whether copying was successful.
    */
-  @Output() copied = new EventEmitter<boolean>();
+  @Output() readonly copied = new EventEmitter<boolean>();
 
   constructor(private readonly _clipboard: Clipboard) {}
 

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

@@ -79,7 +79,7 @@ export function CDK_DRAG_CONFIG_FACTORY(): DragRefConfig {
   providers: [{provide: CDK_DRAG_PARENT, useExisting: CdkDrag}]
 })
 export class CdkDrag<T = any> implements AfterViewInit, OnChanges, OnDestroy {
-  private _destroyed = new Subject<void>();
+  private readonly _destroyed = new Subject<void>();
 
   /** Reference to the underlying drag instance. */
   _dragRef: DragRef<CdkDrag<T>>;
@@ -149,32 +149,29 @@ export class CdkDrag<T = any> implements AfterViewInit, OnChanges, OnDestroy {
   @Input('cdkDragPreviewClass') previewClass: string | string[];
 
   /** Emits when the user starts dragging the item. */
-  @Output('cdkDragStarted') started: EventEmitter<CdkDragStart> = new EventEmitter<CdkDragStart>();
+  @Output('cdkDragStarted') readonly started = new EventEmitter<CdkDragStart>();
 
   /** Emits when the user has released a drag item, before any animations have started. */
-  @Output('cdkDragReleased') released: EventEmitter<CdkDragRelease> =
-      new EventEmitter<CdkDragRelease>();
+  @Output('cdkDragReleased') readonly released = new EventEmitter<CdkDragRelease>();
 
   /** Emits when the user stops dragging an item in the container. */
-  @Output('cdkDragEnded') ended: EventEmitter<CdkDragEnd> = new EventEmitter<CdkDragEnd>();
+  @Output('cdkDragEnded') readonly ended = new EventEmitter<CdkDragEnd>();
 
   /** Emits when the user has moved the item into a new container. */
-  @Output('cdkDragEntered') entered: EventEmitter<CdkDragEnter<any>> =
-      new EventEmitter<CdkDragEnter<any>>();
+  @Output('cdkDragEntered') readonly entered = new EventEmitter<CdkDragEnter<any>>();
 
   /** Emits when the user removes the item its container by dragging it into another container. */
-  @Output('cdkDragExited') exited: EventEmitter<CdkDragExit<any>> =
-      new EventEmitter<CdkDragExit<any>>();
+  @Output('cdkDragExited') readonly exited = new EventEmitter<CdkDragExit<any>>();
 
   /** Emits when the user drops the item inside a container. */
-  @Output('cdkDragDropped') dropped: EventEmitter<CdkDragDrop<any>> =
-      new EventEmitter<CdkDragDrop<any>>();
+  @Output('cdkDragDropped') readonly dropped = new EventEmitter<CdkDragDrop<any>>();
 
   /**
    * Emits as the user is dragging the item. Use with caution,
    * because this event will fire for every pixel that the user has dragged.
    */
-  @Output('cdkDragMoved') moved: Observable<CdkDragMove<T>> =
+  @Output('cdkDragMoved')
+  readonly moved =
       new Observable((observer: Observer<CdkDragMove<T>>) => {
         const subscription = this._dragRef.moved.pipe(map(movedEvent => ({
           source: this,

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

@@ -60,7 +60,7 @@ export interface CdkDropListInternal extends CdkDropList {}
 })
 export class CdkDropList<T = any> implements AfterContentInit, OnDestroy {
   /** Emits when the list has been destroyed. */
-  private _destroyed = new Subject<void>();
+  private readonly _destroyed = new Subject<void>();
 
   /** Keeps track of the drop lists that are currently on the page. */
   private static _dropLists: CdkDropList[] = [];
@@ -120,25 +120,21 @@ export class CdkDropList<T = any> implements AfterContentInit, OnDestroy {
   autoScrollDisabled: boolean = false;
 
   /** Emits when the user drops an item inside the container. */
-  @Output('cdkDropListDropped')
-  dropped: EventEmitter<CdkDragDrop<T, any>> = new EventEmitter<CdkDragDrop<T, any>>();
+  @Output('cdkDropListDropped') readonly dropped = new EventEmitter<CdkDragDrop<T, any>>();
 
   /**
    * Emits when the user has moved a new drag item into this container.
    */
-  @Output('cdkDropListEntered')
-  entered: EventEmitter<CdkDragEnter<T>> = new EventEmitter<CdkDragEnter<T>>();
+  @Output('cdkDropListEntered') readonly entered = new EventEmitter<CdkDragEnter<T>>();
 
   /**
    * Emits when the user removes an item from the container
    * by dragging it into another container.
    */
-  @Output('cdkDropListExited')
-  exited: EventEmitter<CdkDragExit<T>> = new EventEmitter<CdkDragExit<T>>();
+  @Output('cdkDropListExited') readonly exited = new EventEmitter<CdkDragExit<T>>();
 
   /** Emits as the user is swapping items while actively dragging. */
-  @Output('cdkDropListSorted')
-  sorted: EventEmitter<CdkDragSortEvent<T>> = new EventEmitter<CdkDragSortEvent<T>>();
+  @Output('cdkDropListSorted') readonly sorted = new EventEmitter<CdkDragSortEvent<T>>();
 
   constructor(
       /** Element that the drop list is attached to. */

src/cdk/observers/observe-content.ts

@@ -40,7 +40,7 @@ export class ContentObserver implements OnDestroy {
   /** Keeps track of the existing MutationObservers so they can be reused. */
   private _observedElements = new Map<Element, {
     observer: MutationObserver | null,
-    stream: Subject<MutationRecord[]>,
+    readonly stream: Subject<MutationRecord[]>,
     count: number
   }>();
 
@@ -135,7 +135,7 @@ export class ContentObserver implements OnDestroy {
 })
 export class CdkObserveContent implements AfterContentInit, OnDestroy {
   /** Event emitted for each change in the element's content. */
-  @Output('cdkObserveContent') event = new EventEmitter<MutationRecord[]>();
+  @Output('cdkObserveContent') readonly event = new EventEmitter<MutationRecord[]>();
 
   /**
    * Whether observing content is disabled. This option can be used

src/cdk/overlay/overlay-directives.ts

@@ -199,19 +199,19 @@ export class CdkConnectedOverlay implements OnDestroy, OnChanges {
   set push(value: boolean) { this._push = coerceBooleanProperty(value); }
 
   /** Event emitted when the backdrop is clicked. */
-  @Output() backdropClick = new EventEmitter<MouseEvent>();
+  @Output() readonly backdropClick = new EventEmitter<MouseEvent>();
 
   /** Event emitted when the position has changed. */
-  @Output() positionChange = new EventEmitter<ConnectedOverlayPositionChange>();
+  @Output() readonly positionChange = new EventEmitter<ConnectedOverlayPositionChange>();
 
   /** Event emitted when the overlay has been attached. */
-  @Output() attach = new EventEmitter<void>();
+  @Output() readonly attach = new EventEmitter<void>();
 
   /** Event emitted when the overlay has been detached. */
-  @Output() detach = new EventEmitter<void>();
+  @Output() readonly detach = new EventEmitter<void>();
 
   /** Emits when there are keyboard events that are targeted at the overlay. */
-  @Output() overlayKeydown = new EventEmitter<KeyboardEvent>();
+  @Output() readonly overlayKeydown = new EventEmitter<KeyboardEvent>();
 
   // TODO(jelbourn): inputs for size, scroll behavior, animation, etc.
 

src/cdk/portal/portal-directives.ts

@@ -118,8 +118,7 @@ export class CdkPortalOutlet extends BasePortalOutlet implements OnInit, OnDestr
   }
 
   /** Emits when a portal is attached to the outlet. */
-  @Output() attached: EventEmitter<CdkPortalOutletAttachedRef> =
-      new EventEmitter<CdkPortalOutletAttachedRef>();
+  @Output() readonly attached = new EventEmitter<CdkPortalOutletAttachedRef>();
 
   /** Component or view reference that is attached to the portal. */
   get attachedRef(): CdkPortalOutletAttachedRef {

src/cdk/scrolling/virtual-scroll-viewport.ts

@@ -64,10 +64,10 @@ const SCROLL_SCHEDULER =
 })
 export class CdkVirtualScrollViewport extends CdkScrollable implements OnInit, OnDestroy {
   /** Emits when the viewport is detached from a CdkVirtualForOf. */
-  private _detachedSubject = new Subject<void>();
+  private readonly _detachedSubject = new Subject<void>();
 
   /** Emits when the rendered range changes. */
-  private _renderedRangeSubject = new Subject<ListRange>();
+  private readonly _renderedRangeSubject = new Subject<ListRange>();
 
   /** The direction the viewport scrolls. */
   @Input()
@@ -87,16 +87,16 @@ export class CdkVirtualScrollViewport extends CdkScrollable implements OnInit, O
   // depending on how the strategy calculates the scrolled index, it may come at a cost to
   // performance.
   /** Emits when the index of the first element visible in the viewport changes. */
-  @Output() scrolledIndexChange: Observable<number> =
-      new Observable((observer: Observer<number>) =>
-        this._scrollStrategy.scrolledIndexChange.subscribe(index =>
-            Promise.resolve().then(() => this.ngZone.run(() => observer.next(index)))));
+  @Output()
+  readonly scrolledIndexChange = new Observable(
+      (observer: Observer<number>) => this._scrollStrategy.scrolledIndexChange.subscribe(
+          index => Promise.resolve().then(() => this.ngZone.run(() => observer.next(index)))));
 
   /** The element that wraps the rendered content. */
   @ViewChild('contentWrapper', {static: true}) _contentWrapper: ElementRef<HTMLElement>;
 
   /** A stream that emits whenever the rendered range changes. */
-  renderedRangeStream: Observable<ListRange> = this._renderedRangeSubject.asObservable();
+  readonly renderedRangeStream = this._renderedRangeSubject.asObservable();
 
   /**
    * The total size of all content (in pixels), including content that is not currently rendered.

src/cdk/stepper/stepper.ts

@@ -243,7 +243,7 @@ export class CdkStep implements OnChanges {
 })
 export class CdkStepper implements AfterViewInit, OnDestroy {
   /** Emits when the component is destroyed. */
-  protected _destroyed = new Subject<void>();
+  protected readonly _destroyed = new Subject<void>();
 
   /** Used for managing keyboard focus. */
   private _keyManager: FocusKeyManager<FocusableOption>;
@@ -324,8 +324,7 @@ export class CdkStepper implements AfterViewInit, OnDestroy {
   }
 
   /** Event emitted when the selected step has changed. */
-  @Output()
-  selectionChange: EventEmitter<StepperSelectionEvent> = new EventEmitter<StepperSelectionEvent>();
+  @Output() readonly selectionChange = new EventEmitter<StepperSelectionEvent>();
 
   /** Used to track unique ID for each stepper component. */
   _groupId: number;
@@ -550,14 +549,14 @@ interface AbstractControlLike {
   pristine: boolean;
   root: AbstractControlLike;
   status: string;
-  statusChanges: Observable<any>;
+  readonly statusChanges: Observable<any>;
   touched: boolean;
   untouched: boolean;
   updateOn: any;
   valid: boolean;
   validator: ((control: any) => any) | null;
   value: any;
-  valueChanges: Observable<any>;
+  readonly valueChanges: Observable<any>;
   clearAsyncValidators(): void;
   clearValidators(): void;
   disable(opts?: any): void;

src/cdk/testing/private/mock-ng-zone.ts

@@ -18,7 +18,7 @@ import {EventEmitter, Injectable, NgZone} from '@angular/core';
  */
 @Injectable()
 export class MockNgZone extends NgZone {
-  onStable: EventEmitter<any> = new EventEmitter(false);
+  onStable = new EventEmitter<any>();
 
   constructor() {
     super({enableLongStackTrace: false});

src/cdk/text-field/autofill.ts

@@ -32,8 +32,7 @@ export type AutofillEvent = {
 
 /** Used to track info about currently monitored elements. */
 type MonitoredElementInfo = {
-  subject: Subject<AutofillEvent>;
-  unlisten: () => void;
+  readonly subject: Subject<AutofillEvent>; unlisten: () => void;
 };
 
 
@@ -147,7 +146,7 @@ export class AutofillMonitor implements OnDestroy {
 })
 export class CdkAutofill implements OnDestroy, OnInit {
   /** Emits when the autofill state of the element changes. */
-  @Output() cdkAutofill: EventEmitter<AutofillEvent> = new EventEmitter<AutofillEvent>();
+  @Output() readonly cdkAutofill = new EventEmitter<AutofillEvent>();
 
   constructor(private _elementRef: ElementRef<HTMLElement>,
               private _autofillMonitor: AutofillMonitor) {}

src/cdk/tree/tree.spec.ts

@@ -36,7 +36,7 @@ describe('CdkTree', () => {
   let dataSource: FakeDataSource;
   let treeElement: HTMLElement;
   let tree: CdkTree<TestData>;
-  let dir: {value: Direction, change: EventEmitter<Direction>};
+  let dir: {value: Direction, readonly change: EventEmitter<Direction>};
 
   function configureCdkTreeTestingModule(declarations: Type<any>[]) {
     TestBed.configureTestingModule({