Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

fix: make download button accessible via keyboard #8974

Conversation

morsko1
Copy link
Contributor

@morsko1 morsko1 commented Jun 29, 2023

Make download button accessible via keyboard.

Description

Download button was implemented using div tag. That's why it was inaccessible via keyboard.

Motivation and Context

Fixes #8881

How Has This Been Tested?

See description in #8881

Screenshots (if appropriate):

Checklist

My PR contains...

  • No code changes (src/ is unmodified: changes to documentation, CI, metadata, etc.)
  • Dependency changes (any modification to dependencies in package.json)
  • Bug fixes (non-breaking change which fixes an issue)
  • Improvements (misc. changes to existing features)
  • Features (non-breaking change which adds functionality)

My changes...

  • are breaking changes to a public API (config options, System API, major UI change, etc).
  • are breaking changes to a private API (Redux, component props, utility functions, etc.).
  • are breaking changes to a developer API (npm script behavior changes, new dev system dependencies, etc).
  • are not breaking changes.

Documentation

  • My changes do not require a change to the project documentation.
  • My changes require a change to the project documentation.
  • If yes to above: I have updated the documentation accordingly.

Automated tests

  • My changes can not or do not need to be tested.
  • My changes can and should be tested by unit and/or integration tests.
  • If yes to above: I have added tests to cover my changes.
  • If yes to above: I have taken care to cover edge cases in my tests.
  • All new and existing tests passed.

@char0n
Copy link
Member

char0n commented Jul 27, 2023

@morsko1 you've change the order of Copy and Download buttons. Any particular reason?

@morsko1
Copy link
Contributor Author

morsko1 commented Jul 28, 2023

@morsko1 you've change the order of Copy and Download buttons. Any particular reason?

@char0n Actually, the button order in the template was incorrect. The Copy button is displayed before the Download button in the UI (you can see that in Petstore example).

So, I have updated the button order and changed the tag of the Download button from div to button.

As a result, the keyboard navigation works as expected.

Copy link
Member

@char0n char0n left a comment

Choose a reason for hiding this comment

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

LGTM! I can confirm keyboard navigation now works by running the branch locally. Thanks for contributing!

@char0n char0n merged commit c90ef50 into swagger-api:master Aug 16, 2023
# for free to join this conversation on GitHub. Already have an account? # to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

a11y: 'Download' button is not accessible via keyboard
2 participants