Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Table headers-id rules refactor #38

Merged
merged 6 commits into from Oct 12, 2017
Merged

Table headers-id rules refactor #38

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
e7b67b2
First commit of rule
kensgists May 9, 2017
e392976
Change pass to passed, fail to failed in Outcomes tables
kensgists May 9, 2017
01d29c5
Split rule into two rules, one manual, one auto, and begin revising s…
kensgists Jun 6, 2017
659bc54
Finished changes to structure for both rules. Both rules are in initi…
kensgists Jun 6, 2017
46f537a
Removed explanations from context and interaction rows in Step questi…
kensgists Jul 13, 2017
620276f
Rule now conforms to HTML 5.1 spec for headers-id associations. Versi…
kensgists Jul 13, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
137 changes: 137 additions & 0 deletions _drafts/SC1-3-1-tables-headers-id-correct.md
View file
Open in desktop
@@ -0,0 +1,137 @@
---
rule_id: SC1-3-1-tables-headers-id-correct
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suggest removing "-correct" from the title to keep it terse.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Need a way to differentiate between the two rules -- one "valid," one "correct"

name: Tables headers-id associations correct
test_mode: semi-automatic
environment: DOM Structure

success_criterion:
- 1.3.1 # Info and relationships (level A)

authors:
- Ken Petri
---

## Description

This rule checks that data table headers-id associations reference correct targets in the correct order.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How would this rule work with other rules for testing tables?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In latest pull, I created a dependency on tables-headers-id-valid rule. Seems like there needs to be a first pass that validates the associations in terms of pure conformance to spec (or, maybe this would be caught by the parser?? and there is no need for the tables-headers-id-value rule???)


## Background

- [F90: Failure of Success Criterion 1.3.1 for incorrectly associating table headers and content via the headers and id attributes](https://www.w3.org/TR/WCAG20-TECHS/F90.html)
- [H43: Using id and headers attributes to associate data cells with header cells in data tables](https://www.w3.org/TR/WCAG20-TECHS/H43.html)
- [F46: Failure of Success Criterion 1.3.1 due to using th elements, caption elements, or non-empty summary attributes in layout tables](https://www.w3.org/TR/WCAG20-TECHS/F46.html)

## Assumptions

- Tables are [well-formed, according to the HTML5.1 specification.](https://www.w3.org/TR/html51/tabular-data.html#forming-a-table).
- Tables pass [tables headers id valid](auto-wcag:SC1-3-1-tables-headers-id-valid).

## Test procedure

### Selector

Loop outward from most deeply nested table.

For each un-marked table, select all elements that match the following CSS selector:

table:not([role=presentation]) th[headers],
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The following table would match this, even though I don't think that it should:

<table><tr><td>
   <table role="presentation"><tr><td headers="">Matching cell</td></tr></table>
</td></tr></table>

The same is true for the selector in the second rule

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tables are treated in isolation -- loop from innermost out, marking that a table has been checked as you move from table to table. Contents of marked tables is ignored on subsequent loops.

I'm open to a change to the selector if there is a way to exclude nested tables, but I couldn't think of a way to do it in CSS.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is it worth filtering out layout tables first? Or would a more specific selector do this?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Checking for role of presentation or none is one options, but not all authors implement that. HTML 5.1 spec has some guidance on what one can check - https://www.w3.org/TR/2014/WD-html51-20140617/tabular-data.html

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@EmmaJP and @cpandhi I changed the rule so that it does a very basic check for the existence of the th[headers] or td[headers] and then just assumes that the author is using these within a data table. Thought this was the simplest approach.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@kensgists Where can I find these changes? I want to make sure we've got a PR for this.

table:not([role=presentation]) td[headers],
table:not([role=none]) th[headers],
table:not([role=none]) td[headers]

### Step 1

Mark table complete.

For each value in each cell `headers` attribute,

find the 'th' referenced,

give the user the following question:

| Property | Value
|----------------------|---------
| Presented item | Highlight a table cell and the related "header" cell.
| Question | Is the cell appropriately categorized by or semantically related with the associated "header" cell?
| Requires context | Yes.
| Requires interaction | Yes.

if yes, continue with [step 2](#step-2)

else, return [step1-fail1](#step1-fail1).

### Step 2

For each value in each cell `headers` attribute,

find the 'th' referenced,

give the user the following question:

| Property | Value
|----------------------|---------
| Presented item | Highlight a table cell and the related header cell. Display the sequence order of the header cell as a number value, as specified by the order in which the header's `id` appears within the cell's `headers` attribute.
| Question | Is the number of the related header consistent with the desired reading sequence?
| Requires context | Yes.
| Requires interaction | Yes.

if yes, return [step2-pass1](#step2-pass1)

else, return [step2-fail1](#step2-fail1).

## Outcome

The resulting assertion is as follows,

| Property | Value
|----------|----------
| type | Assertion
| test | auto-wcag:SC1-3-1-tables-headers-id-correct
| subject | *the selected element*
| mode | semi-automatic
| result | One TestResult from below

### step1-fail1

| Property | Value
|-------------|----------
| type | TestResult
| outcome | Failed
| description | Table cell references an incorrect `th` via the `headers` attribute.


### step1-pass1

| Property | Value
|----------|----------
| type | TestResult
| outcome | Passed

### step2-fail1

| Property | Value
|-------------|----------
| type | TestResult
| outcome | Failed
| description | Table cell references a `th` via the `headers` in an incorrect order.

### step2-pass1

| Property | Value
|----------|----------
| type | TestResult
| outcome | Passed

## Implementation Tests

Implementation tests are available at: <placeholder>

## Change log

### Version 0.2
- Removed explanations from Requires context and Requires interaction rows in Step 1 and Step 2 questions.
- Rule now conforms to HTML 5.1 spec: `headers` can only reference a `th`.
- Added recommended dependency on [tables headers id valid](auto-wcag:SC1-3-1-tables-headers-id-valid).

### Version 0.1
- Initial draft of rule.
95 changes: 95 additions & 0 deletions _drafts/SC1-3-1-tables-headers-id-valid.md
View file
Open in desktop
@@ -0,0 +1,95 @@
---
rule_id: SC1-3-1-tables-headers-id-valid
name: Tables headers-id associations valid
test_mode: automatic
environment: DOM Structure

success_criterion:
- 1.3.1 # Info and relationships (level A)

authors:
- Ken Petri
---

## Description

This rule checks that data table `headers` attributes have values that reference `td` or `th` elements in the same table.

## Background

- [F90: Failure of Success Criterion 1.3.1 for incorrectly associating table headers and content via the headers and id attributes](https://www.w3.org/TR/WCAG20-TECHS/F90.html)
- [H43: Using id and headers attributes to associate data cells with header cells in data tables](https://www.w3.org/TR/WCAG20-TECHS/H43.html)
- [F46: Failure of Success Criterion 1.3.1 due to using th elements, caption elements, or non-empty summary attributes in layout tables](https://www.w3.org/TR/WCAG20-TECHS/F46.html)

## Assumptions

- Tables are [well-formed, according to the HTML5.1 specification.](https://www.w3.org/TR/html51/tabular-data.html#forming-a-table).

## Test procedure

### Selector

Loop outward from most deeply nested table.

For each un-marked table, select all elements that match the following CSS selector:

table:not([role=presentation]) th[headers],
table:not([role=presentation]) td[headers],
table:not([role=none]) th[headers],
table:not([role=none]) td[headers]

### Step 1

Mark table completed.

For each value in each cell `headers` attribute,

check that the value references an `id` attribute value of a `th` within the currently selected table,

if yes, return [step1-pass1](#step1-pass1)

else, return [step1-fail1](#step1-fail1).

## Outcome

The resulting assertion is as follows,

| Property | Value
|----------|----------
| type | Assertion
| test | auto-wcag:SC1-3-1-tables-headers-id-valid
| subject | *the selected element*
| mode | automatic
| result | One TestResult from below

### step1-fail1

| Property | Value
|-------------|----------
| type | TestResult
| outcome | Failed
| description | Table cell's `headers` attribute contains an `id` that does not correspond to a `th` in the same table.

### step1-pass1

| Property | Value
|----------|----------
| type | TestResult
| outcome | Passed

## Implementation Tests

Implementation tests are available at: <placeholder>

## Change log

### Version 0.3
- Rule now conforms to HTML 5.1 spec: `headers` can only reference a `th`.

### Version 0.2
- Refactored into an automatic rule (this one) and a semi-automatic rule, [tables headers id correct](auto-wcag:SC1-3-1-tables-headers-id-correct).
- Selector corrected.
- Ensures selector tests only a single table at a time (for nested tables).
- Conforms to rule template.