Update role for attachments

[corinagum]

Fixes #3537

Changelog Entry

• Fixes #3537. [Accessibility]: Ensure aria-roledescription is only used on elements with implicit/explicit role based off of WAI ARIA role attributes, by @corinagum in PR #3551 and #3583

Description

I missed attachments.

Design

Specific Changes

-

• I have added tests and executed them locally
• I have updated CHANGELOG.md
• I have updated documentation

Review Checklist

This section is for contributors to review your work.

• Accessibility reviewed (tab order, content readability, alt text, color contrast)
• Browser and platform compatibilities reviewed
• CSS styles reviewed (minimal rules, no z-index)
• Documents reviewed (docs, samples, live demo)
• Internationalization reviewed (strings, unit formatting)
• package.json and package-lock.json reviewed
• Security reviewed (no data URIs, check for nonce leak)
• Tests reviewed (coverage, legitimacy)

[compulim]

I think we want to "make sure all elements with aria-roledescription will have role attribute set". So I think a better test would be:

• For all elements with aria-roledescription
  • Make sure they have role attribute set

Converting the statement to code:

const valid = [].every.call(
  document.querySelectorAll('[aria-roledescription]'),
  element => element.getAttribute('role')
);

expect(valid).toBe(true);

Or, to find out offenders:

const invalidElements = [].find.call(
  document.querySelectorAll('[aria-roledescription]'),
  element => !element.getAttribute('role')
);

invalidElements.length &&
  console.error('Elements with "aria-roledescription" attribute but not "role" attribute', { invalidElements });

expect(invalidElements).toHaveProperty('length', 0);