Reintroduce MatListOptionChange for deprecation

Author: devversion

src/lib/list/selection-list.spec.ts

@@ -4,7 +4,13 @@ import {createKeyboardEvent, dispatchFakeEvent} from '@angular/cdk/testing';
 import {Component, DebugElement} from '@angular/core';
 import {async, ComponentFixture, fakeAsync, inject, TestBed, tick} from '@angular/core/testing';
 import {By} from '@angular/platform-browser';
-import {MatListModule, MatListOption, MatSelectionList, MatSelectionListChange} from './index';
+import {
+  MatListModule,
+  MatListOption,
+  MatListOptionChange,
+  MatSelectionList,
+  MatSelectionListChange
+} from './index';
 import {FormControl, FormsModule, NgModel, ReactiveFormsModule} from '@angular/forms';
 
 describe('MatSelectionList without forms', () => {
@@ -85,16 +91,18 @@ describe('MatSelectionList without forms', () => {
 
     it('should emit a deprecated selectionChange event on the list option that got clicked', () => {
       const optionInstance = listOptions[2].componentInstance as MatListOption;
-      const selectionChangeSpy = jasmine.createSpy('selectionChange spy');
+      let lastChangeEvent: MatListOptionChange | null = null;
 
-      optionInstance.selectionChange.subscribe(selectionChangeSpy);
+      optionInstance.selectionChange.subscribe(ev => lastChangeEvent = ev);
 
-      expect(selectionChangeSpy).toHaveBeenCalledTimes(0);
+      expect(lastChangeEvent).toBeNull();
 
       dispatchFakeEvent(listOptions[2].nativeElement, 'click');
       fixture.detectChanges();
 
-      expect(selectionChangeSpy).toHaveBeenCalledTimes(1);
+      expect(lastChangeEvent).not.toBeNull();
+      expect(lastChangeEvent!.source).toBe(optionInstance);
+      expect(lastChangeEvent!.selected).toBe(true);
     });
 
     it('should be able to dispatch one selected item', () => {

src/lib/list/selection-list.ts

@@ -58,9 +58,25 @@ export const MAT_SELECTION_LIST_VALUE_ACCESSOR: any = {
   multi: true
 };
 
+/**
+ * Change event object emitted by MatListOption whenever the selected state changes.
+ * @deprecated Use the `MatSelectionListChange` event on the selection list instead.
+ */
+export class MatListOptionChange {
+  constructor(
+    /** Reference to the list option that changed. */
+    public source: MatListOption,
+    /** The new selected state of the option. */
+    public selected: boolean) {}
+}
+
 /** Change event that is being fired whenever the selected state of an option changes. */
 export class MatSelectionListChange {
-  constructor(public source: MatSelectionList, public option: MatListOption) {}
+  constructor(
+    /** Reference to the selection list that emitted the event. */
+    public source: MatSelectionList,
+    /** Reference to the option that has been changed. */
+    public option: MatListOption) {}
 }
 
 /**
@@ -136,8 +152,8 @@ export class MatListOption extends _MatListOptionMixinBase
    * Emits a change event whenever the selected state of an option changes.
    * @deprecated Use the `selectionChange` event on the `<mat-selection-list>` instead.
    */
-  @Output() selectionChange: EventEmitter<MatSelectionListChange> =
-    new EventEmitter<MatSelectionListChange>();
+  @Output() selectionChange: EventEmitter<MatListOptionChange> =
+    new EventEmitter<MatListOptionChange>();
 
   constructor(private _element: ElementRef,
               private _changeDetector: ChangeDetectorRef,
@@ -227,7 +243,7 @@ export class MatListOption extends _MatListOptionMixinBase
   /** Emits a selectionChange event for this option. */
   _emitDeprecatedChangeEvent() {
     // TODO: the `selectionChange` event on the option is deprecated. Remove that in the future.
-    this.selectionChange.emit(new MatSelectionListChange(this.selectionList, this));
+    this.selectionChange.emit(new MatListOptionChange(this, this.selected));
   }
 }