Skip to content

Conversation

@juliusknorr
Copy link
Member

Hide the input field properly to make it not focusable and hidden for assistive technologies.

as described in #5224 (comment)

@juliusknorr
Copy link
Member Author

/backport to stable28

data-text-el="attachment-file-input"
type="file"
accept="*/*"
aria-hidden="true"
Copy link
Member Author

Choose a reason for hiding this comment

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

@ShGKme Also do we still need the aria-hidden then or is this already fine with just having display: none; through v-show

Copy link
Contributor

Choose a reason for hiding this comment

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

No, display: none (and visibility: hidden) both make element completely hidden.

Let's say, be default element is visible for both monitor's and screen reader's users.

  • display: none/visibility: hidden - hides element completely for everything
  • aria-hidden="true" - hides element only for screen readers (meaning, it is not important element, like decorative image)
  • hidden-visually - hides element only visually (meaning, this is only for screen reader or replaces some only visual element)

One specific case when aria-hidden="true" and hidden-visually used together - the prev and next slides in Viewer. They must be hidden, but for image/video pre-loading and because of a bug in FF we need then to not be display: none.

Copy link
Member Author

Choose a reason for hiding this comment

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

Thanks, that makes sense ❤️

@juliusknorr juliusknorr force-pushed the bugfix/noid/a11y-input-file branch from 9179e7b to 31ab596 Compare January 11, 2024 11:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants