Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Don't set a tabindex=0 when the toolbar has data-no-focus attribute applied #73

Merged
merged 5 commits into from
Sep 22, 2023

Conversation

jonrohan
Copy link
Member

@jonrohan jonrohan commented Sep 7, 2023

The markdown-toolbar element is grabbing focus when using data-no-focus. I think this is because of the tabindex that's being applied.

image

To fix this, I'm moving the this.hasAttribute('data-no-focus') into the connectedCallback constructor and also avoiding adding eventListeners when this occurs

@jonrohan jonrohan requested a review from a team as a code owner September 7, 2023 22:10
@primer-css
Copy link

👋 Hello and thanks for pinging us! This issue or PR has been added to our inbox and a Primer first responder will review it soon.

  • 🎨 If this is a PR that includes a visual change, please make sure to add screenshots in the description or deploy this code to a lab machine with instructions for how to test.
  • If this is a PR that includes changes to an interaction, please include a video recording in the description.
  • ⚠️ If this is urgent, please visit us in #primer on Slack and tag the first responders listed in the channel topic.

@@ -366,7 +367,6 @@ function focusKeydown(event: KeyboardEvent) {
if (key !== 'ArrowRight' && key !== 'ArrowLeft' && key !== 'Home' && key !== 'End') return
const toolbar = event.currentTarget
if (!(toolbar instanceof HTMLElement)) return
if (toolbar.hasAttribute('data-no-focus')) return

Choose a reason for hiding this comment

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

Does this line need to be removed? I see it prevents arrow keys from functioning when the toolbar has the attribute.

@keithamus keithamus merged commit 666d0c2 into main Sep 22, 2023
1 check passed
@keithamus keithamus deleted the data_no_focus_bug branch September 22, 2023 16:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants