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

Properly cancel keydown events after handling #344

Merged
merged 3 commits into from
Feb 6, 2018

Conversation

timroes
Copy link
Contributor

@timroes timroes commented Jan 29, 2018

Whenever we handle a keydown event, we should properly prevent it's default behavior and also stop propagation to parent nodes. Otherwise the same Escape keypress could close multiple components.

I have the case where I have an EuiCodeBlock in an EuiFlyout. If you now open the code block fullscreen and press Escape both components will close, because the EuiCodeBlock doesn't stop propagation when handling its close event.

That same will be true for any of these components if you place them in something else, that tries to handle the same keypress. In general: if we handle a keyevent we should prevent it's default behavior and stop its propagation.

@timroes timroes added the bug label Jan 29, 2018
@timroes timroes requested review from snide and cjcenizal January 29, 2018 10:15
CHANGELOG.md Outdated
@@ -2,6 +2,10 @@

No public interface changes since `0.0.15`.

**Bug fixes**

- Stop propagation and prevent default when closing components. [(#344)](https://github.com/elastic/eui/pull/344)
Copy link
Contributor

Choose a reason for hiding this comment

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

Can we flesh this out?

- Stop propagation and prevent default when closing components. Otherwise the same Escape keypress could close the parent component(s) as well as the one you intend to close. [(#344)](https://github.com/elastic/eui/pull/344)

@cjcenizal
Copy link
Contributor

@timroes Did you look in popover too? I think ESC is used to close that component as well.

@timroes
Copy link
Contributor Author

timroes commented Jan 29, 2018

@cjcenizal you were right. I searched the whole repository, but for event.keyCode, that's how popover and context menu panel slipped through. Also fixed the CHANGELOG

Copy link
Contributor

@cjcenizal cjcenizal left a comment

Choose a reason for hiding this comment

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

LGTM! Did you test this and verify that it solved the original problem?

@timroes
Copy link
Contributor Author

timroes commented Jan 30, 2018

@cjcenizal yeah it fixes the issue.

@cjcenizal
Copy link
Contributor

Is this ready to be merged @timroes ?

@timroes
Copy link
Contributor Author

timroes commented Feb 5, 2018

Yeah, just waiting for the second review, or can we also merge with one review in EUI?

@cjcenizal
Copy link
Contributor

I think one is OK, it's up to you.

@timroes timroes merged commit 1d633bf into elastic:master Feb 6, 2018
@timroes timroes deleted the fix-keyevents branch February 6, 2018 12:40
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.

3 participants