refactor: make all event emitters readonly (#17666)

* refactor(material/core): make all event emitters readonly

* fixup! refactor(material/core): make all event emitters readonly

Co-authored-by: Miles Malerba <[email protected]>

Author: rafaelss95

guides/bidirectionality.md

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

@@ -93,7 +93,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,
@@ -243,7 +243,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>>();
 
   @Input() id = `cdk-listbox-${listboxId++}`;

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

@@ -129,7 +129,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>();
 
   /** The menu stack for this trigger and its associated menus. */
   private readonly _menuStack = new MenuStack();

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

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

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

@@ -70,7 +70,7 @@ export class CdkMenuItem implements FocusableOption, FocusableElement, Toggler,
    * 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: EventEmitter<void> = new EventEmitter();
 
   /**
    * The tabindex for this menu item managed internally and used for implementing roving a
@@ -79,7 +79,7 @@ export class CdkMenuItem implements FocusableOption, FocusableElement, Toggler,
   _tabindex: 0 | -1 = -1;
 
   /** 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/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));