github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

Adding scope to all table headers, fix #12401 (#15079) (#15090)

Browse source 
* Add scope for all th in Kibana

* Add scope to <th> in ui framework

* Update jest snapshots with scope

* Fix wrong usage of colgroup
This commit is contained in:
Tim Roes 2017-11-21 21:48:10 +01:00 • committed by GitHub
parent 28d8c3dc88
commit f3a058e1d8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
26 changed files with 75 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/core_plugins/dev_mode/public/vis_debug_spy_panel.html
View file

@ -13,7 +13,7 @@
<label>Details</label>
<table class="table">
<tr>
<th>
<th scope="row">
Type Name
</th>
<td>
@ -21,7 +21,7 @@
</td>
</tr>
<tr>
<th>
<th scope="row">
Hierarchical Data
</th>
<td>
@ -32,4 +32,4 @@
</div>
</div>
</div>
</div>
</div>

4
src/core_plugins/kbn_vislib_vis_types/public/controls/gauge_options.html
View file

@ -109,10 +109,10 @@
<div class="kuiSideBarSection">
<table class="vis-editor-agg-editor-ranges form-group" ng-show="vis.params.gauge.colorsRange.length">
<tr>
<th>
<th scope="col">
<label id="gaugeOptionsCustomRangeFrom">From</label>
</th>
<th colspan="2">
<th scope="col" colspan="2">
<label id="gaugeOptionsCustomRangeTo">To</label>
</th>
</tr>

4
src/core_plugins/kbn_vislib_vis_types/public/controls/heatmap_options.html
View file

@ -116,10 +116,10 @@
<div class="kuiSideBarSection">
<table class="vis-editor-agg-editor-ranges form-group" ng-show="vis.params.colorsRange.length">
<tr>
<th>
<th scope="col">
<label id="heatmapCustomRangeFrom">From</label>
</th>
<th colspan="2">
<th scope="col" colspan="2">
<label id="heatmapCustomRangeTo">To</label>
</th>
</tr>

10
src/core_plugins/kibana/public/dashboard/listing/dashboard_listing.html
View file

@ -128,7 +128,11 @@
<table class="kuiTable" ng-if="listingController.items.length">
<thead>
<tr>
<th class="kuiTableHeaderCell kuiTableHeaderCell--checkBox" ng-if="!listingController.hideWriteControls">
<th
class="kuiTableHeaderCell kuiTableHeaderCell--checkBox"
ng-if="!listingController.hideWriteControls"
scope="col"
>
<div class="kuiTableHeaderCell__liner">
<input
type="checkbox"
@ -140,7 +144,7 @@
</div>
</th>
<th class="kuiTableHeaderCell">
<th scope="col" class="kuiTableHeaderCell">
<button
class="kuiTableHeaderCellButton"
ng-class="{'kuiTableHeaderCellButton-isSorted': listingController.getSortedProperty().name == 'title'}"
@ -157,7 +161,7 @@
</button>
</th>
<th class="kuiTableHeaderCell">
<th scope="col" class="kuiTableHeaderCell">
<button
class="kuiTableHeaderCellButton"
ng-class="{'kuiTableHeaderCellButton-isSorted': listingController.getSortedProperty().name == 'description'}"

4
src/core_plugins/kibana/public/management/sections/objects/_objects.html
View file

@ -131,7 +131,7 @@
<table class="kuiTable" ng-if="service.data.length" data-test-subj="objectsTable-{{service.title}}">
<thead>
<tr>
<th class="kuiTableHeaderCell kuiTableHeaderCell--checkBox">
<th scope="col" class="kuiTableHeaderCell kuiTableHeaderCell--checkBox">
<div class="kuiTableHeaderCell__liner">
<input
type="checkbox"
@ -144,7 +144,7 @@
</div>
</th>
<th class="kuiTableHeaderCell">
<th scope="col" class="kuiTableHeaderCell">
<div class="kuiTableHeaderCell__liner">
Title
</div>

5
src/core_plugins/kibana/public/management/sections/settings/index.html
View file

