Skip to content

Commit

Permalink
Consolidate button command popover states
Browse files Browse the repository at this point in the history 
taking aaron's feedback, re-combined the popover commands into a single table, since they all should match.

similarly, combined the close and show-modal into a single table - as these also should have matched.  this means i removed all the extra aria-expanded mappings that were in the close command.  but we dont need these.  a close button won't exist outside of a modal dialog, since it'd be inert.  and we don't need expanded states on the close button, because someone is already within the dialog.
  • Loading branch information
@scottaohara
scottaohara authored Dec 10, 2024
1 parent 733c39e commit 683691d
Showing 1 changed file with 13 additions and 206 deletions.
219 changes: 13 additions & 206 deletions html-aam/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1257,14 +1257,19 @@ <h4 id="el-button">`button`</h4>
</tr>
</tbody>
</table>
<h4 id="el-button-command-togglepopover">`button` <span class="el-context">(`command` attribute in the Toggle popover state)</span></h4>
<table aria-labelledby="el-button-command-togglepopover">
<h4 id="el-button-command-popovers">`button` <span class="el-context">(`command` attribute in the Toggle, Show, and Hide popover states)</span></h4>
<table aria-labelledby="el-button-command-popovers">
<tbody>
<tr>
<th>HTML Specification</th>
<td>
<a data-cite="html">`button`</a>
<span class="el-context">(<a data-cite="html/button.html#attr-input-command">`command`</a> attribute in the <a data-cite="html/input.html#attr-button-command-toggle-popover-state">Toggle popover</a> state)</span>
<span class="el-context">
(<a data-cite="html/button.html#attr-input-command">`command`</a> attribute in the
<a data-cite="html/input.html#attr-button-command-toggle-popover-state" id="el-button-command-toggle-popover">Toggle popover state</a>
<a data-cite="html/input.html#attr-button-command-show-popover-state" id="el-button-command-showpopover">Show popover state</a>
<a data-cite="html/input.html#attr-button-command-hide-popover-state" id="el-button-command-hidepopover">Hide popover state</a>)
</span>
</td>
</tr>
<tr>
Expand Down Expand Up @@ -1329,222 +1334,24 @@ <h4 id="el-button-command-togglepopover">`button` <span class="el-context">(`com
</tr>
</tbody>
</table>
<h4 id="el-button-command-showpopover">`button` <span class="el-context">(`command` attribute in the Show popover state)</span></h4>
<table aria-labelledby="el-button-command-showpopover">
<h4 id="el-button-command-dialogs">`button` <span class="el-context">(`command` attribute in the Close and Show Modal states)</span></h4>
<table aria-labelledby="el-button-command-dialogs">
<tbody>
<tr>
<th>HTML Specification</th>
<td>
<a data-cite="html">`button`</a>
<span class="el-context">(<a data-cite="html/button.html#attr-input-command">`command`</a> attribute in the <a data-cite="html/input.html#attr-button-command-show-popover-state">Show popover</a> state)</span>
<span class="el-context">(<a data-cite="html/button.html#attr-input-command">`command`</a> attribute in the
<a data-cite="html/input.html#attr-button-command-close-state">Close state</a>)
<a data-cite="html/input.html#attr-button-command-close-state">Show Modal state</a>)</span>
</td>
</tr>
<tr>
<th>[[WAI-ARIA-1.2]]</th>
<td>
<a class="core-mapping" href="#role-map-button">`button`</a> role.
<p>
If the associated element is displayed as a popover:
<a class="core-mapping" href="#ariaExpandedTrue">`aria-expanded=true`</a>
</p>
<p>
If the the associated element is hidden, or not present in the DOM:
<a class="core-mapping" href="#ariaExpandedFalse">`aria-expanded=false`</a>
</p>
<p>
If the the associated element is an accessibility ancestor of the element with the `command` attribute:
<a class="core-mapping" href="#ariaExpandedUndefined">`aria-expanded=undefined`</a>
</p>
</td>
</tr>
<tr>
<th>
<a href="https://msdn.microsoft.com/en-us/library/dd373608%28v=VS.85%29.aspx">MSAA</a> + <a href="http://accessibility.linuxfoundation.org/a11yspecs/ia2/docs/html/">IAccessible2</a>
</th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
<div class="objattrs"><span class="type">Object attributes:</span> `details-roles:popover`</div>
</td>
</tr>
<tr>
<th><a href="https://msdn.microsoft.com/en-us/library/ms726297%28v=VS.85%29.aspx">UIA</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
</td>
</tr>
<tr>
<th><a href="https://gnome.pages.gitlab.gnome.org/atk/">ATK</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
<div class="objattrs"><span class="type">Object attributes:</span> `details-roles:popover`</div>
</td>
</tr>
<tr>
<th><a href="https://developer.apple.com/reference/appkit/nsaccessibility">AX</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
</td>
</tr>
<tr>
<th>Comments</th>
<td>
<p>User Agents MUST expose an <a class="core-mapping" href="#ariaDetails">`aria-details`</a> relation with the associated element <strong>except</strong> under the following
conditions:
</p>
<ul>
<li>The associated popover element is the next immediate accessibility sibling to the invoking element,</li>
</ul>
<p class="note">A button that represents a <a data-cite="html/forms.html#concept-submit-button">submit button</a> with a [=button/form owner=] cannot invoke a command.</p>
</td>
</tr>
</tbody>
</table>
<h4 id="el-button-command-hidepopover">`button` <span class="el-context">(`command` attribute in the Hide popover state)</span></h4>
<table aria-labelledby="el-button-command-hidepopover">
<tbody>
<tr>
<th>HTML Specification</th>
<td>
<a data-cite="html">`button`</a>
<span class="el-context">(<a data-cite="html/button.html#attr-input-command">`command`</a> attribute in the <a data-cite="html/input.html#attr-button-command-hide-popover-state">Hide popover</a> state)</span>
</td>
</tr>
<tr>
<th>[[WAI-ARIA-1.2]]</th>
<td>
<a class="core-mapping" href="#role-map-button">`button`</a> role.
<p>
If the associated element is displayed as a popover:
<a class="core-mapping" href="#ariaExpandedTrue">`aria-expanded=true`</a>
</p>
<p>
If the the associated element is hidden, or not present in the DOM:
<a class="core-mapping" href="#ariaExpandedFalse">`aria-expanded=false`</a>
</p>
<p>
If the the associated element is an accessibility ancestor of the element with the `command` attribute:
<a class="core-mapping" href="#ariaExpandedUndefined">`aria-expanded=undefined`</a>
</p>
</td>
</tr>
<tr>
<th>
<a href="https://msdn.microsoft.com/en-us/library/dd373608%28v=VS.85%29.aspx">MSAA</a> + <a href="http://accessibility.linuxfoundation.org/a11yspecs/ia2/docs/html/">IAccessible2</a>
</th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
<div class="objattrs"><span class="type">Object attributes:</span> `details-roles:popover`</div>
</td>
</tr>
<tr>
<th><a href="https://msdn.microsoft.com/en-us/library/ms726297%28v=VS.85%29.aspx">UIA</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
</td>
</tr>
<tr>
<th><a href="https://gnome.pages.gitlab.gnome.org/atk/">ATK</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
<div class="objattrs"><span class="type">Object attributes:</span> `details-roles:popover`</div>
</td>
</tr>
<tr>
<th><a href="https://developer.apple.com/reference/appkit/nsaccessibility">AX</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
</td>
</tr>
<tr>
<th>Comments</th>
<td>
<p>User Agents MUST expose an <a class="core-mapping" href="#ariaDetails">`aria-details`</a> relation with the associated element <strong>except</strong> under the following
conditions:
</p>
<ul>
<li>The associated popover element is the next immediate accessibility sibling to the invoking element,</li>
</ul>
<p class="note">A button that represents a <a data-cite="html/forms.html#concept-submit-button">submit button</a> with a [=button/form owner=] cannot invoke a command.</p>
</td>
</tr>
</tbody>
</table>
<h4 id="el-button-command-close">`button` <span class="el-context">(`command` attribute in the Close state)</span></h4>
<table aria-labelledby="el-button-command-close">
<tbody>
<tr>
<th>HTML Specification</th>
<td>
<a data-cite="html">`button`</a>
<span class="el-context">(<a data-cite="html/button.html#attr-input-command">`command`</a> attribute in the <a data-cite="html/input.html#attr-button-command-close-state">Close</a> state)</span>
</td>
</tr>
<tr>
<th>[[WAI-ARIA-1.2]]</th>
<td>
<a class="core-mapping" href="#role-map-button">`button`</a> role.
<p>
If the associated element is an open dialog:
<a class="core-mapping" href="#ariaExpandedTrue">`aria-expanded=true`</a>
</p>
<p>
If the the associated element is hidden, or not present in the DOM:
<a class="core-mapping" href="#ariaExpandedFalse">`aria-expanded=false`</a>
</p>
<p>
If the the associated element is an accessibility ancestor of the element with the `command` attribute:
<a class="core-mapping" href="#ariaExpandedUndefined">`aria-expanded=undefined`</a>
</p>
</td>
</tr>
<tr>
<th>
<a href="https://msdn.microsoft.com/en-us/library/dd373608%28v=VS.85%29.aspx">MSAA</a> + <a href="http://accessibility.linuxfoundation.org/a11yspecs/ia2/docs/html/">IAccessible2</a>
</th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
</td>
</tr>
<tr>
<th><a href="https://msdn.microsoft.com/en-us/library/ms726297%28v=VS.85%29.aspx">UIA</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
</td>
</tr>
<tr>
<th><a href="https://gnome.pages.gitlab.gnome.org/atk/">ATK</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
</td>
</tr>
<tr>
<th><a href="https://developer.apple.com/reference/appkit/nsaccessibility">AX</a></th>
<td>
<div class="general">Use WAI-ARIA mapping</div>
</td>
</tr>
<tr>
<th>Comments</th>
<td>
<p class="note">A button that represents a <a data-cite="html/forms.html#concept-submit-button">submit button</a> with a [=button/form owner=] cannot invoke a command.</p>
</td>
</tr>
</tbody>
</table>
<h4 id="el-button-command-showmodal">`button` <span class="el-context">(`command` attribute in the Show modal state)</span></h4>
<table aria-labelledby="el-button-command-showmodal">
<tbody>
<tr>
<th>HTML Specification</th>
<td>
<a data-cite="html">`button`</a>
<span class="el-context">(<a data-cite="html/button.html#attr-input-command">`command`</a> attribute in the <a data-cite="html/input.html#attr-button-command-show-modal-state">Show modal</a> state)</span>
</td>
</tr>
<tr>
<th>[[WAI-ARIA-1.2]]</th>
<td><a class="core-mapping" href="#role-map-button">`button`</a> role.</td>
</tr>
<tr>
<th>
<a href="https://msdn.microsoft.com/en-us/library/dd373608%28v=VS.85%29.aspx">MSAA</a> + <a href="http://accessibility.linuxfoundation.org/a11yspecs/ia2/docs/html/">IAccessible2</a>
Expand Down

0 comments on commit 683691d

Please sign in to comment.