fix(table): better handling of invalid data

The table data source is set up to expect an array and will throw a cryptic error down the line if the value is anything different. While typings should be enough to enforce this, if the value comes from somewhere in the view it may not get caught. Since the effort for handling it on our end is minimal, these changes add some logic that fall back to an empty array if the value is invalid.

Fixes #18859.

Author: crisbeto

src/material/table/table-data-source.ts

@@ -69,7 +69,7 @@ export class MatTableDataSource<T> extends DataSource<T> {
 
   /** Array of data that should be rendered by the table, where each object represents one row. */
   get data() { return this._data.value; }
-  set data(data: T[]) { this._data.next(data); }
+  set data(data: T[]) { this._data.next(Array.isArray(data) ? data : []); }
 
   /**
    * Filter term that should be used to filter out objects from the data array. To override how

src/material/table/table.spec.ts

@@ -213,6 +213,45 @@ describe('MatTable', () => {
       ]);
     });
 
+    it('should fall back to empty table if invalid data is passed in', () => {
+      component.underlyingDataSource.addData();
+      fixture.detectChanges();
+      expectTableToMatchContent(tableElement, [
+        ['Column A', 'Column B', 'Column C'],
+        ['a_1', 'b_1', 'c_1'],
+        ['a_2', 'b_2', 'c_2'],
+        ['a_3', 'b_3', 'c_3'],
+        ['a_4', 'b_4', 'c_4'],
+        ['Footer A', 'Footer B', 'Footer C'],
+      ]);
+
+      dataSource.data = null!;
+      fixture.detectChanges();
+      expectTableToMatchContent(tableElement, [
+        ['Column A', 'Column B', 'Column C'],
+        ['Footer A', 'Footer B', 'Footer C'],
+      ]);
+
+      component.underlyingDataSource.addData();
+      fixture.detectChanges();
+      expectTableToMatchContent(tableElement, [
+        ['Column A', 'Column B', 'Column C'],
+        ['a_1', 'b_1', 'c_1'],
+        ['a_2', 'b_2', 'c_2'],
+        ['a_3', 'b_3', 'c_3'],
+        ['a_4', 'b_4', 'c_4'],
+        ['a_5', 'b_5', 'c_5'],
+        ['Footer A', 'Footer B', 'Footer C'],
+      ]);
+
+      dataSource.data = {} as any;
+      fixture.detectChanges();
+      expectTableToMatchContent(tableElement, [
+        ['Column A', 'Column B', 'Column C'],
+        ['Footer A', 'Footer B', 'Footer C'],
+      ]);
+    });
+
     it('should update the page index when switching to a smaller data set from a page',
       fakeAsync(() => {
         // Add 20 rows so we can switch pages.