Make the PR Badge into a button component #18268
Merged
+27
−10
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
tidy-dev
changed the title
tidy-dev
commented
Mar 7, 2024
| @@ -14,7 +15,10 @@ interface IPullRequestBadgeProps { | |||
| /** The GitHub repository to use when looking up commit status. */ | |||
| readonly repository: GitHubRepository | |||
|
|
|||
| readonly onBadgeRef?: (ref: HTMLDivElement | null) => void | |||
| /** Whether or not the check runs popover is open */ | |||
| readonly showCIStatusPopover?: boolean | |||
There was a problem hiding this comment.
This attribute is optional because this component is also used in our pull request quick view component and it is not used as a button there. Since the pull request quick view component is feature flagged to development and work is currently stopped on it, I did not think it was worth the time handling the "non-button" view of this component. This can be reworked if that work is picked up again.
tidy-dev
commented
Mar 7, 2024
| @@ -80,16 +82,22 @@ export class PullRequestBadge extends React.Component< | |||
| public render() { | |||
| const ref = getPullRequestCommitRef(this.props.number) | |||
| return ( | |||
| // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions | |||
There was a problem hiding this comment.
Yay! Getting rid of three a11y linter disables!
jacortinas
approved these changes
Mar 7, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
xref https://github.com/github/accessibility-audits/issues/6878
Description
This PR updates the PR-badge control to be a button with appropriate
aria-has-popupandaria-expandedsemantics since it is responsible for opening a popover.Screenshots
CleanShot.2024-03-07.at.12.10.27.mp4
Release notes
Notes: [Fixed] The pull request check runs button is keyboard accessible.