Lightrun
question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Checkbox: focus not properly activated on click

See original GitHub issue

Steps

  1. Add a checkbox: <Checkbox label="Label"/>
  2. Click the checkbox or the label.

Expected Result

The checkbox should get focus. onFocus should be triggered.

Actual Result

On Windows 7 64-bit: Firefox 51.0.1 (32-bit): The checkbox does not get focus. onFocus is not triggered. Chromium 58.0.3009.0 (64-bit): The checkbox does not get focus. onFocus is not triggered. Internet Explorer 11.0.9600.18537: onFocus is triggered (as well as onBlur), but the focus is not visible.

In all three browsers the focus works as expected when using the tab key.

Checkboxes in core Semantic UI work as expected.

Version

0.64.8

Testcase

http://codepen.io/anon/pen/apMgvO

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:22 (19 by maintainers)

github_iconTop GitHub Comments

1reaction
levithomasoncommented, Feb 21, 2017

Try googling it 😉

0reactions
layershiftercommented, Jun 12, 2017

@skleeschulte Thanks for feedback, seems we really overlooked something.

Expected behaviour

peek 2017-06-12 15-02

Read more comments on GitHub >

github_iconTop Results From Across the Web

Jquery focus() with checkboxes problem - input - Stack Overflow
I would try click. focus may have issues with the checkbox. the event may happen before the check/tick is rendered. May cause it...
Read more >
Checkbox - Accessibility Matters
The checkbox can be activated only by clicking on the box only. If the user clicked on the text, it won't be activated....
Read more >
Focus management with Vue refs - Learn web development
Activate the "Edit" button by pressing Enter . The checkbox will be replaced with our edit component, but the focus outline will be...
Read more >
Styling checkboxes and radio buttons with CSS
The change in border colour clearly indicates the active or focused element, so we can disable the default outline. Note that we add...
Read more >
Focusing: focus/blur - The Modern JavaScript Tutorial
An element receives the focus when the user either clicks on it or uses the Tab key on the keyboard. There's also an...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found
Previous page

bug(Popup): invalid usage of oneOfType in propTypes

Next page

Dropdown won't open in IE if openOnFocus is false