Skip to content

Conversation

@juliusknorr
Copy link
Member

@juliusknorr juliusknorr commented Jan 10, 2024

Fix https://github.com/nextcloud/andy/issues/8

The hidden input[type=file] is used by the image menu action to trigger a file upload but does not need to be interacted with. I'm not entirely sure why the #editor-container is considered a focussable dom element, but having the tabindex disabled there fixes the tab navigation to be logical.

@juliusknorr
Copy link
Member Author

/backport to stable28

@ShGKme
Copy link
Contributor

ShGKme commented Jan 10, 2024

Note, this input has at the same time:

  • aria-hidden="true" = element should not be visible to assistive technologies like a decorative element
  • class="hidden-visually" = element should be visible via assistive technologies and only hidden visually for a general user

It doesn't make sense to use them simultaneously (except some very specific cases).

If it is a completely hidden element used only programmatically, it can be hide by display: none (v-show="false"). This also makes it not focusable and hidden for assistive technologies.

Examples of correct using class="hidden-visually":

  • Hiding a heading, label elements
  • Hiding input checkbox/radio, when whey are still directly accessible via keyboard or mouse but invisible because of using a custom icon

@juliusknorr
Copy link
Member Author

Thanks for the insight, wasn't aware of that difference.

PR in #5230

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