[ML] Accessibility fix for structural markup on table rows (#55075)

peteharverson · web-flow · commit d740ec34b372 · 2020-01-17T13:48:31.000Z
* [ML] Accessibility fix for structural markup on table rows

* [ML] Fix type error on Transforms table cell for scope property
diff --git a/x-pack/legacy/plugins/ml/public/application/components/annotations/annotations_table/__snapshots__/annotations_table.test.js.snap b/x-pack/legacy/plugins/ml/public/application/components/annotations/annotations_table/__snapshots__/annotations_table.test.js.snap
diff --git a/x-pack/legacy/plugins/ml/public/application/components/annotations/annotations_table/annotations_table.js b/x-pack/legacy/plugins/ml/public/application/components/annotations/annotations_table/annotations_table.js
@@ -323,6 +323,7 @@ const AnnotationsTable = injectI18n(
           }),
           sortable: true,
           width: '50%',
+          scope: 'row',
         },
         {
           field: 'timestamp',
diff --git a/x-pack/legacy/plugins/ml/public/application/components/anomalies_table/anomalies_table_columns.js b/x-pack/legacy/plugins/ml/public/application/components/anomalies_table/anomalies_table_columns.js
@@ -101,6 +101,7 @@ export function getColumns(
         defaultMessage: 'time',
       }),
       dataType: 'date',
+      scope: 'row',
       render: date => renderTime(date, interval),
       textOnly: true,
       sortable: true,
diff --git a/x-pack/legacy/plugins/ml/public/application/components/ml_in_memory_table/types.ts b/x-pack/legacy/plugins/ml/public/application/components/ml_in_memory_table/types.ts
@@ -28,6 +28,7 @@ export interface FieldDataColumnType<T> {
   render?: RenderFunc;
   footer?: string | ReactElement | FooterFunc;
   textOnly?: boolean;
+  scope?: 'col' | 'row' | 'colgroup' | 'rowgroup';
   'data-test-subj'?: string;
 }
 
