From 3172f8d81fd0500103c473adfd50158768bf5640 Mon Sep 17 00:00:00 2001 From: Wagner Maciel Date: Mon, 12 Jul 2021 06:31:57 -0700 Subject: [PATCH] Revert "fix(cdk/table): set default role of table to 'table' (#22491)" This reverts commit 71d75f41ed17a449fbde6b622c79757370d17af3. --- src/cdk/table/cell.ts | 18 ++++-------------- src/cdk/table/table.spec.ts | 17 ++--------------- src/cdk/table/table.ts | 2 +- src/material-experimental/mdc-table/cell.ts | 2 ++ 4 files changed, 9 insertions(+), 30 deletions(-) diff --git a/src/cdk/table/cell.ts b/src/cdk/table/cell.ts index ebf085e58654..540858827a1d 100644 --- a/src/cdk/table/cell.ts +++ b/src/cdk/table/cell.ts @@ -11,10 +11,10 @@ import { ContentChild, Directive, ElementRef, - Inject, Input, - Optional, TemplateRef, + Inject, + Optional, } from '@angular/core'; import {CanStick, CanStickCtor, mixinHasStickyInput} from './can-stick'; import {CDK_TABLE} from './tokens'; @@ -178,17 +178,12 @@ export class CdkHeaderCell extends BaseCdkCell { selector: 'cdk-footer-cell, td[cdk-footer-cell]', host: { 'class': 'cdk-footer-cell', + 'role': 'gridcell', }, }) export class CdkFooterCell extends BaseCdkCell { constructor(columnDef: CdkColumnDef, elementRef: ElementRef) { super(columnDef, elementRef); - if (columnDef._table?._elementRef.nativeElement.nodeType === 1) { - const tableRole = columnDef._table._elementRef.nativeElement - .getAttribute('role'); - const role = (tableRole === 'grid' || tableRole === 'treegrid') ? 'gridcell' : 'cell'; - elementRef.nativeElement.setAttribute('role', role); - } } } @@ -197,16 +192,11 @@ export class CdkFooterCell extends BaseCdkCell { selector: 'cdk-cell, td[cdk-cell]', host: { 'class': 'cdk-cell', + 'role': 'gridcell', }, }) export class CdkCell extends BaseCdkCell { constructor(columnDef: CdkColumnDef, elementRef: ElementRef) { super(columnDef, elementRef); - if (columnDef._table?._elementRef.nativeElement.nodeType === 1) { - const tableRole = columnDef._table._elementRef.nativeElement - .getAttribute('role'); - const role = (tableRole === 'grid' || tableRole === 'treegrid') ? 'gridcell' : 'cell'; - elementRef.nativeElement.setAttribute('role', role); - } } } diff --git a/src/cdk/table/table.spec.ts b/src/cdk/table/table.spec.ts index d73dd322a50c..b156bb49daa5 100644 --- a/src/cdk/table/table.spec.ts +++ b/src/cdk/table/table.spec.ts @@ -108,7 +108,7 @@ describe('CdkTable', () => { }); it('with the right accessibility roles', () => { - expect(tableElement.getAttribute('role')).toBe('table'); + expect(tableElement.getAttribute('role')).toBe('grid'); expect(getHeaderRows(tableElement)[0].getAttribute('role')).toBe('row'); const header = getHeaderRows(tableElement)[0]; @@ -119,7 +119,7 @@ describe('CdkTable', () => { getRows(tableElement).forEach(row => { expect(row.getAttribute('role')).toBe('row'); getCells(row).forEach(cell => { - expect(cell.getAttribute('role')).toBe('cell'); + expect(cell.getAttribute('role')).toBe('gridcell'); }); }); }); @@ -622,19 +622,6 @@ describe('CdkTable', () => { it('should not clobber an existing table role', () => { setupTableTestApp(CustomRoleCdkTableApp); expect(tableElement.getAttribute('role')).toBe('treegrid'); - - expect(getHeaderRows(tableElement)[0].getAttribute('role')).toBe('row'); - const header = getHeaderRows(tableElement)[0]; - getHeaderCells(header).forEach(cell => { - expect(cell.getAttribute('role')).toBe('columnheader'); - }); - - getRows(tableElement).forEach(row => { - expect(row.getAttribute('role')).toBe('row'); - getCells(row).forEach(cell => { - expect(cell.getAttribute('role')).toBe('gridcell'); - }); - }); }); it('should throw an error if two column definitions have the same name', () => { diff --git a/src/cdk/table/table.ts b/src/cdk/table/table.ts index dcfec39e5432..a5a0b29cb71a 100644 --- a/src/cdk/table/table.ts +++ b/src/cdk/table/table.ts @@ -521,7 +521,7 @@ export class CdkTable implements AfterContentChecked, CollectionViewer, OnDes @Optional() @SkipSelf() @Inject(STICKY_POSITIONING_LISTENER) protected readonly _stickyPositioningListener: StickyPositioningListener) { if (!role) { - this._elementRef.nativeElement.setAttribute('role', 'table'); + this._elementRef.nativeElement.setAttribute('role', 'grid'); } this._document = _document; diff --git a/src/material-experimental/mdc-table/cell.ts b/src/material-experimental/mdc-table/cell.ts index eb49f45da598..6a34ced92195 100644 --- a/src/material-experimental/mdc-table/cell.ts +++ b/src/material-experimental/mdc-table/cell.ts @@ -90,6 +90,7 @@ export class MatHeaderCell extends CdkHeaderCell {} selector: 'mat-footer-cell, td[mat-footer-cell]', host: { 'class': 'mat-mdc-footer-cell mdc-data-table__cell', + 'role': 'gridcell', }, }) export class MatFooterCell extends CdkFooterCell {} @@ -99,6 +100,7 @@ export class MatFooterCell extends CdkFooterCell {} selector: 'mat-cell, td[mat-cell]', host: { 'class': 'mat-mdc-cell mdc-data-table__cell', + 'role': 'gridcell', }, }) export class MatCell extends CdkCell {}