1980483 - Provide a way to exclude the <article> nested in <moz-card> from the a11y tree

Status: NEW

(Toolkit :: UI Widgets, enhancement)

Description

[Hanna Jones [:hjones]]

In discussing our plan for implementing the new settings designs by using <moz-fieldset>s wrapped in <moz-card>s accessibility folks mentioned that we would ideally exclude the <article> in the card from the accessibility tree, since <moz-fieldset> is already serves to group everything. We would still want to expose the <article> in all other cases, regardless of whether or not it has a heading. Likely the easiest way to achieve this would just be to add support for a role property/attr to moz-card that would be mapped to the inner <article> element. We could then supply role="presentation" or something similar.

static properties = {
  role: { type: String, mapped: true },
  ...
}

...

<article role=${ifDefined(this.role)}>
...
</article>