diff --git a/x-pack/legacy/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/columns.tsx b/x-pack/legacy/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/columns.tsx
@@ -182,6 +182,7 @@ export const getColumns = (
       sortable: true,
       truncateText: true,
       'data-test-subj': 'mlAnalyticsTableColumnId',
+      scope: 'row',
     },
     {
       field: DataFrameAnalyticsListColumn.description,
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/jobs_list/components/job_details/forecasts_table/forecasts_table.js b/x-pack/legacy/plugins/ml/public/application/jobs/jobs_list/components/job_details/forecasts_table/forecasts_table.js
@@ -204,6 +204,7 @@ class ForecastsTableUI extends Component {
         render: date => formatDate(date, TIME_FORMAT),
         textOnly: true,
         sortable: true,
+        scope: 'row',
       },
       {
         field: 'forecast_start_timestamp',
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/jobs_list/components/jobs_list/jobs_list.js b/x-pack/legacy/plugins/ml/public/application/jobs/jobs_list/components/jobs_list/jobs_list.js
@@ -172,6 +172,7 @@ class JobsListUI extends Component {
         sortable: true,
         truncateText: false,
         width: '20%',
+        scope: 'row',
         render: isManagementTable ? id => this.getJobIdLink(id) : undefined,
       },
       {
diff --git a/x-pack/legacy/plugins/ml/public/application/settings/calendars/edit/events_table/__snapshots__/events_table.test.js.snap b/x-pack/legacy/plugins/ml/public/application/settings/calendars/edit/events_table/__snapshots__/events_table.test.js.snap
diff --git a/x-pack/legacy/plugins/ml/public/application/settings/calendars/edit/events_table/events_table.js b/x-pack/legacy/plugins/ml/public/application/settings/calendars/edit/events_table/events_table.js
@@ -63,6 +63,7 @@ export const EventsTable = injectI18n(function EventsTable({
       }),
       sortable: true,
       truncateText: true,
+      scope: 'row',
     },
     {
       field: 'start_time',
diff --git a/x-pack/legacy/plugins/ml/public/application/settings/calendars/list/table/__snapshots__/table.test.js.snap b/x-pack/legacy/plugins/ml/public/application/settings/calendars/list/table/__snapshots__/table.test.js.snap
diff --git a/x-pack/legacy/plugins/ml/public/application/settings/calendars/list/table/table.js b/x-pack/legacy/plugins/ml/public/application/settings/calendars/list/table/table.js
@@ -43,6 +43,7 @@ export const CalendarsListTable = injectI18n(function CalendarsListTable({
       }),
       sortable: true,
       truncateText: true,
+      scope: 'row',
       render: id => <EuiLink href={`#/settings/calendars_list/edit_calendar/${id}`}>{id}</EuiLink>,
     },
     {
diff --git a/x-pack/legacy/plugins/ml/public/application/settings/filter_lists/list/__snapshots__/table.test.js.snap b/x-pack/legacy/plugins/ml/public/application/settings/filter_lists/list/__snapshots__/table.test.js.snap
diff --git a/x-pack/legacy/plugins/ml/public/application/settings/filter_lists/list/table.js b/x-pack/legacy/plugins/ml/public/application/settings/filter_lists/list/table.js
@@ -85,6 +85,7 @@ function getColumns() {
       }),
       render: id => <EuiLink href={`#/settings/filter_lists/edit_filter_list/${id}`}>{id}</EuiLink>,
       sortable: true,
+      scope: 'row',
     },
     {
       field: 'description',
diff --git a/x-pack/legacy/plugins/transform/public/app/sections/transform_management/components/transform_list/columns.tsx b/x-pack/legacy/plugins/transform/public/app/sections/transform_management/components/transform_list/columns.tsx
@@ -138,6 +138,7 @@ export const getColumns = (
       name: 'ID',
       sortable: true,
       truncateText: true,
+      scope: 'row',
     },
     {
       field: TRANSFORM_LIST_COLUMN.DESCRIPTION,

Original file line number	Diff line number	Diff line change
`@@ -323,6 +323,7 @@ const AnnotationsTable = injectI18n(`
`323`	`323`	`}),`
`324`	`324`	`sortable: true,`
`325`	`325`	`width: '50%',`
	`326`	`+ scope: 'row',`
`326`	`327`	`},`
`327`	`328`	`{`
`328`	`329`	`field: 'timestamp',`
Original file line number	Diff line number	Diff line change
`@@ -28,6 +28,7 @@ export interface FieldDataColumnType<T> {`
`28`	`28`	`render?: RenderFunc;`
`29`	`29`	`footer?: string \| ReactElement \| FooterFunc;`
`30`	`30`	`textOnly?: boolean;`
	`31`	`+ scope?: 'col' \| 'row' \| 'colgroup' \| 'rowgroup';`
`31`	`32`	`'data-test-subj'?: string;`
`32`	`33`	`}`
`33`	`34`
Original file line number	Diff line number	Diff line change
`@@ -182,6 +182,7 @@ export const getColumns = (`
`182`	`182`	`sortable: true,`
`183`	`183`	`truncateText: true,`
`184`	`184`	`'data-test-subj': 'mlAnalyticsTableColumnId',`
	`185`	`+ scope: 'row',`
`185`	`186`	`},`
`186`	`187`	`{`
`187`	`188`	`field: DataFrameAnalyticsListColumn.description,`
Original file line number	Diff line number	Diff line change
`@@ -204,6 +204,7 @@ class ForecastsTableUI extends Component {`
`204`	`204`	`render: date => formatDate(date, TIME_FORMAT),`
`205`	`205`	`textOnly: true,`
`206`	`206`	`sortable: true,`
	`207`	`+ scope: 'row',`
`207`	`208`	`},`
`208`	`209`	`{`
`209`	`210`	`field: 'forecast_start_timestamp',`
Original file line number	Diff line number	Diff line change
`@@ -172,6 +172,7 @@ class JobsListUI extends Component {`
`172`	`172`	`sortable: true,`
`173`	`173`	`truncateText: false,`
`174`	`174`	`width: '20%',`
	`175`	`+ scope: 'row',`
`175`	`176`	`render: isManagementTable ? id => this.getJobIdLink(id) : undefined,`
`176`	`177`	`},`
`177`	`178`	`{`
Original file line number	Diff line number	Diff line change
`@@ -63,6 +63,7 @@ export const EventsTable = injectI18n(function EventsTable({`
`63`	`63`	`}),`
`64`	`64`	`sortable: true,`
`65`	`65`	`truncateText: true,`
	`66`	`+ scope: 'row',`
`66`	`67`	`},`
`67`	`68`	`{`
`68`	`69`	`field: 'start_time',`