@ -43,17 +43,18 @@
<table class="kuiTable kuiVerticalRhythm">
<thead>
<tr>
<th class="kuiTableHeaderCell">
<th scope="col" class="kuiTableHeaderCell">
<div class="kuiTableRowCell__liner">
Name
</div>
</th>
<th class="kuiTableHeaderCell">
<th scope="col" class="kuiTableHeaderCell">
<div class="kuiTableRowCell__liner">
Value
</div>
</th>
<th
scope="col"
class="kuiTableHeaderCell kuiTableHeaderCell--alignRight"
style="width: 180px"
>

4
src/core_plugins/metrics/public/components/markdown_editor.js
View file

@ -115,8 +115,8 @@ class MarkdownEditor extends Component {
<table className="table">
<thead>
<tr>
<th>Name</th>
<th>Value</th>
<th scope="col">Name</th>
<th scope="col">Value</th>
</tr>
</thead>
<tbody>{rows}</tbody>

3
src/core_plugins/metrics/public/components/vis_types/table/vis.js
View file

@ -111,6 +111,7 @@ class TableVis extends Component {
className="tsvb-table__columnName"
onClick={handleClick}
key={item.id}
scope="col"
>
{headerContent}
</th>
@ -137,7 +138,7 @@ class TableVis extends Component {
};
return (
<tr>
<th onClick={handleSortClick}>{label} {sortComponent}</th>
<th scope="col" onClick={handleSortClick}>{label} {sortComponent}</th>
{ columns }
</tr>
);

4
src/core_plugins/status_page/public/status_page.html
View file

@ -28,8 +28,8 @@
<table class="statuses" data-test-subj="statusBreakdown" ng-if="ui.statuses">
<tr class="row">
<th class="col-xs-4">ID</th>
<th class="col-xs-8">Status</th>
<th class="col-xs-4" scope="col">ID</th>
<th class="col-xs-8" scope="col">Status</th>
</tr>
<tr
ng-repeat="status in ui.statuses"

6
src/core_plugins/timelion/public/directives/timelion_expression_suggestions/timelion_expression_suggestions.html
View file

@ -43,9 +43,9 @@
<div class="suggestion-details" ng-show="suggestions.length === 1">
<table class="table table-striped table-condensed table-bordered">
<thead>
<th>Argument Name</th>
<th>Accepted Types</th>
<th>Information</th>
<th scope="col">Argument Name</th>
<th scope="col">Accepted Types</th>
<th scope="col">Information</th>
</thead>
<tr ng-repeat="arg in suggestion.args" ng-hide="$index < 1 && suggestion.chainable">
<td>{{arg.name}}</td>

6
src/core_plugins/timelion/public/directives/timelion_help/timelion_help.html
View file

@ -409,9 +409,9 @@
ng-show="function.args.length > (function.chainable ? 1: 0)"
>
<thead>
<th>Argument Name</th>
<th>Accepted Types</th>
<th>Information</th>
<th scope="col">Argument Name</th>
<th scope="col">Accepted Types</th>
<th scope="col">Information</th>
</thead>
<tr
ng-repeat="arg in function.args"

6
src/ui/public/agg_response/hierarchical/_tooltip.html
View file

@ -1,9 +1,9 @@
<table>
<thead>
<tr class="tooltip-label">
<th>field</th>
<th>value</th>
<th>{{metricCol.label}}</th>
<th scope="col">field</th>
<th scope="col">value</th>
<th scope="col">{{metricCol.label}}</th>
</tr>
</thead>
<tbody>

4
src/ui/public/agg_table/agg_table_group.html
View file

@ -1,7 +1,7 @@
<table ng-if="rows" class="table agg-table-group" ng-repeat="table in rows">
<thead>
<tr>
<th ng-if="table.tables">
<th ng-if="table.tables" scope="col">
<span class="agg-table-group-header">{{ table.title }}</span>
</th>
</tr>
@ -33,7 +33,7 @@
<table ng-if="columns" class="table agg-table-group">
<thead>
<tr>
<th ng-repeat="table in columns" ng-if="table.tables">
<th ng-repeat="table in columns" ng-if="table.tables" scope="col">
<span class="agg-table-group-header">{{ table.title }}</span>
</th>
</tr>

4
src/ui/public/agg_types/controls/date_ranges.html
View file

@ -1,10 +1,10 @@
<div>
<table class="vis-editor-agg-editor-ranges form-group" ng-show="agg.params.ranges.length">
<tr>
<th>
<th scope="col">
<label id="visEditorDateRangeFrom{{agg.id}}">From</label>
</th>
<th colspan="2">
<th scope="col" colspan="2">
<label id="visEditorDateRangeTo{{agg.id}}">To</label>
</th>
</tr>

6
src/ui/public/agg_types/controls/ip_ranges.html
View file

@ -7,10 +7,10 @@
<div ng-show="agg.params.ipRangeType != 'mask'">
<table class="vis-editor-agg-editor-ranges form-group" ng-show="agg.params.ranges.fromTo.length">
<tr>
<th>
<th scope="col">
<label id="visEditorIpRangeFromLabel{{agg.id}}">From</label>
</th>
<th colspan="2">
<th scope="col" colspan="2">
<label id="visEditorIpRangeToLabel{{agg.id}}">To</label>
</th>
</tr>
@ -65,7 +65,7 @@
<div ng-show="agg.params.ipRangeType == 'mask'">
<table class="vis-editor-agg-editor-ranges form-group" ng-show="agg.params.ranges.mask.length">
<tr>
<th>
<th scope="col">
<label id="visEditorIpRangeCidrLabel{{agg.id}}">CIDR Mask</label>
</th>
</tr>

4
src/ui/public/agg_types/controls/ranges.html
View file

@ -1,9 +1,9 @@
<table class="vis-editor-agg-editor-ranges form-group" ng-show="agg.params.ranges.length">
<tr>
<th>
<th scope="col">
<label id="visEditorRangeFrom{{agg.id}}">From</label>
</th>
<th colspan="2">
<th scope="col" colspan="2">
<label id="visEditorRangeTo{{agg.id}}">To</label>
</th>
</tr>

4
src/ui/public/field_editor/field_editor.html
View file

@ -241,8 +241,8 @@
The type of this field changes across indices. It is unavailable for many analysis functions. The indices per type are as follows:
<table class="table">
<thead>
<th> Field Type </th>
<th> Index Names </th>
<th scope="col"> Field Type </th>
<th scope="col"> Index Names </th>
</thead>
<tbody>
<tr ng-repeat="(type, indices) in editor.field.conflictDescriptions">

16
src/ui/public/field_format_editor/editors/url/url.html
View file

@ -15,7 +15,7 @@
type="checkbox"
ng-model="editor.formatParams.openLinkInCurrentTab"
></input>
<span class="kuiCheckBoxLabel__text">
Open link in current tab
</span>
@ -50,9 +50,9 @@
<caption>Examples</caption>
<thead>
<tr>
<th>Value</th>
<th>Template</th>
<th>Result</th>
<th scope="col">Value</th>
<th scope="col">Template</th>
<th scope="col">Result</th>
</tr>
</thead>
<tbody>
@ -110,10 +110,10 @@
<caption>Examples</caption>
<thead>
<tr>
<th>Value</th>
<th>Url Template</th>
<th>Label Template</th>
<th>Result</th>
<th scope="col">Value</th>
<th scope="col">Url Template</th>
<th scope="col">Label Template</th>
<th scope="col">Result</th>
</tr>
</thead>
<tbody>

4
src/ui/public/field_format_editor/samples/samples.html
View file

@ -14,10 +14,10 @@
<table class="table">
<thead>
<tr>
<th>
<th scope="col">
Input
</th>
<th>
<th scope="col">
Formatted
</th>
</tr>

3
src/ui/public/paginated_table/paginated_table.html
View file

@ -8,6 +8,7 @@
<thead data-test-subj="paginated-table-header">
<tr>
<th
scope="col"
ng-repeat="col in columns"
ng-click="paginatedTable.sortColumn($index)"
kbn-accessible-click
@ -35,7 +36,7 @@
</tbody>
<tfoot ng-if="showTotal">
<tr>
<th ng-repeat="col in columns" class="numeric-value">{{col.total}}</th>
<th scope="col" ng-repeat="col in columns" class="numeric-value">{{col.total}}</th>
</tr>
</tfoot>
</table>

10
ui_framework/doc_site/src/views/header_bar/header_bar_sandbox_content.js
View file

@ -77,19 +77,19 @@ export default () => {
<table className="kuiTable">
<thead>
<tr>
<th className="kuiTableHeaderCell kuiTableHeaderCell--checkBox">
<th scope="col" className="kuiTableHeaderCell kuiTableHeaderCell--checkBox">
<input type="checkbox" className="kuiCheckBox"/>
</th>
<th className="kuiTableHeaderCell">
<th scope="col" className="kuiTableHeaderCell">
Title
</th>
<th className="kuiTableHeaderCell">
<th scope="col" className="kuiTableHeaderCell">
Status
</th>
<th className="kuiTableHeaderCell">
<th scope="col" className="kuiTableHeaderCell">
Date created
</th>
<th className="kuiTableHeaderCell kuiTableHeaderCell--alignRight">
<th scope="col" className="kuiTableHeaderCell kuiTableHeaderCell--alignRight">
Orders of magnitude
</th>
</tr>

2
ui_framework/src/components/table/__snapshots__/table.test.js.snap
View file

@ -10,6 +10,7 @@ exports[`renders KuiTable 1`] = `
<tr>
<th
class="kuiTableHeaderCell"
scope="col"
>
<div
class="kuiTableHeaderCell__liner"
@ -19,6 +20,7 @@ exports[`renders KuiTable 1`] = `
</th>
<th
class="kuiTableHeaderCell"
scope="col"
>
<div
class="kuiTableHeaderCell__liner"

1
ui_framework/src/components/table/__snapshots__/table_header_cell.test.js.snap
View file

@ -5,6 +5,7 @@ exports[`renders KuiTableHeaderCell 1`] = `
aria-label="aria-label"
class="kuiTableHeaderCell testClass1 testClass2"
data-test-subj="test subject string"
scope="col"
>
<div
class="kuiTableHeaderCell__liner"

1
ui_framework/src/components/table/__snapshots__/table_header_check_box_cell.test.js.snap
View file

@ -5,6 +5,7 @@ exports[`renders KuiTableHeaderCheckBoxCell 1`] = `
aria-label="aria-label"
class="kuiTableHeaderCell kuiTableHeaderCell--checkBox testClass1 testClass2"
data-test-subj="test subject string"
scope="col"
>
<div
class="kuiTableHeaderCell__liner"

3
ui_framework/src/components/table/listing_table/__snapshots__/listing_table.test.js.snap
View file

@ -38,6 +38,7 @@ exports[`renders KuiListingTable 1`] = `
<tr>
<th
class="kuiTableHeaderCell kuiTableHeaderCell--checkBox"
scope="col"
>
<div
class="kuiTableHeaderCell__liner"
@ -51,6 +52,7 @@ exports[`renders KuiListingTable 1`] = `
</th>
<th
class="kuiTableHeaderCell"
scope="col"
>
<div
class="kuiTableHeaderCell__liner"
@ -60,6 +62,7 @@ exports[`renders KuiListingTable 1`] = `
</th>
<th
class="kuiTableHeaderCell"
scope="col"
>
<div
class="kuiTableHeaderCell__liner"

7
ui_framework/src/components/table/table_header_cell.js
View file

@ -12,6 +12,7 @@ export const KuiTableHeaderCell = ({
className,
ariaLabel,
align,
scope,
...rest
}) => {
const classes = classNames('kuiTableHeaderCell', className, {
@ -35,6 +36,7 @@ export const KuiTableHeaderCell = ({
return (
<th
className={classes}
scope={scope}
{...rest}
>
<button
@ -55,6 +57,7 @@ export const KuiTableHeaderCell = ({
<th
className={classes}
aria-label={ariaLabel}
scope={scope}
{...rest}
>
<div className="kuiTableHeaderCell__liner">
@ -71,8 +74,10 @@ KuiTableHeaderCell.propTypes = {
isSorted: PropTypes.bool,
isSortAscending: PropTypes.bool,
align: PropTypes.oneOf([LEFT_ALIGNMENT, RIGHT_ALIGNMENT]),
scope: PropTypes.oneOf(['col', 'row', 'colgroup', 'rowgroup']),
};
KuiTableHeaderCell.defaultProps = {
align: LEFT_ALIGNMENT
align: LEFT_ALIGNMENT,
scope: 'col',
};