Skip to content

Commit 38affc3

Browse files
authoredJan 10, 2022
fix(material-experimental/mdc-list): ensure selection change event fires properly (#24174)
Leverages the new selection change event that we landed upstream in MDC. The notify action adapter method was not suitable for the event notification as it did not fire for e.g. CTRL + A selections and was generally, semantically not guaranteed to fire on actual interactive selections (like native controls emit the change event).
1 parent 853841c commit 38affc3

File tree

2 files changed

+3
-10
lines changed

2 files changed

+3
-10
lines changed
 

‎src/material-experimental/mdc-list/selection-list.spec.ts

+1-8
Original file line numberDiff line numberDiff line change
@@ -424,14 +424,7 @@ describe('MDC-based MatSelectionList without forms', () => {
424424
expect(listOptions.every(option => option.componentInstance.selected)).toBe(false);
425425
});
426426

427-
// This is temporarily disabled as the MDC list does not emit a proper event when
428-
// items are interactively toggled with e.g. `CTRL + A`.
429-
// TODO(devversion): look more into this. MDC does not expose an `onChange` adapter
430-
// function. Authors are required to emit a change event on checkbox/radio change, but
431-
// that is not an viable option for us since we also allow for programmatic selection updates.
432-
// https://github.com/material-components/material-components-web/blob/a986df922b6b4c1ef5c59925107281d1d40287a8/packages/mdc-list/component.ts#L300-L308.
433-
// tslint:disable-next-line:ban
434-
xit('should dispatch the selectionChange event when selecting via ctrl + a', () => {
427+
it('should dispatch the selectionChange event when selecting via ctrl + a', () => {
435428
const spy = spyOn(fixture.componentInstance, 'onSelectionChange');
436429
listOptions.forEach(option => (option.componentInstance.disabled = false));
437430
fixture.detectChanges();

‎src/material-experimental/mdc-list/selection-list.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -398,8 +398,8 @@ function getSelectionListAdapter(list: MatSelectionList): MDCListAdapter {
398398

399399
baseAdapter.setAttributeForElementIndex(index, attribute, value);
400400
},
401-
notifyAction(index: number): void {
402-
list._emitChangeEvent([list._itemsArr[index]]);
401+
notifySelectionChange(changedIndices: number[]): void {
402+
list._emitChangeEvent(changedIndices.map(index => list._itemsArr[index]));
403403
},
404404
};
405405
}

0 commit comments

Comments
 (0)
Please sign in to comment.