Change figure & figcaption accName computation

[scottaohara]

resolves #325

This PR revises the mappings for figure and figcaption to remove the "labelled by" relations, changing them to "details for".
The accessible name computation for figure removes figcaption, a note is added to further reference this change.

• need to update to UIA mapping (core aam issue: Update aria-details mapping for UIA core-aam#110)
• do we want figcaption to map to caption (this is probably a 'yes', but want confirmation)?
• regardless of above, caption will need to be updated in regards to its referencing figure and figcaption relationships (ARIA PR: revise caption definition aria#1703)
• aria-details definition should be updated to reference this change (ARIA PR: include mention of figure/caption aria#1704)

Implementation commitment:

• WebKit (https://bugs.webkit.org/show_bug.cgi?id=)
• Chromium
• Gecko (https://bugzilla.mozilla.org/show_bug.cgi?id=)

---

Preview | Diff

[scottaohara]

referencing this thread as a very good example of why this change needs to be made: WICG/proposals#45

per what's being discussed there, if an entire video transcript were placed within a figcaption, the flattened text string of the transcript would become the accessible name for the parent figure.... and that would be awful. In contrast, this is a perfectly reasonable thing to use a figure and figcaption for... hence these mapping changes would be beneficial here.

[cookiecrook]

I'll have to stop short of "approving" since I'm not the right person to review ATK or IA2 changes. I see no issues with the other parts of the PR.

[carmacleod]

Aside: As this will be one more element that can only reasonably get its accessible name from aria and not from html (ignoring title attribute), it becomes even more important to have a new html mechanism to give an element an accessible name.

[aleventhal]

Approve for ATK/IA2 parts, but I think we should follow up with Microsoft and Apple before merging.

[aleventhal]

Ah, I found that Chrome uses NSAccessibilityDetailsElementsAttribute aka AXDetailsElements.
Here's the bug where we landed it: https://bugs.chromium.org/p/chromium/issues/detail?id=1216049
We followed WebKit's lead. There are links in the bug to the WebKit change as well.

[scottaohara]

@benbeaudry could use your help with the UIA mappings so we can get this merged.

[scottaohara]

Another thing that has come to my attention is adding a comment to NOT expose the details relationship in the event an author has associated the figure and figcaption via aria-labelledby. In such a case, it would likely be less noisy to drop the details association since the author is specifically referencing the element as the figure's name. e.g.,

<figure aria-labelledby=n>
  <figcaption id=n>this becomes the name</figcaption>
  whatever the content of the figcaption is here.
</figure>

[jnurthen]

@benbeaudry could use your help with the UIA mappings so we can get this merged.

[scottaohara]

@benbeaudry, @jnurthen this is ready for re-review and thanks to ben's core aam updates for aria-details i got the info i needed to complete this. so, if everyone can give this one last look, then i think we can merge and get remaining implementation bugs filed for webkit/firefox.

cc @cookiecrook @jcsteh

[scottaohara]

created some markup tests with comments describing expectations:

<!--
  no accName
  no accDescription
  no details relationship due to lack of child figcaption element
-->
<figure>
  <img src="test.jpg" alt="test">
  <p>more content</p>
</figure>


<!--
  no accName
  no accDescription
  no details relationship due to lack of valid child figcaption element
-->
<figure>
  <img src="test.jpg" alt="test">
  <p>more content</p>
  <div>
    <figcaption>invalid details</figcaption>
  </div>
</figure>


<!--
  no accName
  no accDescription
  details relationship with child figcaption
-->
<figure>
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>


<!--
  no accName
  no accDescription
  details relationship with child figcaption
-->
<figure>
  <figcaption>details</figcaption>
  <img src="test.jpg" alt="test">
</figure>


<!--
  no accName
  no accDescription
  details relationship with first child figcaption
-->
<figure>
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
  <figcaption>not details</figcaption>
</figure>


<!--
  accName: 'label'
  no accDescription
  details relationship with child figcaption
-->
<figure aria-label=label>
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>


<!--
  accName: 'label'
  accDescription: 'title'
  details relationship with child figcaption
-->
<figure aria-label=label title=title>
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>


<!--
  accName: 'title'
  no accDescription
  details relationship with child figcaption
-->
<figure title=title>
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>


<!--
  accName: 'name'
  accDescription: 'title'
  details relationship with child figcaption
-->
<p id=n>name</p>
<figure aria-labelledby=n title=title>
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>


<!--
  accName: 'name'
  accDescription: 'title'
  details relationship with child figcaption
-->
<p id=n>name</p>
  <figure aria-labelledby=n aria-label=label title=title>
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>


<!--
  accName: 'caption'
  accDescription: 'title'
  no details relationship with child figcaption because it is used for accName
-->
<figure aria-labelledby=c aria-label=label title=title>
  <img src="test.jpg" alt="test">
  <figcaption id=c>caption</figcaption>
</figure>


<!--
  accName: 'label'
  accDescription: 'caption'
  no details relationship with child figcaption because it is used for accDescription
-->
<figure aria-label=label aria-describedby=c>
  <img src="test.jpg" alt="test">
  <figcaption id=c>caption</figcaption>
</figure>


<!--
  accName: 'label'
  accDescription: 'description'
  details relationship with child figcaption
-->
<figure aria-label=label aria-description="description">
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>


<!--
  no accName
  no accDescription
  no details relationship due to explicit aria-details=""
-->
<figure aria-details="">
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>


<!--
  accName: 'label'
  accDescription: 'description'
  details relationship with div#foo.  No details relationship with child figcaption
-->
<figure aria-details="foo">
  <img src="test.jpg" alt="test">
  <figcaption>not details</figcaption>
</figure>
<div id=foo>details</div>



<!-- 
  ###
  aria-owns test ideas
  ###
 -->

<!--
  no accName
  no accDescription
  details relationship with reparented figcaption via aria-owns
-->
<figure aria-owns=f>
  <img src="test.jpg" alt="test">
</figure>
<figcaption id=f>details</figcaption>


<!--
  no accName
  no accDescription
  details relationship with child figcaption. Reparented figcaption would be
  the last child element in the figcaption's a11y tree, thus it cannot be
  the first child instance used as a details reference.
-->
<figure aria-owns=f>
  <img src="test.jpg" alt="test">
  <figcaption>details</figcaption>
</figure>
<figcaption id=f>not details</figcaption>

[cookiecrook]

Actually I didn't realize this update would require rolling back some WebKit implementation changes wrt figcaption... I think this needs WPT tests to fully qualify the implications of the change, especially the parts about accounting for multiple figcaptions... I think you could easily convert the above examples into a WPT test.

[jcsteh]

For figure, we're explicit that aria-labelledby, aria-describedby or aria-details prevent exposure of the details relation. However, we're not similarly explicit here for the reverse relation. Common sense will hopefully prevail, but I don't love relying on common sense for a spec. Is there something I'm missing that would otherwise make this explicit?

This is a similar situation to https://github.com/w3c/html-aam/pull/481/files#r1424943049. It seems we tend to use ARIA to express roles in a cross-platform manner wherever possible now, but we don't do that for relations, I guess largely because reverse relations and the details-roles attribute complicate things.